﻿@charset "UTF-8";
.sp-br{
  display: none;
}
.round_btn {
  display: block;
  position: absolute;
  top: 0;
  right: -0;
  width: 50px;
  height: 50px;
  background: #fff; /* ボタンの背景色 */
  z-index: 9999;
}
.round_btn:hover {
  cursor: pointer;
}
.round_btn::before, .round_btn::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 3px; /* 棒の幅（太さ） */
  height: 30px; /* 棒の高さ */
  background: #333; /* バツ印の色 */
}
.round_btn::before {
  transform: translate(-50%,-50%) rotate(45deg);
}
.round_btn::after {
  transform: translate(-50%,-50%) rotate(-45deg);
}
.modal_fix{
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 10000;
  text-align: center;
  white-space: nowrap;
  cursor: pointer;
  background-color: rgba(6,0,0,0.65);
}
.modal {
	color: #333 !important;
}
.modal .modal_title{
  margin: 20px 0;
  font-size: 25px;
  font-weight: bold;
  text-align: center;
}
.modal .modal_text{
  margin-bottom: 50px;
  font-size: 20px;
  line-height: 1.5;
  text-align: center;
}
.modal .modal_text-text {
  margin-bottom: 10px;
}

.modal .modal_content{
  z-index: 10001;
  position: fixed;
  inset: 0;
  margin: auto;
  text-align: left;
  vertical-align: middle;
  overflow: auto;
  font-size: 16px;
  padding: 50px;
/*  margin: 15% 25%;*/
  width: 65%;
  height: 55%;
  background: #fff;
  cursor: auto;
  white-space: normal;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-flow: column;
}
.close_btn{
  width: 97px;
  padding: 10px 20px;
  cursor: pointer;
  text-align: center;
  border: 1px solid;
  margin: 0 auto;
}
@media screen and (max-width: 910px){
  .modal .modal_text{
  font-size: min(2vw, 16px);
}
}
@media screen and (max-width: 767px){
  .sp-br{
    display: block;
  }
  .modal .modal_content{
    width: 85%;
    padding: 30px 5px;
    /*margin: 60% 10%;*/
    height: fit-content;
  }
  .modal .modal_title{
    font-size: 5vw;
  }
  .modal .modal_text{
    font-size: 3vw;
    margin-bottom: 20px;
  }
  .modal .modal_text-text,
  .modal .modal_text-term {
    font-size: 3vw;
  }
  .close_btn{
    width: 16vw;
    padding: 1.3vw 2.6vw;
    font-size: 3vw;
  }
}
/*@media screen and (max-width: 375px){
  .modal .modal_content{
    margin: 35% 10%;
  }
}*/
@media screen and (max-width: 360px){
  .modal .modal_content{
    /*width: 60%;*/
    padding-top: 15%;
  }
}