@charset "UTF-8";

/**********ローディング**********/

.loading{
  width: 100vw;
  height: 100vh;
  background-color:#F2FBFF;
  display: flex;
  justify-content: center;
  align-items: center;
  position: fixed;
  top: 0;
  left: 0;
  z-index:100;
}
.loading img{width: 128px;}

*{
  box-sizing:border-box;
  max-width:100%;
  margin:0;
  padding:0;
}
html {
  font-family: 'Noto Sans JP', "Helvetica Neue", Helvetica, Arial, sans-serif,'游ゴシック体', 'Yu Gothic', YuGothic, 'ヒラギノ角ゴシック Pro', 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', 'メイリオ', Meiryo, Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;
  -webkit-text-size-adjust: 100%;	
  font-display: swap;
  margin:0;
  padding:0;
}
body {
  font-size: 16px;
  line-height: 1.8;
  letter-spacing:.75pt;
  font-weight: 500;
  hanging-punctuation: allow-end;
  margin: 0;
  padding: 0;
  color: #354A53;
  word-break: break-all;
}
body.hidden{
  overflow:hidden;
  height:100%;
}

#wrapper{
  margin:0;
  padding:0;
  overflow:hidden;
}

.fadein {
	opacity: 0;
	transition: 1s;
}
.fadein.is-show {opacity: 1;}
.fadein_up {
  opacity: 0;
  transform: translate(0, 60px);
  transition: 0.5s;
}
.fadein_up.is-show {
  transform: translate(0, 0);
  opacity: 1;
}

/* ボタンアニメ */
a.btn-anime{
  position:relative;
  display:flex;
  justify-content:center;
  align-items:center;
  width:450px;
  height:65px;
  color:#354A53;
  font-size:20px;
  line-height:1.3;
  font-weight:600;
  letter-spacing:0.25pt;
  text-decoration:none;
  transition-duration: 0.4s;
  border:2px solid #354A53;
  margin:40px auto 0;
  overflow:hidden;
  z-index:0;
  box-shadow:0 3px 3px rgba(0,0,0,0.1);
  border-radius:6px;
}
a.btn-anime:hover{color:#fff;}
a.btn-anime::before{
  opacity:0;
  content: '';
  width: 110%;
  height:0;
  padding-top:100%;
  position: absolute;
  left:50%;
  top:50%;
  transform-origin: center top;
  transform: translate(-50%,-50%) scale(0, 1);
  transition: opacity 0.4s, transform 0s;
  transition-delay: 0s, 0.4s;
  border-radius:50%;
  z-index:-1;

}
a.btn-anime:hover::before{
  opacity:1;
  transform-origin: center top;
  transform: translate(-50%,-50%) scale(1, 1);
  transition-delay: 0s;
  transition: opacity 0.8s, transform 0.3s ease-in-out;
}
a.btn-anime::before {background: #354A53;}

/* プラン内のボタン */
a.in-btn{
  height:50px;
  font-size:16px;
  margin-top:30px;
}

/* デフォルトボタン */
a.btn{
  color:#00A5E6;
  background:#fff;
  border-color:#00A5E6;
}
a.btn:hover{color:#fff;}
a.btn::before{background:#00A5E6;}
a.btn::after{
  position:absolute;
  content:"";
  top:50%;
  right:20px;
  transform:translateY(-50%) rotate(45deg);
  display:inline-block;
  width:6px;
  height:6px;
  border-top:2px solid #00A5E6;
  border-right:2px solid #00A5E6;
  transition:0.2s ease;
}
a.btn:hover::after{
  border-top-color:#fff;
  border-right-color:#fff;
}
a.btn span{
  position:relative;
  display:inline-block;
}

/* モノクロ */
a.btn.type02{
  color:#354A53;
  background:#fff;
  border-color:#354A53;
}
a.btn.type02:hover{color:#fff;}
a.btn.type02::before{background:#354A53;}
a.btn.type02::after{
  border-top-color:#354A53;
  border-right-color:#354A53;
  transition:0.2s ease;
}
a.btn.type02:hover::after{
  border-top-color:#fff;
  border-right-color:#fff;
}

/* 色反転 */
a.btn.reverse{
  color:#fff;
  background:#00A5E6;
  border-color:none;
}
a.btn.reverse:hover{color:#00A5E6;}
a.btn.reverse::before{background:#fff;}
a.btn.reverse::after{
  border-top-color:#fff;
  border-right-color:#fff;
}
a.btn.reverse:hover::after{
  border-top-color:#00A5E6;
  border-right-color:#00A5E6;
}

a.btn.reverse02{
  color:#fff;
  background:none;
  border-color:#fff;
}
a.btn.reverse02:hover{color:#354A53;}
a.btn.reverse02::before{background:#fff;}
a.btn.reverse02::after{
  border-top-color:#fff;
  border-right-color:#fff;
}
a.btn.reverse02:hover::after{
  border-top-color:#354A53;
  border-right-color:#354A53;
}

/* lineボタン */
div.line-style{position:relative;}
div.line-style span.label{
  position:absolute;
  top:-30px;
  left:50%;
  transform:translateX(-50%);
  right:0;
  display:flex;
  justify-content:center;
  align-items:center;
  width:clamp(130px,10.714vw,150px);
  height:26px;
  color:#fff;
  font-size:clamp(10px,0.857vw,12px);
  line-height:1;
  letter-spacing:0;
  white-space: nowrap;
  background:#D74141;
  border-radius:13px;
  z-index:1;
}
div.line-style span.label::before{
  position:absolute;
  content:"";
  display:inline-block;
  bottom:-10px;
  left:50%;
  transform:translateX(-50%);
  border:5px solid transparent;
  border-top:5px solid #D74141;
}
a.btn.line{
  color:#fff;
  background:#4CC764;
  border-color:#4CC764;
}
a.btn.line:hover{color:#4CC764;}
a.btn.line::before{background:#fff;}
a.btn.line::after{
  border-top-color:#fff;
  border-right-color:#fff;
}
a.btn.line:hover::after{
  border-top-color:#4CC764;
  border-right-color:#4CC764;
}
a.btn.line span.txt::before{
  position:absolute;
  content:"";
  display:inline-block;
  top:50%;
  left:0;
  transform:translateY(-50%);
  width:25px;
  height:23.13px;
  background:url(../img/icon/line-i-col.svg) center/contain no-repeat,url(../img/icon/line-i.svg) center/contain no-repeat;
  background-size: 0 0,cover;
}
a.btn.line:hover span.txt::before{background-size:cover,0 0;}

div.btn-wrap{
  display:flex;
  justify-content:center;
  margin:40px auto 0;
}
div.btn-wrap a{margin:0;}
div.btn-wrap a + a{margin-left:20px;}

br.br480{display:none;}
br.br768{display:none;}
br.br1024{display:none;}

@media screen and (max-width:1024px){

br.br1024{display:inline;}
br.br1024-non{display:none;}

}
@media screen and (max-width:768px){

a.btn-anime{
  width:clamp(330px,54.6875vw,420px);
  height:50px;
  font-size:clamp(16px,2.604vw,20px);
  margin-top:clamp(20px,5.208vw,40px);
}
a.btn::after{right:15px;}


div.btn-wrap{flex-direction:column;}
div.btn-wrap a{margin:0 auto;}
div.btn-wrap a + a{margin:20px auto 0;}

br.br768{display:inline;}  

}
@media screen and (max-width:480px){
br.br480{display:inline;}
}

/* header */
header{
  position:relative;
  background:#fff; 
  box-shadow:0 0 6px rgba(0,0,0,0.1);
  z-index:20;
}
#header{
  display:flex;
  justify-content:flex-end;
  align-items:center;
  width:1440px;
  height:120px;
  padding:0 20px;
  margin:0 auto;  
}
#logo{margin:0 auto 0 0;}
#logo a img{
  width:clamp(100px,8.571vw,120px);
  height:clamp(100px,8.571vw,120px);
} 
div.btns{margin-left:1.5em;}
div.btns a.btn{
  width:clamp(140px,17.142vw,240px);
  height:50px;
  font-size:clamp(12px,1.142vw,16px);
  margin:0;
}
div.btns a.btn::after{display:none;}
div.btns a.btn span.txt{padding-left:35px;}

@media screen and (min-width:769px){

#mobile-head{display:none;}
#nav{margin:0 0 0 auto;}
#nav ul.menu{display:flex;}
#nav ul.menu li,
#nav ul.menu li a{
  position:relative;
  display:flex;
  align-items:center;
  height:120px;
  color:#354A53;
  font-size:clamp(12px,1.142vw,16px);
  transition:0.2s ease;
}
#nav ul.menu li{cursor:pointer;}
#nav ul.menu li + li{margin-left:1.5em;}

#nav ul.menu li a:hover,
#nav ul.menu li.child:hover{color:#00A5E6;}

#nav ul.menu li.child div.sub{
  visibility:hidden;
  position:absolute;
  top:90%;
  opacity:0;
  width:100%;
  background:#354A53;
  border-radius:4px;
  box-shadow:0 0 10px rgba(0,0,0,0.1);
  transition:0.3s ease;
}
#nav ul.menu li.child div.sub::before{
  position:absolute;
  content:"";
  display:inline-block;
  top:-20px;
  left:50%;
  transform:translateX(-50%);
  border:10px solid transparent;
  border-bottom:10px solid #354A53;
}
#nav ul.menu li.child:hover div.sub{
  visibility:visible;
  opacity:1;
}
#nav ul.menu li.child div.sub a{
  display:block;
  color:#fff;
  font-size:clamp(10px,0.857vw,12px);
  height:auto;
  padding:10px;
  transition:0.2s ease;
}
#nav ul.menu li.child div.sub a:hover{
  padding-left:15px;
  padding-right:5px;
  background:rgba(255,255,255,0.1);
}

}
@media screen and (max-width:768px){

#header{
  height:60px;
  padding:0;
}  
#logo a img{
  width:60px;
  height:60px;
}

div.btns{margin:0 60px 0 0;}
div.btns a.btn{
  width:150px;
  height:40px;
}
/* lineボタン */
div.line-style span.label{display:none;}

/* navigation SP */
#mobile-head{display:inline;}
#wrapper::before{
  visibility: hidden;
  opacity:0;
  position:fixed;
  content:"";
  left:0;
  top:0;
  width:100%;
  height:100%;
  background:rgba(0,0,0,0.75);
  z-index:-1;
  transition:0.2s ease-in-out;
}
#wrapper.add_bk::before{
  visibility:inherit;
  opacity:1;
  z-index:11;
}

#nav-toggle {
  display: none;
  position: relative;
  top:1px;
  width: 60px;
  height: 60px;
  cursor: pointer;
  transition:0.2s ease;
}
#nav-toggle div {
  position: absolute;
  top:17px;
  left:15px;
  width:28px;
  height:28px;
}
#nav-toggle span {
display: block;
position: absolute;
height: 3px;
border-radius: 4px;
width: 100%;
background:#5B6770;
left: 50%;
transform: translateX(-50%);
-webkit-transition: .2s ease-in-out;
-moz-transition: .2s ease-in-out;
transition: .2s ease-in-out;
}
#nav-toggle span:nth-child(1) {top: 0;}
#nav-toggle span:nth-child(2) {top: 11px;}
#nav-toggle span:nth-child(3) {top: 22px;}

#navigation {
display:block;
margin-top: 0;
}
#mobile-head {
width: 60px;
height: 60px;
position: absolute;
right:0;
bottom:0;
transition:0.2s ease;
}
nav#nav {
  visibility:hidden;
  position: fixed;
  left:0;
  top:60px;
  width:100%;
  -webkit-transition: .2s ease-in-out;
  -moz-transition: .2s ease-in-out;
  transition: .2s ease-in-out;
  display: block;
  background:#fff;
  opacity:0;
}
.top nav#nav{
  top:90px;
  max-height:calc(100vh - 90px);
}
.open nav#nav {
  visibility:inherit;
  opacity:1;
}

nav#nav ul.menu {
  position:relative;
  display:none;
  margin:0 auto;
  width:100%;
  max-width:initial;
  height:100%;
  overflow-y: scroll;
  overflow-x:hidden;
  -webkit-overflow-scrolling: touch;
}

.open nav#nav ul.menu{display:block;}

nav#nav ul.menu li{
  display:block;
  position:relative;
  padding:0;
}
nav#nav ul.menu li + li{
  margin-left:0;
  border-top:1px solid #E0E0E0;
}

nav#nav ul.menu > li > a,
nav#nav ul.menu > li > span.a_st{
  position:relative;
  display:flex;
  align-items:center;
  justify-content:flex-start;
  height:50px;
  color:#354A53;
  font-size:14px;
  font-weight:500;
  line-height:1;
  text-align:left;
  text-decoration:none;
  margin:0;
  padding:0;
}
nav#nav ul.menu > li > a span,
nav#nav ul.menu > li > span.a_st{padding-left:30px;}
nav#nav ul.menu > li > a span span.min{
  font-size:10px;
  padding-left:0;
}

nav#nav ul.menu li.sub_st a{
  position:relative;
  display:flex;
  flex-direction: row;
  align-items:center;
  justify-content:flex-start;
  height:40px;
  font-size:12px;
  padding:0 0 0 30px;
  background:#f7f7f7;
}
nav#nav ul.menu li.sub_st a:hover{background:#efefef;}

/* arrow */
nav#nav ul.menu li > a::after {
  position: absolute;
  content: "";
  display:inline-block;
  top: 50%;
  right: 25px;
  width: 6px;
  height: 6px;
  border-top: 1px solid #354A53;
  border-right: 1px solid #354A53;
  transform:translateY(-50%) rotate(45deg);
}
nav#nav ul.menu li.child > a::after{display:none;}

nav#nav ul.menu > li:hover > a,
nav#nav ul.menu > li.current > a,
nav#nav ul.menu > li:hover > span.a_st,
nav#nav ul.menu > li.current > span.a_st{background:#F2FBFC;}
nav#nav ul.menu li.nav_i01.current > a{background:#fff;}

/*サブメニュー*/
nav#nav div.sub{
  display:none;
  background:#F7F7F7;
}
nav#nav div.sub a{
  position:relative;
  display:flex;
  align-items:center;
  justify-content:flex-start;
  height:40px;
  color:#5B6770;
  font-size:12px;
  text-decoration:none;
  padding:0 0 0 40px;
}
nav#nav div.sub a + a{border-top:1px solid #E0E0E0;}
nav#nav div.sub a:hover,
nav#nav div.sub a.current{background:#efefef;}

#nav-toggle {display: block;}	

/* ハンバーガー */
.open #nav-toggle span{border-radius:0;}
.open #nav-toggle span:nth-child(1) {
left: 1px;
top: 11px;
-webkit-transform: rotate(45deg);
-moz-transform: rotate(45deg);
transform: rotate(45deg);
}
.open #nav-toggle span:nth-child(2) {
width: 0;
left: 50%;
}
.open #nav-toggle span:nth-child(3) {
left: 1px;
top: 11px;
-webkit-transform: rotate(-45deg);
-moz-transform: rotate(-45deg);
transform: rotate(-45deg);
}

/* +- */
nav#nav li.child > i{
display: inline-block;
position: absolute;
top: 0;
right: 0;
width: 100%;
height:49px;
line-height: 1;
cursor: pointer;
}
nav#nav li.child > i:before,
nav#nav li.child > i:after{
content: "";
display: inline-block;
position: absolute;
top:24px;
right:22px;
width: 12px;
height: 1px;
background: #354A53;
-webkit-transform-origin: center center;
-moz-transform-origin: center center;
-ms-transform-origin: center center;
-o-transform-origin: center center;
transform-origin: center center;
}
nav#nav li.child > i:after{
-webkit-transform: rotate(90deg);
-ms-transform: rotate(90deg);
-o-transform: rotate(90deg);
transform: rotate(90deg);
}
nav#nav li.child.open > i:after{
-webkit-transform: rotate(0deg);
-ms-transform: rotate(0deg);
-o-transform: rotate(0deg);
transform: rotate(0deg);
}

}


/* footer */
footer div.contents{
  display:flex;
  justify-content:center;
  align-items:center;
  flex-wrap:wrap;
  width:1400px;
  margin:0 auto;
  padding:40px 20px;
}
div.f-logo a.f-logo-link{
  display:block;
  width:clamp(200px,21.428vw,300px);
  margin:0 auto;
}
div.f-logo img{
  width:clamp(200px,21.428vw,300px);
  height:clamp(200px,21.428vw,300px);
}
#f-nav{margin-left:clamp(1em,2.857vw,40px);}
#f-nav ul{display:flex;}
#f-nav ul li + li{margin-left:1.5em;}
#f-nav ul li a{
  color:#354A53;
  font-size:clamp(14px,1.142vw,16px);
  transition:0.2s ease;
}
#f-nav ul li a:hover{color:#00A5E6;}

#f-nav ul div.sub{
  display:flex;
  flex-direction:column;
  padding:10px 0 0 5px;
}
#f-nav ul div.sub a{
  position:relative;
  font-size:clamp(12px,1vw,14px);
  font-weight:400;
  padding-left:20px;
}
#f-nav ul div.sub a + a{margin-top:5px;}
#f-nav ul div.sub a::before{
  position:absolute;
  content:"";
  top:50%;
  left:0;
  transform:translateY(-50%);
  width:10px;
  height:1px;
  background:#354A53;
}

/* line btn footerに設置 */
footer a.btn.line{
  width:300px;
  margin-top:0;
}
a.btn.line span.txt{padding-left:35px;}


#copyright{
  font-family:"Oswald";
  color:#354A53;
  font-size:14px;
  line-height:1;
  text-align:right;
  width:1400px;
  padding:20px 10px;
  margin:0 auto;
  border-top:1px solid #e0e0e0;
}

@media screen and (max-width:1024px){

#f-nav ul{flex-direction:column;}  
#f-nav ul li + li{margin:10px 0 0;}

}
@media screen and (max-width:768px){

footer div.contents{flex-direction:column;}  
#f-nav{margin:40px 0 0;}



}
@media screen and (max-width:480px){

#f-nav{width:100%;}  

}


/* 共通 */
div.area{padding:80px 0;}
div.area div.contents{
  width:1440px;
  padding:0 20px;
  margin:0 auto;
}
div.area div.contents + div.contents{margin-top:40px;}

div.area.sec02{
  position:relative;
  padding-top:80px;
}
div.area.sec02::before{
  position:absolute;
  content:"";
  display:inline-block;
  top:0;
  left:-13.54%;
  width:100%;
  height:360px;
  background:#354A53;
  z-index:-1;
}
div.area.bk-col{background:#354A53;}


.wht{color:#fff;}
.red{color:#D74141;}
.blue{color:#00A5E6;}

div.area div.contents span.jp{
  display:block;
  color:#00A5E6;
  font-size:16px;
  font-weight:600;
}
div.area div.contents h2{
  font-family:"Oswald";
  font-size:48px;
  line-height:1.2;
  font-weight:600;
  padding-top:0.1em;
}
div.area div.contents h2 + p{margin-top:1em;}
div.area div.contents p + p{padding-top:1em;}

div.area div.contents span.en{font-family:"Oswald";}
div.area div.contents h2.jp{font-family: 'Noto Sans JP', "Helvetica Neue", Helvetica, Arial, sans-serif,'游ゴシック体', 'Yu Gothic', YuGothic, 'ヒラギノ角ゴシック Pro', 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', 'メイリオ', Meiryo, Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;}

div.area div.contents ul.attention{padding-top:1em;}
div.area div.contents ul.attention li{font-size:12px;}

@media screen and (max-width:768px){

div.area{padding:60px 0;}  
div.area.sec01{padding-bottom:0;}
div.area.sec02{padding-top:60px;}
div.area.sec02::before{display:none;}

.sp-blk{color:#354A53;}

div.area div.contents span.jp{
  font-size:clamp(14px,2.083vw,16px);
  text-align:center;
}
div.area div.contents h2{
  font-size:clamp(32px,6.25vw,48px);
  text-align:center;
}
div.area p{font-size:14px;}
div.area p.sp-center{text-align:center;}

}


/* slide */
div.default,
div.sp-default,
div.tab-default{position:relative;}

div.slide-wrap{
  position:relative;
  margin:40px auto 0;
}
div.slide-wrap div.swiper-wrapper{display:flex;}
.swiper-android .swiper-slide, .swiper-wrapper {transform: translate3d(0px, 0, 0)}
.swiper-pointer-events {touch-action: pan-y;}
.swiper-pointer-events.swiper-vertical {touch-action: pan-x;}
.swiper-slide {
  flex-shrink: 0;
  position: relative;
  transition-property: transform;
}
.swiper-button-lock {display: none}
.swiper-container-fade.swiper-container-free-mode .swiper-slide {transition-timing-function: ease-out;}
.swiper-container-fade .swiper-slide {transition-property: opacity;}
.swiper-pagination {
  position: relative;
  bottom:0;
  text-align: center;
  transition: .3s opacity;
  transform: translate3d(0, 0, 0);
  margin-top:clamp(20px,5.208vw,40px);
}
.swiper-pagination-bullet {
  width: 10px;
  height: 10px;
  display: inline-block;
  border-radius: 50%;
  background: #efefef;
}
.swiper-pagination-bullet + .swiper-pagination-bullet{margin-left:15px;}
button.swiper-pagination-bullet {
  border: none;
  margin: 0;
  padding: 0;
  box-shadow: none;
  -webkit-appearance: none;
  appearance: none
}
.swiper-pagination-clickable .swiper-pagination-bullet {cursor: pointer}
.swiper-pagination-bullet:only-child {display: none !important}
.swiper-pagination-bullet-active {
  opacity: 1;
  transform:scale(1.3);
  background:#354A53;
}
.swiper-button-next.swiper-button-disabled,
.swiper-button-prev.swiper-button-disabled {
    opacity:0;
    cursor: auto;
    pointer-events: none
}
.swiper-button-next,
.swiper-button-prev {
  position:absolute;
  bottom:0;
  width:30px;
  height:30px;
  cursor:pointer;
}
.swiper-button-prev {
  left:0;
  background:url(../img/icon/slide-l.svg) center/contain no-repeat;
}
.swiper-button-next {
  right:0;
  background:url(../img/icon/slide-r.svg) center/contain no-repeat;
}

div.bk-col .swiper-pagination-bullet-active {background:#00A5E6;}
div.bk-col .swiper-button-prev {background:url(../img/icon/slide-l-wht.svg) center/contain no-repeat;}
div.bk-col .swiper-button-next {background:url(../img/icon/slide-r-wht.svg) center/contain no-repeat;}

div.tab-default div.swiper-pagination,
div.tab-default div.swiper-button-prev,
div.tab-default div.swiper-button-next{display:none;}

div.sp-default div.swiper-pagination,
div.sp-default div.swiper-button-prev,
div.sp-default div.swiper-button-next{display:none;}

@media screen and (max-width:1024px){

div.tab-default div.swiper-pagination,
div.tab-default div.swiper-button-prev,
div.tab-default div.swiper-button-next{display:block;}

}

@media screen and (max-width:768px){

div.default,
div.sp-default,
div.tab-default{
  width:330px;
  margin:0 auto;
}  

div.sp-default div.swiper-pagination,
div.sp-default div.swiper-button-prev,
div.sp-default div.swiper-button-next{display:block;}

}


/* よくある質問 */
div.qa-wrap{margin-top:40px;}
div.qa-wrap.mt-0{margin-top:0;}
div.qa-wrap div.box{border-top:1px solid #e0e0e0;}
div.qa-wrap div.box:last-child{border-bottom:1px solid #e0e0e0;}

div.qa-wrap div.question{
  position:relative;
  padding:30px 50px;
  cursor:pointer;
  transition:0.2s ease;
}
div.qa-wrap div.question:hover{background:#F2FBFC;}

div.qa-wrap div.question::before{
  position:absolute;
  content:"";
  top:50%;
  transform:translateY(-50%);
  left:20px;
  display:inline-block;
  width:15px;
  height:21px;
  background:url(../img/icon/q-i.svg) center/contain no-repeat;
}
div.qa-wrap h3{
  font-size:clamp(14px,2.083vw,16px);
  line-height:1.6;
  font-weight:600;
  text-align:left;
}
div.qa-wrap div.question div.accordion_icon,
div.qa-wrap div.question div.accordion_icon span {
  display: inline-block;
  transition: .3s ease;
  box-sizing: border-box;
}
div.qa-wrap div.question div.accordion_icon {
  position: absolute;
  right:15px;
  top: 50%;
  transform:translateY(-50%);
  width: 30px;
  height: 30px;
}
div.qa-wrap div.question div.accordion_icon span {
  position: absolute;
  left: 25%;
  width: 50%;
  height: 3px;
  background: #354A53;
  border-radius: 4px;
  -webkit-border-radius: 4px;
  -ms-border-radius: 4px;
  -moz-border-radius: 4px;
  -o-border-radius: 4px;
}
div.qa-wrap div.question div.accordion_icon span:nth-of-type(1) {
  top: 12.5px;
  transform: rotate(0);
  -webkit-transform: rotate(0);
  -moz-transform: rotate(0);
  -ms-transform: rotate(0);
  -o-transform: rotate(0)
}
div.qa-wrap div.question div.accordion_icon span:nth-of-type(2) {
  top: 12.5px;
  transform: rotate(90deg);
  -webkit-transform: rotate(90deg);
  -moz-transform: rotate(90deg);
  -ms-transform: rotate(90deg);
  -o-transform: rotate(90deg)
}
div.qa-wrap div.question.active div.accordion_icon span:nth-of-type(1) {display: none;}
div.qa-wrap div.question.active div.accordion_icon span:nth-of-type(2) {
  top: 12.5px;
  transform: rotate(180deg);
  -webkit-transform: rotate(180deg);
  -moz-transform: rotate(180deg);
  -ms-transform: rotate(180deg);
  -o-transform: rotate(180deg)
}

div.qa-wrap div.answer{
  display:none;
  position:relative;
  padding:30px 0 30px 50px;
}
div.qa-wrap div.answer::before{
  position:absolute;
  content:"";
  top:38px;
  left:20px;
  display:inline-block;
  width:15px;
  height:16px;
  background:url(../img/icon/a-i.svg) center/contain no-repeat;
}
div.qa-wrap div.answer p{
  font-size:clamp(14px,2.083vw,16px);
  font-weight:500;
  line-height:2;
}
div.qa-wrap div.answer p + ul.dot{margin-top:0.5em;}
div.qa-wrap div.answer ul.dot li{
  position:relative;
  font-size:clamp(14px,2.083vw,16px);
  font-weight:500;
  line-height:2;
  padding-left:1em;
}
div.qa-wrap div.answer ul.dot li + li{margin-top:0.25em;}

div.qa-wrap div.answer ul.dot li::before{
  position:absolute;
  content:"・";
  left:0;
}


@media screen and (max-width:768px){

div.qa-wrap div.question{padding:20px 40px;}  
div.qa-wrap div.question::before{left:10px;}

div.qa-wrap div.answer{padding:20px 20px 20px 40px;}
div.qa-wrap div.answer::before{
  top:28px;
  left:10px;
}
div.qa-wrap div.question div.accordion_icon {right:10px;}

}

/* アーティスト検索 */
div.area.artist{
  position:relative;
  display:flex;
  justify-content:center;
  align-items:center;
  height:max(26.04vw,500px);
  background:url(../img/artist-bk.png) center/cover no-repeat;
}
@supports (background: url(../img/webp/artist-bk.webp)) {
  div.area.artist {
    background: url(../img/webp/artist-bk.webp) center/cover no-repeat;
  }
}

div.separately-btn p.heading{
  color:#fff;
  text-align:center;
}
div.separately-btn p.heading + a.btn{margin-top:10px;}

div.area.artist div.top-txt p,
div.area.artist div.bottom-txt p{
  color:#fff;
  font-size:clamp(18px,3.125vw,24px);
  line-height:1.8;
  text-align:center;
  font-weight:500;
  text-shadow:0 0 6px rgba(0,0,0,0.2);
}
div.area.artist div.top-txt{padding-bottom:1em;}
div.area.artist div.bottom-txt{padding-top:1.25em;}


@media screen and (max-width:768px){

div.area.artist{
  height:max(104vw,480px);
  background:url(../img/artist-bk-sp.png) center/cover no-repeat; 
}
@supports (background: url(../img/webp/artist-bk-sp.webp)) {
  div.area.artist {
    background: url(../img/webp/artist-bk-sp.webp) center/cover no-repeat;
  }
}

}


/* モーダル */
.modal_box {
  position: fixed;
  z-index:40;
  display: none;
  width:728px;
  max-width:calc(100% - 30px);
  height:auto;
  max-height:82vh;
  top:0;
  left:0;
  bottom:0;
  right: 0;
  margin: 0;
  padding: 0;
  text-align: center;
  overflow-y:scroll;
}
.modal_box img{
  display:block;
  width:100%;
  border-radius:20px;
  box-shadow:0 0 10px rgba(0,0,0,0.2);
  overflow:hidden;
}
.modal_box p{
  font-weight:600;
  padding-top:10px;
}
.modal_bg {
  position: fixed;
  top: 0;
  left: 0;
  z-index:30;
  display: none;
  width: 100%;
  height: 100%;
  background-color: rgba(255,255,255,0.8)
}
.modal_box span.b-btn{
  position:absolute;
  top:20px;
  right:20px;
  display:flex;
  justify-content:center;
  align-items:center;
  width:80px;
  height:30px;
  color:#fff;
  font-size:12px;
  font-weight:500;
  line-height:1;
  letter-spacing:0;
  background:#354A53;
  border-radius:15px;
  cursor:pointer;
}

@media screen and (max-width:480px) {
  .modal_box {
    top: 70px;
    width: 90%;
    height: 82vh;
  }
}