@charset "utf-8";
/* CSS Document */

/*****************************************************

	リンク設定：全体

*****************************************************/
a:hover {
	transition: all .3s;
	opacity: .8;
}
/*****************************************************

	全体

*****************************************************/
body {
	width: 100%;
	margin: 0 auto;
	line-height: 2;
	word-wrap: break-word;
	font-family: "Yu Gothic Medium", "游ゴシック Medium", YuGothic, "游ゴシック体", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", "sans-serif";
}
/*****************************************************

	margin

*****************************************************/
.mb0 {
	margin-bottom: 0!important;
}
.mb10 {
	margin-bottom: 10px!important;
}
.mb20 {
	margin-bottom: 20px!important;
}
.mb30 {
	margin-bottom: 30px!important;
}
.mb40 {
	margin-bottom: 40px!important;
}
.mb50 {
	margin-bottom: 50px!important;
}
.mt50 {
	margin-bottom: 50px!important;
}
.mt10 {
	margin-top: 10px!important;
}
.mt20 {
	margin-top: 20px!important;
}
.mt30 {
	margin-top: 30px!important;
}
.mt40 {
	margin-top: 40px!important;
}
.mt50 {
	margin-top: 50px!important;
}
/*****************************************************

	clearfix

*****************************************************/
.clearfix {
	zoom: 1;
}
.clearfix:after {
	content: "";
	display: block;
	clear: both;
}
.red {
	color: #900;
}



.pc {
	display: block;
}
.sp {
	display: none;
}

/*****************************************************

  全ページ　共通

*****************************************************/

.c-marker {
    background: -webkit-linear-gradient(left, rgb(255,250,50) 50%, transparent 50%);
    background: -moz-linear-gradient(left, rgb(255,250,50) 50%, transparent 50%);
    background: linear-gradient(left, rgb(255,250,50) 50%, transparent 50%);
  	background-repeat: no-repeat;
  	background-size: 200% .3em; 
    background-position: 100% 100%;
    transition: 3s;
}
.c-marker.is-active{
    background-position: 5px 100%;
}


.inbox{
  transform:translateX(-50px);
  opacity:0;
  transition:opacity 2s,transform 2s;
}


.inbox:first-of-type{
  margin:80% 5% 5% 5%;
}

.fadein{
  opacity:1;
  transform:translateX(0);
}


.red{
	color: #C30D23;
	
}

.blue{
	color: #036EB8;
}


/*****************************************************

	header

*****************************************************/



header {
	width: 100%;
	
	color: #235ba8;
	background-color: #fff;
	
	z-index: 20;
	padding-top: 10px;
}
header h1 {
	width: 417px;
	margin: 10px auto 20px;
}
header .inner {
	width: 100%;
	margin: 0 auto;
	padding: 0 0;
	position: relative;
	z-index: 20;
	border-bottom: 1px solid #333;
	border-top: 1px solid #333;
}
header .inner ul {
	width: 1000px;
	margin: 0 auto;
	padding: 0 0;
	display: flex;
	
	
}
header .inner ul li {
	color: #000;
	font-size: 18px;
	width: 250px;
	text-align: center;
	padding: 7px 0;
	
}




/*****************************************************

  footer

*****************************************************/

footer {
	
	padding: 40px 0 20px;
	color: #999;
	border-top: 10px solid #036E9E;
	
}
footer .inner {
	width: 1000px;
	margin: 0 auto;
	
}

footer .inner .logo{
	width: 400px;
	margin: 0 auto 40px;
}

footer .inner .cont{
	display: flex;
    justify-content: space-between;
	margin-bottom: 60px;
}

footer .inner .cont .l-box{
	width:470px;
	font-size: 18px;
	color: #111;
}

footer .inner .cont .l-box h2{
	
	font-size: 20px;
	margin-bottom: 20px;
	
}

footer .inner .cont .l-box p{
	
	font-size: 20px;
	line-height: 33px;
	
	
}


footer .inner .cont .r-box{
	width:470px;
	color: #111;
}

footer .inner .cont .r-box p{
	font-size: 20px;
	line-height: 33px;
	margin-bottom: 20px;
}

footer .inner .cont .r-box .btn{
	width: 380px;
}


footer .inner .nav{
	width: 600px;
	margin: 0 auto;
	display: flex;
    justify-content: space-between;
	color: #111;
	font-size: 18px;
	margin-bottom: 30px;
}


footer .copy {
	width: 100%;
	text-align: center;
	background-color: #036E9E;
	color: #fff;
	padding: 15px 0;
	font-size: 18px;
}

footer .inner .footBox{
	display: flex;
    justify-content: space-between;
	width: 940px;
	margin:  0 auto 50px;
	
}







/*****************************************************

  トップページ	

*****************************************************/


.top-img{
	width: 100%;
	background-image: url(../../img/bg_1.jpg);
	padding: 20px 0;
	margin-bottom: 90px;
	margin-top: -10px;
	position: relative;
}

.top-img .inner{
	width: 1200px;
	margin: 0 auto;
	background-image: url(../img/top_bg.png);
	background-repeat: no-repeat;
	background-position: left;
	background-size: 120%;
	height: 550px;
	padding-top: 60px;
	
}

.top-img .inner .btn{
	
	position: absolute;
	top: 400px;
	left: 72%;
	width: 250px;
}

.top-img .inner .img{
	
}



.titol {
	text-align: center;
	margin: 30px;
}


.titol h3{
	font-size: 35px;
	font-weight:100;
}



.top-titol{
	width: 850px;
	margin: 0 auto;
	background-image: url(../img/sect_titol_mark.png);
	background-repeat: no-repeat;
	color: #036EA4;
	background-size: 6.5%;
	padding-left: 60px;
	padding-bottom: 10px;
}




.sect-top{
	width: 100%;
}

.sect-top .inner{
	width: 1000px;
	display: flex;
	margin: 70px auto 70px;
}

.sect-top .inner .txt{
	width: 600px;
}

.sect-top .inner .txt h3{
	font-size: 25px;
	color: #036EA4;
	text-align: center;
	margin-bottom: 15px;
	line-height: 170%;
}

.sect-top .inner .txt p{
	font-size: 19px;
	color: #111;
	line-height: 170%;
}


.sect-top .inner .img{
	width: 400px;
}


.sect-line{
	width: 100%;
	background-image: url(../img/btn_bg.png);
	padding: 50px 0;
	margin-bottom: 70px;
}

.sect-line .inner{
	width: 650px;
	margin: 0 auto;
	text-align: center;

}

.sect-line .inner .btn{
	width: 550px;
	margin: 0 auto;
	

}

.sect-line .inner h3{
	font-size: 25px;
	margin-bottom: 20px;
	

}



.sect-1{
	width: 100%;
	margin-bottom: 70px;

}

.sect-1 .inner{
	width: 750px;
	margin: 0 auto;
	text-align: center;
	border: 3px solid #036EA4;
	padding: 30px 70px;
	border-radius: 15px;
}

.sect-1 .inner ul{
	
}


.sect-1 .inner ul li{
	background-image: url(../img/sect1_mark.png);
	background-repeat: no-repeat;
	text-align: left;
	background-size: 5%;
	padding-left: 50px;
	font-size: 20px;
	margin-bottom: 15px;
}



.sect-counse{
	width: 100%;
	background-image: url(../img/btn_bg.png);
	padding: 50px 0;
	margin-bottom: 100px;
}

.sect-counse .inner{
	width: 650px;
	margin: 0 auto;
	text-align: center;

}

.sect-counse .inner .btn{
	width: 300px;
	margin: 0 auto;
	

}

.sect-counse .inner h3{
	font-size: 25px;
	margin-bottom: 20px;
	color: #060;
	

}

/**/


.sect-point{
	width: 100%;
	margin-bottom: 70px;

}

.sect-point .inner{
	width: 1000px;
	margin: 0 auto;
	
}

.sect-point .inner ul{
	display : flex;
	-webkit-flex-wrap: wrap;          /* Safari etc. */
  	-ms-flex-wrap    : wrap;          /* IE10        */
  	flex-wrap        : wrap;
    
    justify-content: space-between;
}


.sect-point .inner ul li{
	border: 3px solid #036EA4;
	padding: 15px ;
	width: 487px;
	margin-bottom: 15px;
	
}

.sect-point .inner ul li dt{
  float: left;
    
    width: 90px;
	padding:0px 10px 0 0;
}

.sect-point .inner ul li dl{
  height: 110px;
}

.sect-point .inner ul li dd{
	
	
}

.sect-point .inner ul li dd h3{
	font-size: 24px;
	padding: 20px 0 0 0px;
	line-height: 150%;
}

.sect-point .inner ul li p{
	font-size: 17px;
	
}


.sect-point .inner ul li  h4{
	font-size: 22px;
	color: #036EA4;
	margin: 15px 0 10px;
}


.sect-point .inner ul li dd .point{
	font-size: 24px;
	padding: 10px 0 0 0px;
	line-height: 150%;
}


.sect-point .inner ul li .btn a{
	border: 3px solid #036EA4;
	background-color: #036EA4;
	border-radius: 15px;
	color: #fff;
	width: 350px;
	font-size: 20px;
	padding: 5px 15px;
	
}

.sect-point .inner ul li .btn a:hover{
	border: 3px solid #036EA4;
	background-color: #FFF;
	border-radius: 15px;
	color: #036EA4;
	width: 350px;
	font-size: 20px;
	padding: 5px 15px;
	
}

.point1_txt{
	margin-bottom: 15px;
}

/**/




.sect-Instruct{
	width: 100%;
	margin-bottom: 100px;
}


.sect-Instruct .inner ul li{
	width: 100%;
	background-image: url(../img/Instruct_bg_l.png);
	background-position: ;
	background-repeat: repeat;
	padding: 15px 0 30px;
	z-index: 10;
	margin-bottom: 30px;
}

.sect-Instruct .inner ul li dl{
	width: 1000px;
	margin: 0 auto;
  
}

.sect-Instruct .inner ul li dt{
    float: left;
	width: 350px;
	padding: 0px 30px 0 0;
	color: #fff;
	padding-bottom: 30px;
	margin-top: 20px;
}


.sect-Instruct .inner ul li dd{
	
	color: #fff;
	padding: 0px 0px 20px;
}

.sect-Instruct .inner ul li dd h3{
	font-size: 20px;
	padding: 20px 0 0 0px;
	line-height: 150%;
	color: #fff;
	font-weight: 100;
}

.sect-Instruct .inner ul li dd p{
	font-size: 20px;
	padding: 20px 0 0 0px;
	line-height: 150%;
	color: #fff;
}

.sect-Instruct .inner ul li dd p a{
	font-size: 20px;
	line-height: 150%;
	color: #333;
	background-color: #fff;
	padding: 3px 10px;
	border-radius: 10px; 
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
}



.bg_y{
	width: 20%;
	background-image: url(../img/Instruct_bg_r.png);
	background-repeat: repeat;
	padding-top: 100px;
	margin-top: -30px;
	float: right;
	z-index: 5;
}


/*=================================

　　講師メッセージ

=================================*/


.sect-Message .inner{
	width: 1000px;
	margin: 0 auto;
	background-image: url(../img/message_bg.png);
	background-position: center;
	background-repeat: repeat-y;
	height: auto;
	padding: 50px 0;
	margin-bottom: 70px;
}

.sect-Message .inner .video{
	width: 800px;
	margin: 0 auto;
	
}

.sect-Message .inner{
	width: 1000px;
	margin: 0 auto;
	background-image: url(../img/message_bg.png);
	background-position: center;
	background-repeat: repeat-y;
	height: auto;
	padding: 50px 0;
	margin-bottom: 70px;
}

.sect-Message .inner .video{
	width: 800px;
	margin: 0 auto;
	
}



.sect-student_in .inner{
	width: 1000px;
	margin: 0 auto;
	margin-bottom: 70px;
}


.sect-student_in .inner ul{
	display: flex;
    justify-content: space-between;
}

.sect-student_in .inner ul li{
	width: 470px;
}

/*.sect-student_in .inner ul li .video{
	width: 440px;
}
*/
.sect-student_in .inner ul li h3{
	font-size: 20px;
}





.sect-student_in .inner{
	width: 1000px;
	margin: 0 auto;
	margin-bottom: 70px;
}


.sect-student_in .inner ul{
	display: flex;
    justify-content: space-between;
	margin-bottom: 30px;
}

.sect-student_in .inner ul li{
	width: 470px;
}

/*.sect-student_in .inner ul li .video{
	width: 440px;
}
*/
.sect-student_in .inner ul li h3{
	font-size: 20px;
}


/*=================================

　　おすすめ

=================================*/

.sect-osusume{
	margin-bottom: 100px;
}

.sect-osusume .inner{
	width: 950px;
	margin: 0 auto;
}

.sect-osusume .inner p{
	width: 800px;
	margin: 40px auto;
	font-size: 19px;
	line-height: 170%;
	
}



.sect-osusume table {
    border-collapse: collapse;  /* セルの線を重ねる */
}
 
.sect-osusume th,td {
    padding: 5px 10px;          /* 余白指定 */
}
 
.sect-osusume th {
    background-color: #2196F3;  /* 背景色指定 */
    color:  #fff;               /* 文字色指定 */
    font-weight:  normal;       /* 文字の太さ指定 */
    position:  relative;        /* 位置指定 */
    z-index: 10;  
	width: 350px; 
	padding: 20px;  
	font-size: 20px;           /* 重なり調整 */
}
 
.sect-osusume td {
    background-color: #FFFFEA; /* 背景色指定 */
    padding-left: 25px;  
	     /* 余白指定 */
	width: 650px;
	padding: 20px 10px 20px 40px;  
	font-size: 20px; 
	border: none;
}
 
.sect-osusume th::after {
    content:'';                 /* 空の要素を作る */
    position:  absolute;        /* 位置指定 */
    height: 24px;               /* 高さ指定 */
    width: 24px;                /* 幅指定 */
    background-color: #2196F3;  /* 背景色指定 */
    transform:  rotate(45deg);  /* 要素を回転 */
    top: 35%;                   /* 位置指定 */
    right: -12px;               /* 位置指定 */
    z-index:  -1;               /* 重なり調整 */
}
 
.sect-osusume tr {
    border-bottom:  solid #fff; /* 線指定 */
}


/*=================================

　　カリキュラム

=================================*/


.sect-curriculum{
	width: 100%;
	margin-bottom: 70px;

}

.sect-curriculum .inner{
	width: 1000px;
	margin: 0 auto;
	
}

.sect-curriculum .inner .course{
	width: 300px;
	margin: 0 auto;
	background-color: #09C;
	color: #fff;
	text-align: center;
	font-size: 24px;
	margin-bottom: 50px;
	padding: 10px;
	
}


.sect-curriculum .inner ul{
	font-size: 18px;
	line-height: 170%;
}


.sect-curriculum .inner ul li{
	font-size: 18px;
	line-height: 180%;
}

.sect-curriculum .inner ul li h4{
	font-size: 20px;
	
}

.sect-curriculum .inner ul li p{
	font-size: 18px;
	line-height: 190%;
	margin-bottom: 10px;
	
}

.sect-curriculum .inner ul li h3{
	font-size: 26px;
	padding: 0px 0 0 50px;
	margin-bottom: 15px;
	background-image: url(../img/cl_mrak.png);
	background-repeat: no-repeat;
	background-size: 4%;
	
}

.sect-curriculum .inner ul li dt{
  float: left;
    
    width: 380px;
	padding:0px 10px 0 0;
}

.sect-curriculum .inner ul li dl{
  margin-bottom: 60px;
}

.sect-curriculum .inner ul li dd{
	
	
}



.sect-curriculum .inner ul li p{
	font-size: 17px;
	
}




.sect-curriculum .inner ul li .btn{
	width: 350px;
	padding-top: 20px;
	margin: 30px auto 80px;
}






/*=================================

　　ポップアップ内　PC&SP

=================================*/


.curriculum .top{
	background-color: #09C;
}

.curriculum p {
  font-size: 16px;
  font-weight: bold;
  text-align: center;
  margin: 60px auto 40px;
}
.curriculum table {
  margin: 20px auto;
}
.curriculum .tbl-r02 th {
  background: #e9727e;
  border: solid 1px #222;
  color: #fff;
  padding: 10px;
  width: 200px;
  font-size: 18px;
}
.curriculum .tbl-r02 td {
　border: solid 1px #666;
	border-bottom: solid 1px #666;
  padding: 10px;
  width: 300px;
  font-size: 18px;
  text-align: left;
}
 
@media screen and (max-width: 640px) {
.curriculum .last td:last-child {
    border-bottom: solid 1px #ccc;
    width: 100%;
  }
.curriculum .tbl-r02 {
    width: 98%;
  }
.curriculum .tbl-r02 th,
  .tbl-r02 td {
　　border-bottom: none;
    display: block;
    width: 100%;
	font-size: 4.2vw;
  }
  
  .curriculum .tbl-r02 td {
　border: none;
	border-bottom: ;
	border-right: none;
	width: 100%;
	font-size: 4.2vw;
}
  
}


/*=================================

　　スケジュール

=================================*/

.schedule{
	width: 800px;
	margin: 20px auto 100px;
	text-align:center;
}

.schedule p{
	font-size: 18px;
	margin-bottom: 15px;
}

.schedule ul{
	width: 600px;
	margin: 0 auto;
}

.schedule ul li{
	
	margin-bottom: 30px;
}



/*=================================

　　受講の流れ

=================================*/

.sect-nagare .inner{
	width: 800px;
	margin: 30px auto 80px;
}


.sect-nagare .inner ul li{
	border: 1px solid #666;
	margin-bottom: 10px;
	
}

.sect-nagare .inner ul li .box{
	padding: 20px;
	font-size: 18px;
}

.sect-nagare .inner ul li h3{
	background-color: #09C;
	color: #fff;
	
	padding: 10px 0 10px 20px;
	
	font-size: 24px;
}

.sect-nagare .inner ul li h4{
	
	font-size: 20px;
	margin-bottom: 10px;
}

.sect-nagare .inner .mrak{
	width: 120px;
	margin: 0 auto 10px;
}


/*=================================

　　料金表

=================================*/

.price{
	width: 850px;
	margin: 0 auto 70px;
}

.price .inner{
	width: 850px;
	margin: 0 auto 0px;
	border: 2px solid #666;
	border-radius: 30px; 
	padding: 30px;
}

.price table{
  width: 100%;
  font-size: 18px;
}

.price table th{
  position: relative;
  text-align: left;
  width: 30%;
}

.price table th:after{
  display: block;
  content: "";
  width: 30px;
  height: 2px;
  background-color: #333;
  position: absolute;
  top:calc(50% - 1px);
  right:20px;
}

.price table td{
  text-align: left;
  width: 100%;
  border: none;
}

.price p{
  font-size: 18px;
  margin-bottom: 10px;
}


.p-txt{
	
	margin-top: 10px;
}


/*=================================

　　体験

=================================*/

.sect-taiken{
	margin-bottom: 70px;
}

.sect-taiken .inner{
	width: 950px;
	margin: 0 auto;
}

.sect-taiken .inner p{
	width: 800px;
	margin: 40px auto;
	font-size: 19px;
	line-height: 170%;
	
}



.sect-taiken table {
  border-collapse: collapse;
  margin: 0 auto;
  padding: 0;
  width: 800px;
  
  font-size: 18px;
}

.sect-taiken table tr {
  background-color: #fff;
  border: 1px solid #bbb;
  padding: .35em;
}
.sect-taiken table th,
table td {
  padding: 1em 10px 1em 1em;
  border-right: 1px solid #bbb;
}
.sect-taiken table th {
  font-size: 18px;
  width: 200px;
}

.sect-taiken table td {
  font-size: 18px;
  width: 600px;
}
.sect-taiken table thead tr{
  background-color: #09C;
  color:#fff;
}
.sect-taiken .txt{
   text-align: center;
   font-size: 18px;
   
}
.sect-taiken .price{
   text-align: left;
}

.sect-taiken .btn{
   width: 350px;
   margin: 30px auto;
}

@media screen and (max-width: 760px) {
.sect-taiken{
	margin-bottom: 9%;
}

.sect-taiken .inner{
	width: 100%;
	margin: 0 auto;
}

.sect-taiken .inner p{
	width: 90%;
	margin: 3% 5%;
	font-size: 4.1vw;
	line-height: 170%;
	
}



.sect-taiken table {
  border-collapse: collapse;
  margin: 0 5%;
  padding: 0;
  width: 90%;
  
  font-size: 4.3vw;
}

.sect-taiken table tr {
  background-color: #fff;
  border: 1px solid #bbb;
  padding: .35em;
}
.sect-taiken table th,
table td {
  padding: 1em 10px 1em 1em;
  border-right: 1px solid #bbb;
}
.sect-taiken table th {
  font-size: 4.3vw;
  width: 30%;
}

.sect-taiken table td {
  font-size: 4.3vw;
  width: 60%;
}
.sect-taiken table thead tr{
  background-color: #09C;
  color:#fff;
  font-size: 4.3vw;
}
.sect-taiken .txt{
   text-align: center;
   font-size: 4.3vw;
   
}
.sect-taiken .price{
   text-align: left;
}

.sect-taiken .btn{
   width: 70%;
   margin: 3% 15%;
}


}



 /*=== 画像の表示エリア ================================= */
.slide {
  position   : relative;
  overflow   : hidden;
                    /* 画像のサイズに合わせて変更ください */
  width      : 360px;
  height     : 360px;
  margin     : auto;      /* サンプルは中央寄せの背景：白 */
  background : #fff;
}
 
 /*=== 画像の設定 ======================================= */
.slide img {
  display    : block;
  position   : absolute;
                      /* 画像のサイズを表示エリアに合せる */
  width      : inherit;
  height     : inherit;
  opacity    : 0;
  animation  : slideAnime 16s ease infinite;
}
 
 /*=== スライドのアニメーションを段差で開始する ========= */
.slide img:nth-of-type(1) { animation-delay: 0s }
.slide img:nth-of-type(2) { animation-delay: 4s }
.slide img:nth-of-type(3) { animation-delay: 8s }
.slide img:nth-of-type(4) { animation-delay: 12s }

 
 /*=== スライドのアニメーション ========================= */
@keyframes slideAnime{
   0% { opacity: 0 }
   5% { opacity: 1 }
  15% { opacity: 1 }
  20% { opacity: 0 }
 100% { opacity: 0 }
}








.qa-btn{
	width: 1000px;
	margin: 0 auto 50px;
	text-align:center;
}

.qa-btn{
	width: 400px;
	
	text-align:center;
}



/*****************************************************

       companyページ	

*****************************************************/


.company{
	width: 870px;
	margin: 0 auto 100px;
}


.company table{
  width: 100%;
  border-collapse: collapse;
  font-size: 20px;
}

.company table tr{
  border-bottom: solid 2px white;
}

.company table tr:last-child{
  border-bottom: none;
}

.company table th{
  position: relative;
  text-align: left;
  width: 30%;
  background-color: #52c2d0;
  color: white;
  text-align: center;
  padding: 10px 20px
}

.company table th:after{
  display: block;
  content: "";
  width: 0px;
  height: 0px;
  position: absolute;
  top:calc(50% - 10px);
  right:-10px;
  border-left: 10px solid #52c2d0;
  border-top: 10px solid transparent;
  border-bottom: 10px solid transparent;
}

.company table td{
  text-align: left;
  width: 70%;
  text-align: left;
  background-color: #eee;
  padding: 10px 20px;
}

/*****************************************************

      asctページ	

*****************************************************/


.asct{
	width: 870px;
	margin: 0 auto 100px;
}


.asct table{
  width: 100%;
  border-collapse: collapse;
  font-size: 20px;
}

.asct table tr{
  border-bottom: solid 2px white;
}

.asct table tr:last-child{
  border-bottom: none;
}

.asct table th{
  position: relative;
  text-align: left;
  width: 30%;
  background-color: #52c2d0;
  color: white;
  text-align: center;
  padding: 10px 20px
}

.asct table th:after{
  display: block;
  content: "";
  width: 0px;
  height: 0px;
  position: absolute;
  top:calc(50% - 10px);
  right:-10px;
  border-left: 10px solid #52c2d0;
  border-top: 10px solid transparent;
  border-bottom: 10px solid transparent;
}

.asct table td{
  text-align: left;
  width: 70%;
  text-align: left;
  background-color: #eee;
  padding: 10px 20px;
}

/*****************************************************

       ppページ	

*****************************************************/

.pp{
	width: 800px;
	margin: 0 auto 100px;
}

.pp p{
	font-size: 20px;
}











/*****************************************************

       メールフォーム

*****************************************************/

.form-box{
	width: 100%;
	background-color: #F4FBFF;
	padding: 50px 0;
}
.form-box h3{
	font-size: 25px;
	width: 100%;
	text-align: center;
	margin-bottom: 20px;
}


* {
  box-sizing: border-box;
  line-height: 1.4;
}
input[type="text"],
input[type="email"],
#formWrap  select {
  padding: 10px;
  width: 100%;
}
#formWrap  dt, dd {
  margin: 0;
  padding: 0;
}
label {
  cursor: pointer;
  margin-right: 10px;
}
input[type="radio"] {
  cursor: pointer;
}
#formWrap {
	width:800px;
	margin:0 auto 100px;
	color:#555;
	line-height:120%;
	font-size:18px;
}

#formWrap p{
	margin-bottom: 15px;
}
#formWrap table.formTable {
	width:100%;
	margin:0 auto;
	border-collapse:collapse;
	color:#333;
}
#formWrap table.formTable td,
#formWrap table.formTable th {
	border:1px solid #ccc;
	padding:20px;
	color:#333;
	background:#fff;
}
#formWrap table.formTable th {
	width:30%;
	font-weight:normal;
	background:#fff;
	text-align:left;
}
#formWrap .privacy_area {
  border: 1px solid #ccc;
  overflow-y: scroll;
  padding: 18px;
  width: 100%;
  height: 240px;
  font-size: 16px;
  background:#fff;
  margin-bottom: 15px;
}
#formWrap .require {
  color: #c00;
  font-size: 14px;
  line-height: 2.0;
}
#formWrap .submit_btn {
  text-align: center;
  margin-top: 50px;
}
#formWrap .submit_btn input {
  cursor: pointer;
  width: 300px;
  font-size: 25px;
  background-color: #06C;
  color: #fff;
  border-radius: 10px;
  padding: 13px;
  border: 2px solid #fff;
  
}

#formWrap .submit_btn input:hover {
  border: 2px solid  #06C;
  width: 300px;
  font-size: 25px;
  background-color: #fff;
  color: #06C;
  border-radius: 10px;
  padding: 13px;
  
}
/* レスポンシブ用CSS */
@media screen and (max-width:572px) {
  #formWrap {
  	width:95%;
  	margin:0 auto;
  }
  #formWrap table.formTable th,
  table.formTable td {
  	width:auto;
  	display:block;
  }
  #formWrap table.formTable th {
  	margin-top:5px;
  	border-bottom:0;
  }
  input[type="text"],
  input[type="email"],
  textarea {
  	width:100%;
  	padding:5px;
  	font-size:110%;
  	display:block;
  }
  input[type="submit"],
  input[type="button"] {
  	display:block;
  	width:100%;
  	
  }
  
  #formWrap .submit_btn input {
  cursor: pointer;
  width: 60%;
  font-size: 5vw;
  background-color: #09C;
  color: #fff;
  margin: 1% 20% 5%;
  border-radius: 10px;
  padding: 10px 0;
  border: 2px solid #fff;
}

button,
input[type="submit"] {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    padding: 0;
    border: none;
    outline: none;
    background: transparent;
}


#formWrap p{
	margin-bottom: 3%;
	font-size: 4.2vw;
}




#formWrap table.formTable td,
#formWrap table.formTable th {
	
	padding:8px 10px;
	font-size: 4.3vw
}



#formWrap .submit_btn {
  text-align: center;
  margin-top: 5%;
}


}




/*====================================================================
　　　
　　　　アコーディオン


====================================================================*/


.sect-qa{
	width: 1000px;
	margin: 0 auto;
	margin-bottom: 70px;
}

.sect-qa h3{
	font-size: 26px;
	color: #09C;
	margin-bottom: 10px;
}

.sect-qa .section{
	margin-bottom: 30px;
}


/*====================================================================
.s_05 .accordion_one
====================================================================*/
.s_05 .accordion_one {
  max-width: 1000px;
  margin: 0 auto;
}
.s_05 .accordion_one .accordion_header {
  background-color: #09C;
  border: 2px solid #fff;
  color: #fff;
  font-size: 22px;
  font-weight: bold;
  padding: 12px 11%;
  text-align: center;
  position: relative;
  z-index: +1;
  cursor: pointer;
  transition-duration: 0.2s;
}


.s_05 .accordion_one .accordion_header:hover {
  opacity: .8;
}
.s_05 .accordion_one .accordion_header .i_box {
  display: flex;
  justify-content: center;
  align-items: center;
  position: absolute;
  top: 50%;
  right: 5%;
  width: 40px;
  height: 40px;
  border: 1px solid #fff;
  margin-top: -20px;
  box-sizing: border-box;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
  transform-origin: center center;
  transition-duration: 0.2s;
}
.s_05 .accordion_one .accordion_header .i_box .one_i {
  display: block;
  width: 18px;
  height: 18px;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
  transform-origin: center center;
  transition-duration: 0.2s;
  position: relative;
}
.s_05 .accordion_one .accordion_header.open .i_box {
  -webkit-transform: rotate(-360deg);
  transform: rotate(-360deg);
}
.s_05 .accordion_one .accordion_header .i_box .one_i:before, .s_05 .accordion_one .accordion_header .i_box .one_i:after {
  display: flex;
  content: '';
  background-color: #fff;
  border-radius: 10px;
  width: 18px;
  height: 4px;
  position: absolute;
  top: 7px;
  left: 0;
  -webkit-transform: rotate(0deg);
  transform: rotate(0deg);
  transform-origin: center center;
}
.s_05 .accordion_one .accordion_header .i_box .one_i:before {
  width: 4px;
  height: 18px;
  top: 0;
  left: 7px;
}
.s_05 .accordion_one .accordion_header.open .i_box .one_i:before {
  content: none;
}
.s_05 .accordion_one .accordion_header.open .i_box .one_i:after {
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg);
}
.s_05 .accordion_one .accordion_inner {
  display: none;
  padding: 30px 30px;
  border-left: 2px solid #09C;
  border-right: 2px solid #09C;
  border-bottom: 2px solid #09C;
  box-sizing: border-box;
}

.s_05 .accordion_one .accordion_inner .box_one {
  height: auto;
}
.s_05 .accordion_one .accordion_inner p.txt_a_ac {
  margin: 0 0 30px;
  font-size: 18px;
}
.s_05 .accordion_one .accordion_inner .closeArea {
  width: 180px;
  margin: 0 auto;
}
.s_05 .accordion_one .accordion_inner .closeArea .close_box a.close_btn {
  display: flex;
  justify-content: center;
  align-items: center;
  background: #09C;
  padding: 15px 15px 15px 20px;
  text-decoration: none;
  line-height: 1.3;
  color: #fff;
  font-size: 18px;
  font-weight: bold;
  position: relative;
  cursor: pointer;
  transition-duration: 0.2s;
}

.s_05 .accordion_one .accordion_inner .closeArea .close_box a.close_btn:hover {
  opacity: .8;
}
.s_05 .accordion_one .accordion_inner .closeArea .close_box a.close_btn .i_box {
  display: flex;
  justify-content: center;
  align-items: center;
  position: absolute;
  top: 50%;
  left: 10%;
  width: 30px;
  height: 30px;
  margin-top: -15px;
}
.s_05 .accordion_one .accordion_inner .closeArea .close_box a.close_btn .i_box .one_i {
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
  width: 18px;
  height: 18px;
}
.s_05 .accordion_one .accordion_inner .closeArea .close_box a.close_btn .i_box .one_i:before, .s_05 .accordion_one .accordion_inner .closeArea .close_box a.close_btn .i_box .one_i:after {
  content: '';
  background-color: #fff;
  border-radius: 10px;
  width: 18px;
  height: 4px;
  position: absolute;
  top: 7px;
  left: 0;
  -webkit-transform: rotate(-45deg);
  transform: rotate(45deg);
  transform-origin: center center;
}
.s_05 .accordion_one .accordion_inner .closeArea .close_box a.close_btn .i_box .one_i:before {
  width: 4px;
  height: 18px;
  top: 0;
  left: 7px;
}
@media screen and (max-width: 1024px) {
  .s_05 .accordion_one .accordion_header {
    font-size: 18px;
  }
  .s_05 .accordion_one .accordion_header .i_box {
    width: 30px;
    height: 30px;
    margin-top: -15px;
  }
  .s_05 .accordion_one .accordion_inner .closeArea .close_box a.close_btn {
    font-size: 14px;
  }
}
@media screen and (max-width: 767px) {
  .s_05 .accordion_one .accordion_header {
    font-size: 4.8vw;
    text-align: left;
    padding: 15px 60px 15px 15px;
  }
  
  .s_05 .accordion_one .accordion_inner p.txt_a_ac {
  font-size: 4.2vw;
  margin: 0 0 30px;
}
}