@charset "utf-8";
/*
Theme Name: オンラインクラス
Version: 1.0
*/

/* Reset.css */
* {
	font-style:normal;
	margin:0pt;
	padding:0pt;
	border:0;
	text-decoration: none;
}
body {
	font-family: "ヒラギノ角ゴシック Pro","Hiragino Kaku Gothic Pro","メイリオ",Meiryo,Osaka,"ＭＳ Ｐゴシック","MS PGothic",sans-serif;
-webkit-text-size-adjust: 100%;
word-wrap: break-word;
color:#000;
}
@font-face {
  font-family: "gagagaga";
  src: url("font/GAGAGAGA-FREE.woff") format("woff");
}
*, *:before, *:after {
    -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
         -o-box-sizing: border-box;
        -ms-box-sizing: border-box;
            box-sizing: border-box;
}
html {
	font-size: 62.5%;
}

h1, h2, h3, h4, h5, h6 {
	font-weight: normal;
}
ol, ul, ul li {
	list-style-type:none;
}
img {
border:0 none;
vertical-align:bottom;
}
table {
    border-collapse: collapse;
    border-spacing: 0;
}

body {
font-size: 14px;
line-height: 2;
}
@media (min-width: 768px) {
  body {
	font-size:16px;
	line-height: 2;
  }
}
@media (min-width: 992px) {
  body {
	font-size:16px;
	line-height: 2;
  }
}
.contents p, .contents dl, .contents ul, .contents ol {
    margin-bottom:2em;
}
a:link{
	color:#0e4d8f;
}
a:visited{
	color:#0e4d8f;
}
a:hover{
	color:#FF4B33;
}
a:active{
	color:#FF4B33;
}
.cf:before, .cf:after {
    content: " ";
    display: table;
}
.cf:after {
    clear: both;
}
img{
max-width:100%;
height:auto;
}
a:hover img{
opacity:0.7;
transition: all 0.5s ease 0s;
}
.only_sp{
display:none;
}
.only_pc{
display:block;
}
.f22 {
font-size:1.6em;
line-height: 1.6em;
}
.fbold{
font-weight:bold;
}
.tunderline{
text-decoration:underline;
}
.blue{
color:#1F456C;
}
.orange{
color:#D83F00;
}
.tcenter{
text-align:center;
}
.tright{
text-align:right;
}
.red{
color:#D80000;
}
.bgyellow{
    background: linear-gradient(transparent 60%, #FFD400 60%);
}

.serif{
	font-family: "游明朝","Yu Mincho","游明朝体","YuMincho","ヒラギノ明朝 ProN W6","HiraMinProN-W6","HG明朝E","ＭＳ Ｐ明朝","MS PMincho","MS 明朝",serif;
}
.wrap{
width:94%;
max-width:1100px;
margin:0 auto;
clear:both;
}
.flex {
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
-webkit-flex-wrap: wrap;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
}
.justify{
  -webkit-box-pack: justify;
  -moz-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-justify-content: space-between;
  justify-content: space-between;
    padding: 0;
}
.gmap,
.youtube{
position: relative;
padding-bottom: 56.25%;
padding-top: 30px;
height: 0;
overflow: hidden;
}
.gmap iframe,
.gmap object,
.gmap embed,
.youtube iframe,
.youtube object,
.youtube embed{
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 94%;
}

/* editor */
 
p {
    display: block;
}
strong { font-weight: bold; }
em { font-style: italic; }
blockquote {
    display: block;
    -webkit-margin-before: 1em;
    -webkit-margin-after: 1em;
    -webkit-margin-start: 40px;
    -webkit-margin-end: 40px;
}
 
/* img */
.aligncenter {
    display: block;
    margin: 0 auto;
}
.alignright { float: right; }
.alignleft { float: left; }
 
img[class*="wp-image-"],
img[class*="attachment-"] {
    height: auto;
    max-width: 100%;
}
 

/*common*/
.gagagaga{
	font-family: "gagagaga",serif;
}
.tophead{
	background:url(img/common/head_bg.png) no-repeat center center;
	background-size:cover;
}
.tophead_inner{
	padding:5em 1em 6em;
}
.tophead_inner01{
	width:70%;
	margin:0 0 2em;
}
.tophead_logo{
	padding:1em 0;
}
.tophead_txt01{
	background: linear-gradient(transparent 60%, #a7daf1 60%);
	position:relative;
}
.tophead_txt01:before{
	content:"";
	background: linear-gradient(transparent 60%, #a7daf1 60%);
	position: absolute;
    left: -100%;
    bottom: 0;
    width: 100%;
    display: block;
    height: 42px;
}
.pageFooter{
	background:#0071b6;
	color:#fff;
	padding:1em 0;
	text-align:center;
}
.fnav a{
	color:#fff;
	font-weight:bold;
	display:inline-block;
	padding:0.5em 1em;
	font-size:2.4rem;
}
.fnav a:not(:last-of-type){
	border-right:1px solid #fff;
}
.fnav a:hover{
	opacity:0.7;
}
.com_box01{
	padding:6em 0;
}
.com_ttl01{
	text-align:center;
	font-size:2rem;
	margin:0 0 1em;
}
.com_tb01{
	width:100%;
	border-top:1px solid #ddd;
	border-right:1px solid #ddd;
}
.com_tb01 th{
	background:#eee;
	text-align:left;
	padding:0.5em 1em;
	border-bottom:1px solid #ddd;
	border-left:1px solid #ddd;
}
.com_tb01 td{
	padding:0.5em 1em;
	border-bottom:1px solid #ddd;
	border-left:1px solid #ddd;
}
.logo{
	width:40%;
}

/*top*/
.top_about{
	background:#0071b6;
}
.top_about_ttl{
	text-align:center;
	margin:0 0 2em;
}
.top_about_unit{
	width:30%;
	max-width:314px;
	padding:2em 1em;
	text-align:center;
	background:#fff;
	border-radius:6px;
	box-shadow: 4px 4px 4px 4px rgba(0,0,0,0.4);
	margin:0 0 1em;
}
.top_about_unit p{
	margin:0;
}
.top_process{
	background:url(img/common/bg01.png) no-repeat center center;
	background-size:cover;
}
.top_process_ttl{
	text-align:center;
	color:#0071b6;
	font-size:6rem;
	font-weight:bold;
	margin:0 0 1em;
}
.top_process_ttl:after{
	background-color: #0071b6;
    content: "";
    display: block;
    height: 7px;
    margin: 0 auto 1.4em;
    width: 40%;
}
.top_process_unit{
	max-width:940px;
	margin:0 auto 2em;
	align-items:center;
}
.top_process_unit:nth-of-type(even){
	flex-direction: row-reverse;
}
.top_process_ttl01{
	background:#dbefff;
	color:#0071b6;
	font-size:4.2rem;
	line-height: 1;
	font-weight:bold;
	padding:0.2em 0.5em 0.2em 2.2em;
	width:65%;
	box-shadow: 0 4px 4px 0 rgba(0,0,0,0.4);
	position:relative;
}
.top_process_img01{
	width:35%;
}
.top_process_ttl01 span{
	font-size:7rem;
	position:absolute;
	left:0.2em;
	bottom:0.1em;
}
.top_function{
	background:#0071b6;
}
.top_function_ttl{
	text-align:center;
	margin:0 0 2em;
}
.top_function_inner{
	max-width:1020px;
	margin:0 auto;
}
.top_function_unit{
	background:#fff;
	padding:0.5em 0.5em;
	box-shadow: 4px 4px 4px 4px rgba(0,0,0,0.4);
	align-items:center;
}
.top_function_unit dt{
	font-size:4rem;
	color:#0071b6;
	font-weight:bold;
	width:40%;
	padding-left:100px;
}
.top_function_unit:last-of-type dt{
	font-size:3.2rem;
	line-height:1em;
}
.top_function_unit dd{
	width:58%;
	font-size:2.8rem;
	line-height:1.2em;
}
.top_function_unit:nth-of-type(1) dt{
	background:url(img/common/icn11.png) no-repeat left center;
	background-size:contain;
}
.top_function_unit:nth-of-type(2) dt{
	background:url(img/common/icn12.png) no-repeat left center;
	background-size:contain;
}
.top_function_unit:nth-of-type(3) dt{
	background:url(img/common/icn13.png) no-repeat left center;
	background-size:contain;
}
.top_function_unit:nth-of-type(4) dt{
	background:url(img/common/icn14.png) no-repeat left center;
	background-size:contain;
}
.top_function_unit:nth-of-type(5) dt{
	background:url(img/common/icn15.png) no-repeat left center;
	background-size:contain;
}
.top_function_unit:nth-of-type(6) dt{
	background:url(img/common/icn16.png) no-repeat left center;
	background-size:contain;
}
.top_function_unit:nth-of-type(7) dt{
	background:url(img/common/icn17.png) no-repeat left center;
	background-size:contain;
}
.top_function_unit:nth-of-type(8) dt{
	background:url(img/common/icn18.png) no-repeat left center;
	background-size:contain;
}
.top_function_unit:nth-of-type(9) dt{
	background:url(img/common/icn19.png) no-repeat left center;
	background-size:contain;
}
.top_function_unit:nth-of-type(10) dt{
	background:url(img/common/icn20.png) no-repeat left center;
	background-size:contain;
}
.top_management{
	background:url(img/common/bg01.png) no-repeat center center;
	background-size:cover;
	text-align:center;
}
.top_management_ttl{
	margin:0 0 2em;
}
.top_voice_inner{
	max-width:1360px;
	width:100%;
	margin:0 auto;
	padding:2em;
	background:#ceecff;
}
.top_voice_ttl01{
	text-align:center;
}
.top_voice_ttl02{
	text-align:center;
	font-size:6rem;
	font-weight:bold;
	color:#0071b6;
	margin:0 0 1em;
}
.top_voice_unit{
	background:#e0e0e0;
	box-shadow: 4px 4px 4px 4px rgba(0,0,0,0.4);
	margin:0 0 3em;
}
.top_voice_unit p{
	margin:0;
}
.top_voice_img01{
	width:28%;
}
.top_voice_txt01{
	width:72%;
	padding:1em 2em;
}
.top_voice_txt02{
	font-weight:bold;
	font-size:3rem;
}
.top_btn{
	background:linear-gradient(180deg,#fff 0%,#fff 10%,#0071b6 10%,#0071b6 100%);
	padding:0 0 0;
}
.top_btn_inner{
	max-width:1300px;
	width:100%;
	margin:0 auto;
	background:url(img/common/bg02.png) no-repeat left bottom;
	background-size:contain;
	text-align:center;
}
.top_btn_inner .wrap{
	padding:3em 0 1em;
	color:#fff;
}
.top_btn_ttl01{
	font-size:4rem;
	font-weight:bold;
	margin:0 0 0.1em;
	text-shadow: 5px 5px 2px rgba(0,0,0,0.4);
}
.top_btn_txt01{
	text-align:left;
	font-size:3.2rem;
	font-weight:bold;
	color:#0071b6;
	margin:0 auto;
	line-height:1.6;
	display: inline-block;
}
.top_btn_txt01 span{
	background:#fff;
	padding:4px;
	box-shadow: 2px 2px 2px 2px rgba(0,0,0,0.4);
}
a.top_btn_btn{
	display:block;
	background:url(img/common/btn01.png) no-repeat center center;
	background-size:contain;
	max-width:975px;
	width:100%;
	height:120px;
	margin:1em auto;
}
a.top_btn_btn:hover{
	background:url(img/common/btn01_on.png) no-repeat center center;
}
.top_line_inner{
	justify-content:center;
	align-items:center;
	margin:0 0 2em;
}
.top_line_img{
	padding:0 2em;
}
p.top_line_txt{
	margin:0;
	font-size:2.8rem;
	font-weight:bold;
}
a.top_line_btn{
	display:block;
	background:url(img/common/btn02.png) no-repeat center center;
	background-size:contain;
	max-width:975px;
	width:100%;
	height:120px;
	margin:1em auto;
}
a.top_line_btn:hover{
	background:url(img/common/btn02_on.png) no-repeat center center;
}
.top_price_ttl01{
	text-align:center;
	font-size:4rem;
	line-height:1.2;
	font-weight:bold;
	padding:0.4em;
	margin:0 0 0.6em;
	color:#fff;
	background:#2e318c;
}
.top_price_ttlfree{
	text-align:center;
	font-size:4rem;
	line-height:1.2;
	font-weight:bold;
	padding:0.4em;
	margin:0 0 0.6em;
	color:#0071b6;
	background:#e0e0e0;
}
.top_price_ttlbeginner{
	text-align:center;
	font-size:4rem;
	line-height:1.2;
	font-weight:bold;
	padding:0.4em;
	margin:0 0 0.6em;
	color:#fff;
	background:#67abd5;
}
.top_price_ttlpro{
	text-align:center;
	font-size:4rem;
	line-height:1.2;
	font-weight:bold;
	padding:0.4em;
	margin:0 0 0.6em;
	color:#fff;
	background:#0071b6;
}
.top_price_ttlbusiness{
	text-align:center;
	font-size:4rem;
	line-height:1.2;
	font-weight:bold;
	padding:0.4em;
	margin:0 0 0.6em;
	color:#fff;
	background:#2e318c;
}
.top_price_price{
	text-align:center;
	font-weight:bold;
	color:#0071b6;
	font-size:6rem;
	line-height: 1.2;
    margin: 0 0 -0.5em;
}
.top_price_price .gagagaga{
	font-size:10rem;
	padding:0 4px;
	display:inline-block;
}
.top_price_unit{
	width:100%;
	padding:3em;
	background:#cfdfee;
	border-radius:10px;
	margin:0 0 4em;
}
.top_price_unit ul{
	margin:0;
}
.top_price_unit01{
	width:100%;
	padding:3em;
	background:#bfceec;
	border-radius:10px;
	margin:0 0 4em;
}
.top_price_unit01 ul{
	margin:0;
}
.top_price_unit_ttl{
	text-align:center;
	font-size:4rem;
	line-height:1.2;
	font-weight:bold;
	padding:0.4em;
	margin:0 0 0.6em;
	color:#0071b6;
	background:#fff;
}
.top_price_unit_list li{
	font-size:3rem;
	font-weight:bold;
	padding-left:1em;
	text-indent:-1em;
}
.del{
text-decoration: line-through;
}
.top_price{
	padding-bottom:0;
}

/*use*/
.use_ttl01{
	text-align:center;
	font-size:2rem;
}
.use_sttl01{
	font-size:1.2rem;
	text-align:center;
	margin:0 0 2em;
}
.use_ttl02{
	font-size:2.4rem;
}
.use_ttl03{
	font-size:1.8rem;
}
.use_unit01{
	margin:0 0 2em;
}
.use_unit01 p{
	margin:0;
}
.use_unit01 ul{
	margin:0 0 0 1em;
}