@charset "UTF-8";


@font-face {
  src: url("./NotoSansJP-Medium.ttf") format("ttf");
  font-family: 'Noto Serif JP', serif;
  font-weight: 500;
  font-display: swap;
}
@font-face {
  src: url("./NotoSansJP-SemiBold.ttf") format("ttf");
  font-family: 'Noto Serif JP', serif;
  font-weight: 600;
  font-display: swap;
}







 
*,*::before,*::after{box-sizing:border-box}body,h1,h2,h3,h4,p,figure,blockquote,dl,dd{margin:0}ul[role="list"],ol[role="list"]{list-style:none}html:focus-within{scroll-behavior:smooth}body{min-height:100vh;text-rendering:optimizeSpeed;line-height:1.5}a:not([class]){text-decoration-skip-ink:auto}img,picture{max-width:100%;display:block}input,button,textarea,select{font:inherit}@media(prefers-reduced-motion:reduce){html:focus-within{scroll-behavior:auto}*,*::before,*::after{animation-duration:.01ms !important;animation-iteration-count:1 !important;transition-duration:.01ms !important;scroll-behavior:auto !important}}


html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {
    font-family: "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro", "Yu Gothic Medium", "游ゴシック Medium", YuGothic, "游ゴシック体", "メイリオ", sans-serif;
}
li {
  list-style-type: none;
}




/* =======================================
	下margin調整
======================================= */
.marginB5{ margin-bottom: 5px;}
.marginB10{ margin-bottom: 10px;}
.marginB15{ margin-bottom: 15px;}
.marginB20{ margin-bottom: 20px;}
.marginB30{ margin-bottom: 30px;}
.marginB40{ margin-bottom: 40px;}
.marginB50{ margin-bottom: 50px;}
.marginB60{ margin-bottom: 60px;}
.marginB70{ margin-bottom: 70px;}



.box_center_frame{
	display: -webkit-flex;
  display: flex;
  -webkit-justify-content: center;
  justify-content: center;
  -webkit-align-items: stretch;
  align-items: stretch;
}



/* 画像を画面幅に合わせる */
.frame_fit_img {
	max-width: 100%;
	height: auto;
}



.wrapper{
	margin-top: 80px;
  background: #fff;
  color: #333;
  font-size: 14px;
}



@media only screen and (min-width: 768px){
.sp_only{
	display: none;
}
}

@media only screen and (max-width: 768px){
.pc_only{
	display: none;
}
}





h3, .h3 {
  font-size: 24px;
}

h5{
  margin-top: 10px;
  margin-bottom: 10px;
}


ul{
  padding: 0;
}

.normal_link{
  color: #2ec28b;
}
.normal_link_window{
  color: #2ec28b;
  padding: 3px 30px 3px 0px;
  background: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0 0 24 24"><path fill="%232ec28b" d="M18 18V20H4A2 2 0 0 1 2 18V8H4V18M22 6V14A2 2 0 0 1 20 16H8A2 2 0 0 1 6 14V6A2 2 0 0 1 8 4H20A2 2 0 0 1 22 6M20 6H8V14H20Z" /></svg>') no-repeat right center;
	background-size: 25px;
}



.normal_text{
  text-align: left;
}

.small_text{
  font-size: 85%;
}



h1, h2, h3 {
  margin-top: 0px;
  margin-bottom: 0px;
}



.block__blue{
  background: #eff3f5;
  padding: 15% 10%;
  text-align: center;
}
.main__title{
  color: #18acd6;
  line-height: 1.4;
  font-size: 150%;
  font-family: 'Noto Sans JP', sans-serif;
  font-weight: 600;
  margin-bottom: 40px;
}



.basic_text{
  font-size: 105%;
}






/* header
--------------------------------------- */

.intro_faq{
  padding: 5%;
}
.intro_faq .basic_text{
  background: #e7f3fc;
  padding: 7% 6%;
}








/* faq＜よくある質問＞
--------------------------------------- */
.accordion-container{
  text-align: left;
  color: #333;
}
.accordion-container .accordion-title {
  color: #18acd6;
  position: relative;
  padding: 15px 50px;
  margin-bottom: 0;
  font-size: 120%;
  font-family: 'Noto Sans JP', sans-serif;
  font-weight: 600;
  cursor: pointer;
	line-height: 1.5;
	background: #fff url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 80 80"><path fill="%2318acd6" d="M12,2A10,10 0 0,1 22,12A10,10 0 0,1 12,22A10,10 0 0,1 2,12A10,10 0 0,1 12,2M11,7A2,2 0 0,0 9,9V15A2,2 0 0,0 11,17V19H13V17A2,2 0 0,0 15,15V9A2,2 0 0,0 13,7H11M11,9H13V15H11V9Z" /></svg>') top 15px left 10px no-repeat;
	background-size: 80px;
}
.accordion-container .accordion-title:hover,
.accordion-container .accordion-title:active,
.accordion-title.open { 
  
}
.accordion-container .accordion-title::after {
  content: "";
  position: absolute;
  top: 50%;
  right: 25px;
  width: 0;
  height: 0;
  border: 8px solid transparent;
  border-top-color: #18acd6;
}
.accordion-container .accordion-title.open::after {
  content: "";
  position: absolute;
  top: 15px;
  border: 8px solid transparent;
  border-bottom-color: #18acd6;
}


.accordion-container .accordion-content {
	background: #fff url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 80 80"><path fill="%2318acd6" d="M11,7H13A2,2 0 0,1 15,9V17H13V13H11V17H9V9A2,2 0 0,1 11,7M11,9V11H13V9H11M12,20A8,8 0 0,0 20,12A8,8 0 0,0 12,4A8,8 0 0,0 4,12A8,8 0 0,0 12,20M12,2A10,10 0 0,1 22,12A10,10 0 0,1 12,22A10,10 0 0,1 2,12A10,10 0 0,1 12,2Z" /></svg>') top 15px left 10px no-repeat;
	background-size: 80px;
  padding: 15px 15px 15px 50px;
  font-size: 110%;
}



/*CSS for CodePen

.accordion-content {
  padding-left: 2.3125em;
  border: 1px solid #0079c1;
}
.accordion-container {
  width: 300px;
  margin: 0 auto;
}


*/







/* basic_info＜基本情報＞
--------------------------------------- */
.basic_info{
  padding: 15% 5%;
  text-align: center;
}

.basic_info table{
  border-collapse: collapse;
  width: 100%;
}
.basic_info th,
.basic_info td{
  border: 1px solid #ccc;
  padding: 5% 3%;
}
.basic_info th{
  background: #eee;
  width: 40%;
}
.basic_info td{
  width: 60%;
  text-align: left;
}














/* PC表示用＜ざっくり＞
--------------------------------------- */


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

  .block__blue{
    padding: 80px 40px;
  }
  
  .head_faq,
  .intro_faq,
  .accordion-container{
    width: 750px;
    margin-left: auto;
    margin-right: auto;
  }








/* PC基本情報
--------------------------------------- */
  .basic_info{
    padding: 80px 0px;
    width: 750px;
    margin-left: auto;
    margin-right: auto;
  }
  .basic_info th{
    width: 30%;
  }
  .basic_info td{
    width: 70%;
  }

  




}




















