@charset "UTF-8";
 #content .wrap{
overflow:hidden;
} body.home #main_visual .center{
background-color: #08080863;
margin: 3% auto;
width: 80%;
padding: 3% 0;
}
body.home #main_visual select {
-webkit-appearance: none; -moz-appearance: none; appearance: none; }
::-ms-expand { display: none;
}
body.home #main_visual label{
width:65%;
position:relative;
}
body.home #main_visual select.custom-select{
width: 100%;
height: 50px;
padding:0 20px;
background:none;
border: none;
font-size:150%; 
border-bottom: 1px solid; 
}
body.home #main_visual label:before {
content: "";
position: absolute;
top: 50%;
right: 15px;
display: block;
width: 0;
height: 0;
margin: -2px 0 0 0;
border: 7px solid transparent;
border-top: 8px solid #fff;
}
body.home #main_visual select.custom-select option{
color: #ccc;
}
select:focus {
outline: 2px #FFF solid;
}
body.home #main_visual .center span{
font-size:150%;
margin: 0 5px;
} body.home .front-main-cont .front-cont-header{
margin-bottom:2%;
padding: 2% 0;
}
body.home #front-contents .c_box{
border:none;
}
body.home .front-main-cont .front-cont-header .cont-title i{
margin-right:2%;
}
body.home .front-main-cont .front-cont-header .catch{
border-left: 1px solid;
border-right: 1px solid;
}
body.home #front-contents .c_box_inner{
width:100%;
margin: 0 0 3%;
border-bottom: 2px dotted #e8e6e6;
padding: 0 0 1%;
}
.front-main-cont .c_title{
margin-bottom:2%;
}
body.home #front-contents section h3{
border-left: 8px solid #3B4552;
padding-left: 1%;
}
body.home #front-contents section#front-contents-1 h3{
border-left: 8px solid #EC6941;
}
body.home #front-contents section#front-contents-2 h3{
border-left: 8px solid #11A32F;  
}
body.home #front-contents section#front-contents-3 h3{
border-left: 8px solid #FAA916;   
}
body.home #front-contents section#front-contents-4 h3{
border-left: 8px solid #26547C;   
}
.front-main-cont section .c_text{
padding: 5%;
border: 1px solid #3B4552;
margin: 2% 0;
position: relative;
background:#fff;
}
.front-main-cont #front-contents-1 .c_text{
border: 1px solid #EC6941;
}
.front-main-cont #front-contents-2 .c_text{
border: 1px solid #11A32F;
}
.front-main-cont #front-contents-3 .c_text{
border: 1px solid #FAA916;
}
.front-main-cont #front-contents-4 .c_text{
border: 1px solid #26547C;
}
.front-main-cont .course_type{
position: absolute;
top: 15px;
left: 0;
width:100%;
color:#fff;
font-size:80%;
}
.front-main-cont .course_type span.course_01{
background:#031731;
padding: 1% 2%;
}
.front-main-cont .course_type span.type_01{
background: #EC6941;
padding: 1% 2%;
}
.front-main-cont .course_type span.type_02{
background: #1EAA39;
padding: 1% 2%;
}
body.home #front-contents #front-contents-1 h4{
border-bottom: 1px solid #EC6941;
padding-bottom: 1%;
padding-top:10%;
}
body.home #front-contents #front-contents-2 h4{
border-bottom: 1px solid #11A32F;
padding-bottom: 1%;
padding-top:10%;
}
body.home #front-contents #front-contents-3 h4{
border-bottom: 1px solid #FAA916;
padding-bottom: 1%;
padding-top:10%;
}
body.home #front-contents #front-contents-4 h4{
border-bottom: 1px solid #26547C;
padding-bottom: 1%;
padding-top:10%;
}
body.home #front-contents .c_text p{
margin-bottom:2%;
}
.c_text p.details_text{
height:150px;
}
body.home #front-contents .c_text .c_btn a{
width: 100%;
}
body.home #front-contents .c_text:hover > .c_btn a{
background:#1EAA39;
}
body.home #front-contents .c_text:hover > .c_btn a:hover{
background:#026d0f;
}
.front-main-cont section p.step{
font-size:150%;
margin:0;
}
.front-main-cont #front-contents-1 p.step{
color:#EC6941;
}
.front-main-cont #front-contents-2 p.step{
color:#11A32F;
}
.front-main-cont #front-contents-3 p.step{
color:#FAA916;
}
.front-main-cont #front-contents-4 p.step{
color:#26547C;
}
table.course_details{
width:100%;
font-size: 80%;
margin: 10% 0 5%;
border:none;
}
table.course_details td{
padding:4px 2px;
text-align:center;
}
table.course_details td i{
font-size:130%;
padding-top: 5px;
} body.home #front-contents #front-service h3{
border:none;
padding-left:0;
}
body.home #front-service h3:hover{
transform:none; 
}
body.home #front-contents #front-service .c_box_inner{
border-bottom:none;
}
body.home #front-service .c_btn a,body.home #front-faq .c_btn a{
background: #1EAA39;
width: 50%;
text-align: center;
display: block;
margin: 5% auto 0;
padding: 2%;
color: #FFF;
font-size: 120%;
}
body.home #front-service .c_btn a:hover{
background:#026d0f;
} body.home #front-contents #front-voice .c_box_inner .voice_in{
text-align:center;
padding-top: 2%;
}
body.home #front-contents .c_box_inner .voice_in img{
border-radius: 50%;
}
body.home #front-contents .c_box_inner .voice_in span{
display:block;
text-align:center;
margin-top:5px;
}
body.home #front-contents .c_box_inner .voice_in p{
margin-top:10px;
text-align:left;
}
body.home #front-contents #front-voice .c_box_inner{
border-bottom:none;
} .Q_A{
padding: 5%;
border: 1px solid;
border-radius: 8px;
margin-bottom: 5%;
}
body.home #front-contents section .Q_A h3{
border-left: none;
border-bottom: 2px dotted #e8e6e6;;
padding-bottom: 2%;
}
body.home #front-contents section .Q_A h3 span{
font-weight:bold;
color:#EC6941;
}
body.home #front-contents section .Q_A p{
margin-top:3%;
margin-bottom: 2%;
}
body.home #front-contents #front-faq .c_box_inner{
border-bottom:none;
} .course-about .main-inner{
max-width: 1000px;
margin:0 auto;
background: none;
border: none;
padding:0;
}
.course-about .post-content .about_lead{
text-align:center;
line-height: 2;
}
.course-about .post-content h3{
font-size: 28px;
margin: 48px 0 48px;
padding: 20px 0;
clear: both;
font-weight: normal;
border-bottom: 2px solid #3B4552;
line-height: 1;
text-align:center;
}
.course-about .post-content h4{
font-size: 23px;
font-weight: normal;
margin: 0px 0 16px;
padding: 0 0 0 8px ;
border-left:5px solid #131D2A;
}
.course-about .post-content .about_honne .c_box_inner{
margin-bottom:3%;
}
.about_beginner{margin-top:10%;}
.course-about .beginner_course{
padding: 3% 2%;
border: 1px solid #131D2A;
margin:1% 0;
background-color:#f2f2f38a;
}
.course-about .post-content .course_type{
color:#fff;
font-size:80%;
}
.course-about table.course_details{
background-color: #ffffff91;
margin:0;
}
.course-about table.course_details td{
padding:2px 2px;
}
.course-about .post-content .course_type span.course_01{
background: #031731;
padding:0.5% 4%;
display: inline-block;
}
.course-about .post-content .course_type span.type_01{
background: #EC6941;
padding:0.5% 4%;
display: inline-block;
}
.course-about .post-content .course_type span.type_02{
background: #1EAA39;
padding: 0.5% 4%;
display: inline-block;
}
.course-about .post-content .beginner_course h4{
padding:0;
border-left:none;
font-weight:500;
}
.course-about .c_text p.details_text{
height:auto;
margin-bottom: 2%;
}
.about_beginner p.beginner_last_text{
font-size:120%;
text-align:center;
margin-top: 5%;
}
.course-about .post-content .about_beginner p.c_btn02{
margin:5% 0 0;
}
.course-about .post-content .about_beginner .c_btn02 a{
background: #ccc;
text-shadow: none;
width:100%;
color:#fff;
}
.course-about .post-content .about_beginner .c_btn02 a:hover{
background: #1EAA39;
}
.about_beginner p.down{
text-align: center;
font-size: 200%;
margin: 0;
line-height: 0;
color:#EC6941;
} .page-lp_01 .main-inner{
max-width: 1000px;
margin: 0 auto;
background: none;
border: none;
padding: 0;
}
.page-lp_01 .top_box{
background:url(https://www.codexa.net/wp-content/uploads/2018/08/jon-tang-704100-unsplash.jpg)no-repeat center;
background-size:cover;
}
.page-lp_01 h1.post-title{
text-shadow: 0 0 8px black;
}
.page-lp_01 .post-content h2{
margin: 3% 0;
padding: 2% 1%;
background:#009fa8;
color: #fff;
font-weight: bold;
border:none;
text-align:center;
border-radius: 7px;
}
.page-lp_01 .c_box_inner{
margin:0;
padding:3% 0% 1%;
}
.page-lp_01 section .c_text{
padding: 5%;
border: 1px solid #3B4552;
margin: 2% 0;
position: relative;
background: #fff;
}
.page-lp_01 #front-contents .c_text p {
margin-bottom
: 2%;
}
.page-lp_01 section p.step {
font-size: 150%;
margin: 0;
}
.page-lp_01 .course_type {
position: absolute;
top: 15px;
left: 0;
width: 100%;
color: #fff;
font-size: 80%;
}
.page-lp_01 .course_type span.course_01 {
background: #031731;
padding: 1% 2%;
}
.page-lp_01 .course_type span.type_01 {
background: #EC6941;
padding: 1% 2%;
}
.page-lp_01 section h4 {
font-size: 24px;
margin-bottom: 28px;
margin-top: 0;
font-weight: normal;
border-bottom: 1px solid #EC6941;
border-left:none;
padding-bottom: 1%;
padding-top: 12%;
}
.page-lp_01 .post-content p{
margin-bottom:0;
}
.page-lp_01 .c_text:hover > .c_btn a {
background: #1EAA39;
color:#fff;
}
table.course_details{
display: inline-table;
} .page-lp_01 .post-content h3.balloon{
position: relative;
background-color: #fd5f0a;
border-bottom: none;
display: inline-block;
padding: 1.5% 3% 1%;
font-weight: bold;
margin-top: 0;
color: #fff;
border-radius: 5px;
font-size: 2.5rem;
}
.balloon:after{
content: "";
position: absolute;
right: 0;
bottom: -10px;
left: 0;
width: 0px;
height: 0px;
margin: auto;
border-style: solid;
border-color: #fd5f0a transparent transparent transparent;
border-width: 10px 10px 0 10px;
}
.down_recommend i{
font-size:50px;
color:#fd5f0a;
margin:0;
line-height:1;
}
.down_recommend > p{
font-size: 2.5rem;
font-weight: bold;
padding-top: 2%;
}
.sec01 .graph-box,.sec02 .graph-box{ padding:2%;
}
.sec01 .graph-box p,.sec02 .graph-box p,.sec03 .graph-box p{
display: inline-block;
padding: 1% 3%;
border-bottom: 1px solid;
margin-bottom: 10px;
font-weight: bold;
}
.sec03 .graph-box img{
display:block;
margin:0 auto;
}
.sec04 .graph-box p{
margin-top:5%;
}
.page-lp_01 .sec01,.page-lp_01 .sec02,.page-lp_01 .sec03,.page-lp_01 .sec04,.page-lp_01 .sec05{
margin-bottom:5%;
}
.page-lp_01 .sec05 p{
padding:2%;
background:whitesmoke;
font-size:1.4rem;
} .share {
margin-top : 40px;}
.share ul {
margin : 0;
padding : 0;
list-style : none;}
.share li a {
display : block;
padding : 10px;
color : #fff;
font-size : 14px;
text-decoration : none;
text-align : center;}
.share li a:hover {
opacity :0.8;
color : #fff;}
.share li a:visited {
color: #fff;}
.share ul:after {
content : "";
display : block;
clear : both;}
.tweet a {
background-color : #55acee;}
.facebook a {
background-color : #315096;}
.googleplus a {
background-color : #dd4b39;}
.hatena a {
background-color : #008fde;}
.line a {
background-color: #00c300;}
.pocket a {
background-color :#f03e51;}
.rss a {
background-color: #ff8c00;}
.feedly a {
background-color: #6cc655;}
.share li {
float : left;
width : 25%;
margin : 0;
margin-top:15px;} @media screen and (max-width: 1100px){
.c_text p.details_text {
height: 250px;}
.page-lp_01 .c_text p.details_text {
height: 200px;}
body.home #front-contents #front-service h3{
font-size:180%;
}
.course-about table.course_details{
margin:3% 0 0%;
}
.course-about .c_text p.details_text{
height:auto;
margin-bottom: 2%;
}
}
@media screen and (max-width: 991px){
body.home #front-contents .c_box_inner .voice_in{
text-align:left;
}
body.home #front-contents .c_box_inner .voice_in span{
text-align:left;
}
.course-about table.course_details td{
padding:2px 2px;
}
.course-about .post-content .about_beginner p.c_btn02{
width:30%;
margin-top:2%;
float:right;
}
}
@media (max-width: 910px){
}
@media screen and (max-width: 767px){
body.home .wrap, .wrap{margin:0;}
body.home .front-main-cont .front-cont-header .catch{
border-left: none;
border-right: none;
}
body footer .wrap{margin:0 12px;}
.c_text p.details_text ,.page-lp_01 .c_text p.details_text{
height: auto;}
table.course_details{margin-top:5%;}
body.home #front-contents .c_box_inner{
padding-bottom:5%;
}
body.home #front-contents section h3{
padding-left:3%;
}
body.home #front-contents .c_box_inner .voice_in span{
text-align:center;
}
.course-about .main-inner{
padding:0 2%;
}
table.course_details td.mark-ico{
width:150px;
}
table.course_details td.mark-txt{
width:700px;
}
.course-about .post-content h4{
margin: 3% 0 2%;
}
.course-about .post-content .course_type{
margin-bottom:2%;
}
body.home #front-contents h3{
font-size:30px;
}
body.home #front-contents section .Q_A h3{
font-size:26px;
}
#footer .wrap{margin:0 12px;}
body.home .front-main-cont .front-cont-header .cont-title{
font-size: 20px;
display: inline;
}
body.home .front-main-cont .front-cont-header .cont-ruby{
display:inline-block;
font-size: 12px;
margin-bottom: 10px;
}
.page-lp_01 .main-inner{
padding:2%;
}
}
@media (max-width: 700px){
.course-about .post-content .about_lead{text-align:left;}
.about_beginner p.beginner_last_text{text-align:left;}
}
@media (max-width: 600px){
body.home #main_visual .center span{
display:block;
}
body.home #main_visual label{
width:80%;
}
.course-about .post-content .about_beginner p.c_btn02{
width:100%;
float:none;
margin-top:5%;
}
.down_recommend > p{
font-size:2rem;
}
.share li {
float: left;
width: 49%;
margin: 0 1% 2% 0;}
.share li a {
border-radius:6px;}
}
@media (max-width: 500px){
body.home .front-main-cont .front-cont-header .cont-title{
display:block;
}
body.home .front-main-cont .front-cont-header .cont-ruby{
display:inline-block;
font-size: 12px;
margin-bottom: 5px;
}
body.home #main_visual{
height:450px!important;
}
body.home #main_visual .wrap{
padding-top: 80px !important;
}
}
@media (max-width: 400px){
}