@charset "utf-8";
/* CSS Document */
.online01{display:flex;justify-content:flex-end;align-items:center;margin-bottom:100px;padding:50px 0;background:linear-gradient(to left,#00aebb 0%,#00aebb 30%,#FFF 30%,#FFF 100%);}
.online01-cap{width:30%;margin-right:2%;}
.online01-cap h2{font-size:1.5rem;margin-bottom:20px;}
.online01-cap p:first-child{font-size:1.5rem;line-height:normal;font-family:'Centaur',serif;margin-bottom:1rem;}
.online01-image{width:40%;margin-right:10%;}

.bar-title{margin:0 auto 50px;text-align:center;}
.bar-title.topic{width:60%;}
.bar-title.topic p.cap{text-align:left;}
.bar-title br{display:none;}
.bar-title.mb100{margin-bottom:100px;}
.bar-title.mt50{margin-top:50px;}
.bar-title.mt200{margin-top:200px;}
.bar-title h2{position:relative;display:inline-block;text-align:center;font-size:1.5rem;color:#856b30;margin-bottom:40px;}
.bar-title h2:before{content:'';position:absolute;left:50%;transform:translateX(-50%);bottom:-20px;display:inline-block;width:60px;height:1px;background-color:#AAA;transition:.5s all;}
.bar-title h3{position:relative;display:inline-block;text-align:center;font-size:1.5rem;color:#856b30;margin-bottom:40px;}
.bar-title h3:before{content:'';position:absolute;left:50%;transform:translateX(-50%);bottom:-20px;display:inline-block;width:60px;height:1px;background-color:#AAA;transition:.5s all;}

.online02{display:flex;justify-content:center;align-items:center;margin-bottom:100px;background:linear-gradient(to right,#00aebb 0%,#00aebb 10%,#FFF 10%,#FFF 100%);}
.online02-image{width:33%;margin-right:2%;}
.online02-cap{width:30%;}
.online02-cap h3{font-size:1.5rem;margin-bottom:20px;}

p.under-bar{color:#00aebb;}
.bar-title h2{color:#00aebb;}

.function-list{display:flex;justify-content:center;align-items:center;flex-wrap:wrap;width:50%;margin:0 auto 50px;}
.function-list li{width:23.5%;margin-right:2%;margin-bottom:50px;}
.function-list li:nth-child(3n),.function-list li:last-child{margin-right:0;}
.function-list li p{text-align:center;color:#00aebb;}
.function-list li img{max-width:69px;margin:0 auto;}

.online03{display:flex;justify-content:center;align-items:center;margin-bottom:100px;background:linear-gradient(to right,#00aebb 0%,#00aebb 10%,#FFF 10%,#FFF 100%);}
.online03.re{flex-direction:row-reverse;background:linear-gradient(to left,#00aebb 0%,#00aebb 10%,#FFF 10%,#FFF 100%);}
.online03-cap{width:25%;margin-right:2%;}
.online03-cap h3{font-size:1.5rem;margin-bottom:20px;}
.online03-image{width:25%;}
.online03.re .online03-image{width:20%;margin-right:5%;}
.online03.re .online03-cap{margin-right:0;}
.online03.re .online03-cap h3 br{display:none;}

.planner{display:flex;align-items:center;margin-bottom:100px;}
.planner-image{width:50%;margin-right:2%;}
.planner-image video{width:100%;}
.planner-cap{width:30%;}
.planner-cap h2{font-size:1.5rem;margin-bottom:20px;}

.online-att{padding:20px;border:solid 1px #AAA;background:#FFF;margin-top:20px;}
.online-att h3{font-size:1.2rem;fot-weight:bold;color:#D00;font-family:"メイリオ",sans-serif;margin-bottom:5px;}


.open-form{width:100%;margin:0 auto;padding:0 0 20px;}
.open-form h3{text-align:center;margin-bottom:20px;}
.open-form p{width:100%;text-align:center;}
label.form-button-label{position:relative;z-index:1;margin:0 auto 50px;}


@media screen and (max-width:1536px){
.online03.re .online03-cap{width:35%;}
}
@media screen and (max-width:1366px){}
@media screen and (max-width:1280px){}
@media screen and (max-width:1024px){
.online01-cap{width:40%;}
.online02-cap{width:40%;}
.online03.re .online03-cap{width:45%;}
.online03-cap{width:45%;}
.planner-cap{width:40%;}
}
@media screen and (max-width:768px){
.online01-cap h2{font-size:1.2rem;}
.online02-cap h3{font-size:1.2rem;}
.online03-cap h3{font-size:1.2rem;}
.planner-cap h2{font-size:1.2rem;}
}
@media screen and (max-width:640px){
.online01{display:block;margin-bottom:50px;padding:0;background:linear-gradient(to left,#00aebb 0%,#00aebb 10%,#FFF 10%,#FFF 100%);}
.online01-cap{width:100%;margin-right:0;padding:0 15px;margin-bottom:20px;text-align:center;}
.online01-cap p{text-align:left;}
.online01-cap p.under-bar:before{left:50%;transform:translateX(-50%);}
.online01-image{width:90%;margin:0 auto;}

.online02{flex-direction:column-reverse;margin-bottom:50px;padding:20px 0;background:linear-gradient(to right,#00aebb 0%,#00aebb 10%,#FFF 10%,#FFF 100%);}
.online02-image{width:90%;margin:0 auto;}
.online02-cap{width:100%;padding:0 15px;margin-bottom:20px;}
.online02-cap h3{text-align:center;}

.function-list{width:100%;margin:0 auto;}
.function-list li{width:49%;margin-right:2%;margin-bottom:50px;}
.function-list li:nth-child(3n){margin-right:2%;}
.function-list li:nth-child(2n){margin-right:0;}
.function-list li:last-child{margin-right:0;}

.online03{display:block;margin-bottom:50px;background:none;}
.online03.re{flex-direction:column-reverse;background:none;}
.online03-cap{width:100%;margin-right:0;padding:0 15px;margin-bottom:20px;}
.online03-cap h3{text-align:center;}
.online03-image{width:90%;margin:0 auto;}
.online03.re .online03-image{width:60%;margin:0 auto;}
.online03.re .online03-cap{width:100%;margin:0 0 20px;}
.online03.re .online03-cap h3{line-height:2rem;}
.online03.re .online03-cap h3 br{display:block;}

.planner{display:block;margin-bottom:50px;padding:15px;background:#00aebb;}
.planner-image{width:100%;margin-right:0;margin-bottom:20px;}
.planner-image video{display:none;}
.planner-cap{width:100%;}
.planner-cap h2{text-align:center;color:#FFF;}
.planner-cap p{color:#FFF;}

.open-form{padding:0 15px;margin-bottom:20px;}
.open-form p{text-align:left;}
.open-form p br{display:none;}
.bar-title{padding:0 15px;}
.bar-title br{display:block;}
.bar-title h2{line-height:2rem;}
.bar-title p{text-align:left;}
p.under-bar{text-align:center;}
.bar-title h2{color:#00aebb;text-align:center;}

}