/* HeroBnr
======================================================================*/
.HeroBnr {
	width: 100%;
	height: 100vh;
	/*max-height: 770px;*/
    /*max-height: 652px;*/
	max-height: 660px;
	position: relative;
	background-color: #00A0E9;
	/*background-image: url(../../images/contents/eduplus/edu_main_bg@2x.png);*/
	background-repeat: repeat-x;
	background-position: center center;
	background-size: auto 100%;
    margin-top: 86px;
}


/* コンテンツ - 個別設定
======================================================================*/
/* eduplus */
.HeroBnr.eduplus {
	background-image: url(../../images/contents/eduplus/edu_main_bg@2x.png);
}

/* programing */
.HeroBnr.programing {
	background-image: url(../../images/contents/programing/main_bg@2x.png);
}

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


.HeroBnr .inside{
	width: 100%;
	/*max-width: 1000px;*/
	max-width: 1280px;
	height: 100%;
	position: relative;
	margin: 0 auto;
}

.HeroBnr .main-copy {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 99;
}

@media only screen and (max-width:999px){
.HeroBnr {
	margin-top: 70px;
}
}
@media only screen and (max-width:740px){
.HeroBnr {
	/*max-height: 660px;*/
    max-height: 390px;
}
}
@media only screen and (max-width:470px){
.HeroBnr {
	/*background-position: right -80px center;*/
    background-position: center top;
    background-size: auto 100%;
    /*max-height: 100%;*/
}
}

/***** main-visual *****/

.HeroBnr .main-visual {
    width: 100%;
    /*max-width: 1200px;*/
	max-width: 1280px;
    position: absolute;
    top: -22px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 99;
    text-align: center;
}

.HeroBnr .main-visual img{
    /*max-width: 1110px;*/
	max-width: 1280px;
    width: 100%;
    height: auto;
}

@media only screen and (max-width:740px){
.HeroBnr .main-visual {
    top:0px;
   overflow: hidden;
    width: 100vw;
    /*height: 280px;*/
	height: 380px;
    position: relative;
}
.HeroBnr .main-visual img{
    position: absolute;
    top: 50%;
    left: 50%;
    /*height: 280px;*/
	height: 380px;
    width: auto;
    transform: translate(-50%, -50%);
}
}

/***** mv-btn *****/
.mv-btn {
	text-align: center;
	padding-top: 30px;
}
@media only screen and (max-width:740px){
.mv-btn {
    padding-top: 15px;
}
}

.mv-btn a{
    transition: all 0.3s linear;
}
.mv-btn a:hover{
    opacity: 0.6;
}




/* ▼ 以下、不要 ▼
======================================================================*/
/***** main-copy *****/

.HeroBnr .main-copy {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: 2%;
    z-index: 99;
}
@media only screen and (max-width:740px){
.HeroBnr .main-copy {
    top: 20%;
    left: 50%;
    transform: translate(-50%, -50%);
}
}
@media only screen and (max-width:470px){
.HeroBnr .main-copy {
    max-width: 200px;
}
}

.HeroBnr .main-copy h1{
    text-align: center;
}

.main-copy .btnset {
    margin-top: 80px;
}
@media only screen and (max-width:470px){
.main-copy .btnset {
    margin-top: 40px;
}
}

.HeroBnr a.mv_link{
	display: inline-block;
    width: 100%;
	max-width: 280px;
	font-size: 1.6rem;
	color: #000000;
	padding-bottom: 8px;
	border-bottom: 1px solid rgba(0,0,0,0.80);
	background-image: url(../../images/icon_arrow.svg);
	background-repeat: no-repeat;
	background-position: right bottom 12px;
	background-size: 22px 22px;
	transition: all 0.3s linear;
}
@media only screen and (max-width:470px){
.HeroBnr a.mv_link{
	font-size: 1.4rem;
    min-height: 36px;
}
}

.HeroBnr a.mv_link:hover{
	color: #00A0E9;
    border-bottom: 1px solid #00A0E9;
}

/***** head-line *****/

.HeroBnr .head-line {
	width: 100%;
	max-width: 460px;
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	right: 2%;
	z-index: 99;
	background-color: rgba(255,255,255,0.90);
	padding: 25px 20px;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	border-radius: 10px;
	-webkit-box-shadow: 3px 3px 6px rgba(0,0,0,0.20);
	box-shadow: 3px 3px 6px rgba(0,0,0,0.20);
}
@media only screen and (max-width:740px){
.HeroBnr .head-line {
    max-width: 95%;
    top: auto;
    transform: translateY(-0%);
    bottom: 20px;
}
}


/* bnrWrap
======================================================================*/
.bnrWrap {
    max-width: 1000px;
    margin: 0 auto;
}

.bnrWrap ul{
    display: flex;
    flex-wrap: wrap;
    padding-top: 20px;
}
@media only screen and (max-width:740px){
.bnrWrap ul{
    padding-top: 10px;
}
}

.bnrWrap li {
    text-align: center;
    margin: 0 auto;
}

.bnrWrap li img{
    max-width: 100%;
	-webkit-box-shadow: 2px 2px 6px rgba(0,0,0,0.10);
	box-shadow: 2px 2px 6px rgba(0,0,0,0.10);
}

/* aboutWrap
======================================================================*/
.aboutWrap {
    width: 100%;
    /*padding: 90px 0;*/
    padding: 30px 0 90px;
}
@media only screen and (max-width:740px){
.aboutWrap {
    /*padding: 30px 0;*/
    padding: 15px 0 30px;
}
}

.aboutWrap h3{
    text-align: center;
    width: 100%;
    margin-bottom: 30px;
}

.aboutWrap h4{
    font-size: 1.8rem;
	font-weight: 500;
    line-height: 1.6;
    margin-bottom: 30px;
}
@media only screen and (max-width:740px){
.aboutWrap h4{
    font-size: 1.4rem;
    font-weight: 700;
}
}

.aboutWrap h4 span.red{
    color: #E60012;
}

.aboutWrap p{
    font-size: 1.4rem;
}

.aboutWrap ul.label{
    display: flex;
	flex-wrap: wrap;
	justify-content: center;
    margin-bottom: 60px;
}

.aboutWrap ul.label li{
   max-width: 31%;
    margin: 5px;
}

@media only screen and (max-width:740px){
.aboutWrap ul.label li{
    max-width: 48%;
    margin: 0 1%;
}
}

/* aboutWhtBox */

.aboutWhtBox {
	width: 100%;
	max-width: 1000px;
	margin: 0 auto;
	padding: 60px;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	background-color: #FFFFFF;
	-webkit-box-shadow: 3px 3px 6px rgba(0,0,0,0.10);
	box-shadow: 3px 3px 6px rgba(0,0,0,0.10);
    margin-top: 60px;
}

@media only screen and (max-width:740px){
.aboutWhtBox {
	padding: 30px;
    margin-top: 30px;
}
}

.aboutWhtBox.btm {
	padding: 30px;
}
@media only screen and (max-width:740px){
.aboutWhtBox.btm {
	padding: 20px;
}
}

.aboutWhtBox .col2{
    display: flex;
	flex-wrap: wrap;
	justify-content: space-between; 
	align-items: center;
}

.aboutWhtBox .col2 .detail{
	width: 48%;
}
@media only screen and (max-width:740px){
.aboutWhtBox .col2 .detail{
    width: 100%;
    margin-bottom: 30px;
}
.aboutWhtBox .col2 .detail:last-child{
    margin-bottom: 0px;
}
}
/*
.aboutWhtBox .col2 .detail.img-left{
	text-align: left;
}

.aboutWhtBox .col2 .detail.img-right{
	text-align: right;
}
*/
.block-mov{
	width: 100%;
	max-width: 880px;
	margin: 30px auto 0;
}

.block-mov iframe{
	border-radius: 4px;
}

.aboutWhtBox .col2 .detail-btm{
	width: 50%;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
}
.aboutWhtBox .col2 .detail-btm:first-child{
	border-right: 1px solid #00a0e9;
}

@media only screen and (max-width:740px){
.aboutWhtBox .col2 .detail-btm{
    width: 100%;
    margin-bottom: 30px;
}
.aboutWhtBox .col2 .detail-btm:first-child{
    border-right: none;
	border-bottom: 1px solid #00a0e9;
}
}

.aboutWhtBox .col2 .detail-btm h2{
	padding-top: 20px;
}

.aboutWhtBox .col2 .detail-btm .btm-logo{
	margin-top: 20px;
	text-align: center;
}


/* whatWrap
======================================================================*/
.whatWrap {
    width: 100%;
    padding: 90px 0;
    background-color: #00A0E9;
}
@media only screen and (max-width:740px){
.whatWrap {
    padding: 30px 0;
}
}
.whatWrap h3{
    text-align: center;
    font-size: 2.0rem;
    line-height: 1.4;
    padding-bottom: 20px;
    margin-bottom: 20px;
    color: #00A0E9;
    position: relative;
    /*option*/
    min-height: 76px;
    display: flex;
	flex-wrap: wrap;
	justify-content: center;
        align-items: center;
}
@media only screen and (max-width:740px){
.whatWrap h3{
    font-size: 1.6rem;
    min-height: auto;
}
}

.whatWrap h3:after{
    position: absolute;
    content: '';
    width: 50px;
    height: 1px;
    background-color: #00A0E9;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
}

.whatWrap p.caption{
    font-size: 1.4rem;
    text-align: center;
}
@media only screen and (max-width:740px){
.whatWrap p.caption{
    font-size: 1.2rem;
    text-align: center;
}
}



.whatWrap ul.what{
    display: flex;
	flex-wrap: wrap;
	justify-content: space-between; 
    margin-top: 60px;
}
@media only screen and (max-width:740px){
.whatWrap ul.what{
    margin-top: 30px;
}
}

.whatWrap ul.what li{
	text-align: center;
	width: 30%;
	/*margin: 15px;*/
	padding: 30px 15px;
	background-color: #FFFFFF;
	border-radius: 10px;
	-webkit-box-shadow: 3px 3px 6px rgba(0,0,0,0.10);
	box-shadow: 3px 3px 6px rgba(0,0,0,0.10);
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}
@media only screen and (max-width:740px){
.whatWrap ul.what li{
	width: 100%;
	margin-bottom: 15px;
	padding: 20px 15px;
}
.whatWrap ul.what li:last-child{
	margin-bottom: 0px;
}
}

.whatWrap ul.what li img{
	margin: 0 auto 20px;
}

/* pointWrap
======================================================================*/
.pointWrap {
    width: 100%;
    padding-top: 90px;
}
@media only screen and (max-width:740px){
.pointWrap {
    padding-top: 30px;
}
}

.pointWrap h3{
    text-align: center;
    font-size: 2.4rem;
    font-weight: 600;
    line-height: 1.4;
    padding-bottom: 20px;
    margin-bottom: 20px;
    color: #00A0E9;
    position: relative;
}
@media only screen and (max-width:740px){
.pointWrap h3{
    font-size: 1.8rem;
}
}

.pointWrap h4.flex{
    text-align: center;
    font-size: 1.8rem;
    font-weight: 500;
    line-height: 1.4;
    margin-bottom: 20px;
    color: #00A0E9;
    min-height: 60px;
    display: flex;
	flex-wrap: wrap;
	justify-content: center;
        align-items: center;
}
@media only screen and (max-width:740px){
.pointWrap h4.flex{
    font-size: 1.6rem;
    min-height: 40px;
}
}

.pointWrap h4.flex.sht{
    letter-spacing: -0.1em;
}

.pointWrap h5{
    text-align: center;
    font-size: 1.8rem;
    line-height: 1.4;
    margin: 20px auto;
    color: #00A0E9;
}
@media only screen and (max-width:740px){
.pointWrap h5{
    font-size: 1.6rem;
}
}

.pointWrap h6{
    font-size: 1.6rem;
    color: #00A0E9;
}
@media only screen and (max-width:740px){
.pointWrap h6{
    font-size: 1.4rem;
}
}

.pointWrap h6 span{
    font-size: 1.4rem;
    color: #000000;
}
@media only screen and (max-width:740px){
.pointWrap h6 span{
    font-size: 1.2rem;
}
}

.pointWrap p{
    font-size: 1.4rem;
    text-align: justify;
}
@media only screen and (max-width:740px){
.pointWrap p{
	/* 2025.11.08 -暫定- */
    /*font-size: 1.2rem;*/
}
}

.pointWrap p.caption{
    margin-bottom: 30px;
}

.pointWrap p.caption.mb00{
    margin-bottom: 0px;
}

.pointWrap p span.blu{
    color: #00A0E9;
}

.pointWrap p.caption span.sml{
    font-size: 1.2rem;
    display: block;
}
@media only screen and (max-width:740px){
.pointWrap p.caption span.sml{
    font-size: 1.0rem;
}
}

/* pointWhtBox */

.pointWhtBox {
	width: 100%;
	max-width: 1000px;
	margin: 0 auto;
	padding: 60px;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	background-color: #FFFFFF;
	-webkit-box-shadow: 3px 3px 6px rgba(0,0,0,0.10);
	box-shadow: 3px 3px 6px rgba(0,0,0,0.10);
    margin-top: 60px;
}

@media only screen and (max-width:740px){
.pointWhtBox {
	padding: 30px;
    margin-top: 30px;
}
}

.pointWhtBox .col2{
    display: flex;
	flex-wrap: wrap;
	justify-content: space-between; 
}

.pointWhtBox .col2 .detail{
	width: 48%;
    padding: 20px 0;
	border-top: 1px solid #00A0E9;
}
@media only screen and (max-width:740px){
.pointWhtBox .col2 .detail{
	width: 100%;
    margin-bottom: 20px;
}
.pointWhtBox .col2 .detail:last-child{
    margin-bottom: 0px;
}
}

.pointWhtBox .col2 .detail.flex{
	display: flex;
	flex-wrap: wrap;
}

.pointWhtBox .graybox{
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	background-color: #F7F8F8;
	padding: 20px;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

.pointWhtBox .graybox div{
	width: 48%;
}
@media only screen and (max-width:740px){
.pointWhtBox .graybox div{
	width: 100%;
    margin-bottom: 20px;
}
.pointWhtBox .graybox div:last-child{
    margin-bottom: 0px;
}
}

.pointWhtBox .graybox.wht{
	background-color: #FFFFFF;
	padding: 0px;
}

.pointWhtBox .imgbox{
    width: 100%;
	text-align: center;
	margin-top: auto;
}


/* contentsWrap
======================================================================*/
.contentsWrap {
    width: 100%;
    padding: 90px 0;
}
@media only screen and (max-width:740px){
.contentsWrap {
    padding: 30px 0;
}
}

.contentsWrap h3.box{
	width: 100%;
	text-align: center;
	font-size: 2.0rem;
	font-weight: 600;
	line-height: 1.4;
	padding: 10px 20px;
	margin-top: 60px;
	color: #FFFFFF;
	background-color: #00A0E9;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

.contentsWrap p.lead-2{
    width: 100%;
    font-size: 1.4rem;
    text-align: center;
    padding-top: 20px;
}

.contentsWrap h4.flex{
	text-align: left;
	font-size: 1.8rem;
	font-weight: 500;
	line-height: 1.4;
	color: #00A0E9;
	min-height: 80px;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
}
@media only screen and (max-width:740px){
.contentsWrap h4.flex{
	font-size: 1.6rem;
	min-height: 60px;
}
}

.contentsWrap h4.flex.row3{
	min-height: 120px;
}
@media only screen and (max-width:740px){
.contentsWrap h4.flex.row3{
	min-height: 90px;
}
}

.contentsWrap h5{
    text-align: left;
    font-size: 1.4rem;
    line-height: 1.4;
}

.contentsWrap h5 span{
    font-size: 1.2rem;
}

.contentsWrap p{
    font-size: 1.2rem;
    text-align: justify;
}

.contentsWrap p span.caution{
    float: right;
    font-size: 1.0rem;
}

.contentsWrap p.tab{
	font-size: 1.2rem;
    line-height: 1.2;
	text-align: center;
	color: #FFFFFF;
	background-color: #00A0E9;
	width: 140px;
	height: 30px;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
	border-bottom-left-radius: 5px;
	border-bottom-right-radius: 5px;
}

.contentsWrap p.sub{
    background-color: #F7B249;
    color: #FFFFFF;
    padding: 2px 4px;
    line-height: 1.0;
    display: flex;
	flex-wrap: wrap;
	justify-content: center;
        align-items: center;
    width: 49px;
    height: 20px;
    /*border-radius: 5px;*/
}

.contentsWrap p.sub.sub2{
    padding: 2px 2px;
    letter-spacing: -0.1em;
}

.contentsWrap p.sub.math{
    background-color: #00A7EA;
}
.contentsWrap p.sub.eng{
    background-color: #F19EC2;
}
.contentsWrap p.sub.sec{
    background-color: #AB66A7;
}
.contentsWrap p.sub.jpn{
    background-color: #008D81;
}
.contentsWrap p.sub.info{
    background-color: #95452A;
}
.contentsWrap p.sub.grn{
    background-color: #6FBA2C;
}
.contentsWrap p.sub.red{
    background-color: #E60012;
}

.contentsWrap p.btm{
    margin-top: auto;
}

/* col2 */

.contentsWrap .col2{
    display: flex;
	flex-wrap: wrap;
	justify-content: space-between; 
    margin-top: 40px;
}

.contentsWrap .col2.mt20{
    display: flex;
	flex-wrap: wrap;
	justify-content: space-between; 
    margin-top: 20px;
}

.contentsWrap .col2 .detail{
	width: 48%;
    padding: 0 25px 25px;
    -webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	background-color: #FFFFFF;
    border-radius: 20px;
	-webkit-box-shadow: 3px 3px 6px rgba(0,0,0,0.10);
	box-shadow: 3px 3px 6px rgba(0,0,0,0.10);
    margin: 20px 0;
     display: flex;
	flex-wrap: wrap;
}
@media only screen and (max-width:740px){
.contentsWrap .col2 .detail{
	width: 100%;
    padding: 0 20px 20px;
    margin-bottom: 20px;
}
.contentsWrap .col2 .detail:last-child{
    margin-bottom: 0px;
}
}

.contentsWrap .col2 .detail.eng{
    padding-top: 25px;
}

.contentsWrap .col2 .detail.notab{
    padding-top: 25px;
}
@media only screen and (max-width:740px){
.contentsWrap .col2 .detail.eng{
    padding-top: 20px;
}
.contentsWrap .col2 .detail.notab{
    padding-top: 20px;
}
}

.contentsWrap .subbox{
    width: 100%;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}

.contentsWrap .subbox .txt{
	width: 52%;
}

.contentsWrap .subbox .pht{
	width: 44%;
    text-align: right;
}

.contentsWrap .subbox .txt-one{
	width: 100%;
    margin-bottom: 30px;
}
@media only screen and (max-width:740px){
.contentsWrap .subbox .txt-one{
    margin-bottom: 20px;
}
}

.contentsWrap .subbox .pht-one{
	width: 100%;
    text-align: center;
    margin-top: auto;
}

.contentsWrap .infobox{
    width: 100%;
	border-top: 1px solid #DCDDDD;
    padding-top: 20px;
    margin-top: 20px;
}

.contentsWrap .infobox .subject{
    width: 100%;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
    padding: 10px 0;
}

.contentsWrap .infobox .subject div{
	width: 48%;
}

.contentsWrap .infobox .subject dl{
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
    margin: 2px 0;
}

.contentsWrap .infobox .subject dt{
	width: 50px;
}

.contentsWrap .infobox .subject dd{
	width: calc(100% - 55px);
}

.contentsWrap .infobox .subject dd p{
	letter-spacing: -0.1em;
}

.contentsWrap .infobox .subject ul{
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-start;
    margin-bottom: 5px;
}

.contentsWrap .infobox .subject li{
    margin-right: 5px;
}

.contentsWrap .infobox .subject li:last-child{
    margin-right: 0;
}

.contentsWrap .col2.mt00{
	margin-top: 0;
}

.contentsWrap .col2 .col-sub{
	width: 48%;
     display: flex;
	flex-wrap: wrap;
}
@media only screen and (max-width:740px){
.contentsWrap .col2 .col-sub{
	width: 100%;
}
}

.contentsWrap .col2 .col-sub .detail{
	width: 100%;
}


/* caseWrap
======================================================================*/
.caseWrap {
    width: 100%;
    padding: 90px 0;
}

@media only screen and (max-width:768px){
.caseWrap {
    padding: 30px 0;
}
}

.caseWrap h3{
    text-align: center;
    margin-bottom: 50px;
}

.caseWrap h4{
    font-size: 2.0rem;
    line-height: 1.4;
    color: #00A0E9;
    margin-bottom: 15px;
}

.caseWrap p{
    font-size: 1.4rem;
    line-height: 1.6;
    text-align: justify;
}

/* caseWhtBox */

.caseWhtBox {
	width: 100%;
	max-width: 1000px;
	margin: 0 auto;
	padding: 60px;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	background-color: #FFFFFF;
	-webkit-box-shadow: 3px 3px 6px rgba(0,0,0,0.10);
	box-shadow: 3px 3px 6px rgba(0,0,0,0.10);
    margin-top: 60px;
}
@media only screen and (max-width:740px){
.caseWhtBox {
	padding: 30px;
    margin-top: 30px;
}
}

.caseWhtBox .col2{
    display: flex;
	flex-wrap: wrap;
	justify-content: space-between; 
}

.caseWhtBox .col2 .detail{
    width: 48%;
}
@media only screen and (max-width:740px){
.caseWhtBox .col2 .detail{
    width: 100%;
    margin-bottom: 20px;
}
.caseWhtBox .col2 .detail:last-child{
    margin-bottom: 0px;
}
}

/* faq_wrap
======================================================================*/

.faq_wrap {
    text-align: center;
    padding: 90px 0;
}

@media only screen and (max-width:768px){
.faq_wrap {
    padding: 30px 0;
}
}

.faq_wrap dl.faq{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    margin-bottom: 20px;
}
@media only screen and (max-width:768px){
.faq_wrap dl.faq{
    margin-bottom: 10px;
}
}

.faq_wrap dl.faq dt{
	width: 100%;
	background-color: #FFFFFF;
	/*border-radius: 10px;*/
	padding: 30px 50px 30px 30px;
	margin-bottom: 2px;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	position: relative;
	font-size: 2.0rem;
	font-weight: 500;
	line-height: 1.5;
	text-align: left;
	color: #00A0E9;
	-webkit-box-shadow: 3px 3px 6px 0px rgba(0,0,0,0.10);
	box-shadow: 3px 3px 6px 0px rgba(0,0,0,0.10);
}
@media only screen and (max-width:768px){
.faq_wrap dl.faq dt{
    padding: 8px 48px 8px 20px;
    font-size: 1.4rem;
}
}

.faq_wrap dl.faq dt img{
     position: absolute;
    top: 50%;
    right: 20px;
    transform: translateY(-50%);
    transition: all 0.3s linear;
}
@media only screen and (max-width:768px){
.faq_wrap dl.faq dt img{
    right: 10px;
}
}

.faq_wrap dl.faq dd{
    width: 100%;
    background-color: #FFFFFF;
    /*border-radius: 10px;*/
    padding: 20px 30px;
    margin-bottom: 40px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    position: relative;
    text-align: justify;
}

@media only screen and (max-width:768px){
.faq_wrap dl.faq dd{
    padding: 8px 20px;
    font-size: 1.3rem;
}
}

/*** accordion ***/

.faq_wrap dl .ac-parent {
    position: relative;
    cursor: pointer;
}

.faq_wrap dl .ac-parent:after {
    content: none;
}

/* オープン時にopenクラスを付与 */
.faq_wrap dl.faq dt.open img{
    top: 40%;
    transform: rotate(90deg);
}

/* 初期状態を閉じる */
.faq_wrap dl .ac-child {
  display: none;
}

/* flow_wrap
======================================================================*/

.flow_wrap {
    text-align: center;
    padding: 0 0 90px;
}

@media only screen and (max-width:768px){
.flow_wrap {
    padding: 0 0 30px;
}
}

.flow_wrap h3{
	min-height: 100px;
	text-align: center;
	font-size: 2.0rem;
	line-height: 1.4;
    padding-bottom: 20px;
	margin-bottom: 20px;
	color: #00A0E9;
    display: flex;
	flex-wrap: wrap;
	justify-content: center;
        align-items: center;
	position: relative;
	border-bottom: 1px solid #00A0E9;
}
@media only screen and (max-width:740px){
.flow_wrap h3{
	min-height: 80px;
}
}

.flow_wrap p.caption{
    font-size: 1.4rem;
    text-align: justify;
}

.flow_wrap ul.flow{
    display: flex;
	flex-wrap: wrap;
	justify-content: space-between; 
    margin-top: 60px;
}

.flow_wrap ul.flow li{
	text-align: center;
	width: 30%;
	/*margin: 15px;*/
	padding: 30px 15px 15px;
	background-color: #FFFFFF;
	border-radius: 10px;
	-webkit-box-shadow: 3px 3px 6px rgba(0,0,0,0.10);
	box-shadow: 3px 3px 6px rgba(0,0,0,0.10);
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

@media only screen and (max-width:740px){
.flow_wrap ul.flow li{
	width: 100%;
	padding: 30px 15px 15px;
	margin-bottom: 20px;
}
.flow_wrap ul.flow li:last-child{
	margin-bottom: 0px;
}
}

.flow_wrap ul.flow li img{
	margin: 0 auto 30px;
}

@media only screen and (max-width:740px){
.flow_wrap p.lead {
	text-align: center!important;
}
}

/* BlkBnr
======================================================================*/
.BlkBnr{
    width: 100%;
    background-color: #000000;
}
.BlkBnr ul{
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	padding: 40px 0;
}
@media only screen and (max-width:740px){
.BlkBnr ul{
	padding: 20px 0;
}
}

.BlkBnr li{
    width: 100%;
}

.BlkBnr ul li a.buttton-btm{
	display: flex;
	align-items: center;
	width: 100%;
	max-width: 416px;
	height: 60px;
	border-radius: 50vh;
	font-size: 2.0rem;
	font-weight: 500;
	color: #000000;
	padding: 0 40px;
	background-color: #FFFFFF;
	text-align: left;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	background-image: url(../../images/icon_arrow.svg);
	background-repeat: no-repeat;
	background-position: right 20px center;
    transition: all 0.3s linear;
    margin: 0 auto;
}

.BlkBnr ul li a p{
	line-height: 1.4;
}

@media only screen and (max-width:740px){
.BlkBnr ul li a.buttton-btm{
	min-width: auto;
}
}

@media only screen and (max-width:470px){
.BlkBnr ul li a p{
	font-size: 1.4rem;
}
}

.BlkBnr ul li a:hover{
    color: #000000;
    opacity: 0.6;
}


/* multi-column
======================================================================*/

.col2-multi{
	width: 100%;
	column-count: 2;
	column-gap: 40px;
}
@media only screen and (max-width:740px){
.col2-multi{
	column-count: 1;
	column-gap: 0;
}
}

.col3-multi{
	width: 100%;
	column-count: 3;
	column-gap: 40px;
}
@media only screen and (max-width:740px){
.col3-multi{
	column-count: 1;
	column-gap: 0;
}
.col3-multi div{
	margin-bottom: 30px;
}
.col3-multi div:last-child{
	margin-bottom: 0px;
}
}

/* btn_culturekids
======================================================================*/

.btn_culturekids {
	width: 92%;
	text-align: center;
	margin: 30px auto 0;
}

@media only screen and (max-width:740px){
.btn_culturekids {
	margin: 20px auto 0;
}
}

.btn_culturekids img{
	max-width: 100%;
	height: auto;
	-webkit-box-shadow: 3px 3px 9px rgba(0,0,0,0.20);
	box-shadow: 3px 3px 9px rgba(0,0,0,0.20);
}



