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


table {
  border-collapse: collapse;
}

img{vertical-align:top;max-width: 100%;height: auto;width:auto;}
*:focus { outline:none; }
/* position */
.left{text-align:left !important}.right{text-align:right}.center{text-align:center !important}
.f_left, .f_left2{float:left;}.f_right, .f_right2{float:right}
.clearfix:after{content: "";display:block;clear:both;}

/* img */
.v_bottom img{vertical-align:bottom}.v_top img{vertical-align:top}.img100 img{width:100%}

/* font */.gold{color:#c47915}
.white, .white span, .white p{color:#fff}.red{color:#ff0000;}.yellowBg{background: linear-gradient(transparent 60%, #FF0 0%);}.orange{color:#e96300}
.bold{font-weight:bold}.underline{text-decoration:underline}
.mincho, .mincho span, .mincho p{font-family: "ヒラギノ明朝 ProN W6", "HiraMinProN-W6", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;}
.shadow{text-shadow:2px 2px 0 #FFF, -1px -1px 0 #FFF,-2px 1px 0 #ccc, 1px -1px 0 #FFF, 0px 1px 0 #FFF,  0-1px 0 #FFF,-1px 0 0 #FFF, 1px 0 0 #FFF;}

/* font size */
.f0_8{font-size:0.8em}.f0_9{font-size:0.9em}.f1_4{font-size:1.4em}.f1_2{font-size:1.2em}.f1_1{font-size:1.1em}
@media screen and (min-width:961px) {.f1_4{font-size:1.5em}}
.nowrap{white-space: nowrap;}

/* padding */.p2{padding:2%}
.ptb4{padding:4% 0}.pb4{padding-bottom:4%}.pt4{padding-top:4%}.pb6{padding-bottom:6%}.p4{padding:4%}.pb2{padding-bottom:2%}
.pl10{padding-left: 10%;}

/* title */
h2{font-size:1.9em !important;padding-bottom:5% !important;text-align:center !important;font-weight:bold !important;padding-bottom:5% !important;color:#14425c !important}
@media screen and (min-width:961px) {h2{font-size:2.2em !important;}}

/* link opacity */
a:hover img {opacity: 0.7;filter: alpha(opacity=70);-ms-filter: "alpha(opacity=70)";}

/* width */
.w60{width:60%}.w39{width:39%}.w70{width:70%}.w29{width:29%}

/* bg */
.whiteBg{background:#fff}.orangeBg{background:#e47b00}

/* common */
.wrapper{max-width:960px;margin:0 auto}.block{padding:5%}.block2{padding:2% 5%}

/* style */
/* header */#header .f_left2,{float:left}#header .f_right2{float:right}
@media screen and (max-width:960px) and  (min-width:481px){#header .f_left2{padding-left:2%}}
@media screen and (min-width:481px){#header .f_left2{width:40%}#header .f_right2{width:23%}}
@media screen and (max-width:480px){#header .f_left2{width:50%}#header .f_right2{width:40%}}
/* catchBg */
#catchBgB{background: url(../images/b1/catchBgB.jpg) center top no-repeat;}
/* form */
@media screen and (min-width:481px){#formBg1{background:url(../images/formBg1.jpg) no-repeat center top;background-size:cover}
#formBg1B{background:url(../images/formBg1B.jpg) no-repeat center top;background-size:cover}
#formBg2{background:url(../images/formBg2.jpg) no-repeat center top;background-size:cover}
#formBg3{background:url(../images/formBg3.jpg) no-repeat center top;background-size:cover}}
@media screen and (max-width:480px){#formBg1{background:url(../images/formBg1sp.jpg) no-repeat center top;background-size:cover}
#formBg1B{background:url(../images/formBg1Bsp.jpg) no-repeat center top;background-size:cover}
#formBg2{background:url(../images/formBg2sp.jpg) no-repeat center top;background-size:cover}
#formBg3{background:url(../images/formBg3sp.jpg) no-repeat center top;background-size:cover}}
input[type="text"],input[type="email"] {width: 83%;padding: 2%;background:#fff;border:2px solid #e47b00;border-radius:10px;margin:1px 0 2%;text-align:center;margin: 0 auto;display: block;margin-bottom:1%}
input[type="submit"] {background:url(../images/formButton.png) no-repeat center top;border:none;color:transparent;width: 100%;padding-top: 11%;background-size: contain;margin-bottom:1%}
input[type="submit"] :hover{opacity:.8}
input[type="text"]:focus,input[type="email"]:focus {box-shadow:0px 0px 3px 2px #ffb45b;}
@media screen and (max-width:700px){input[type="submit"] {padding-top:9%}}
@media screen and (max-width:480px){input[type="submit"] {padding-top:8%;margin: 0px 8%;width: 84%;}.form_txt{font-size:.8em}}
.form_txt{width: 80%; margin: 0 auto;padding-bottom: 2%; font-weight: bold;}.calc li img{text-align:center;padding-bottom:8%}
input[type="submit"]:hover{opacity:.7}
#formBg1B{background: #FFF}
.formBg{background: url(../images/b1/formBgB.jpg) center top repeat-y;background-size: contain;padding-left:1%;padding-bottom: 1%}

@media screen and (min-width:481px){.formBg .left{width: 47%;float: left;}.formBg .right input[type="submit"]{width: 90%;margin: 0 auto;}
.formBg .right{width: 50%;float: right;padding-right: .5%;text-align: center}.formBg .right input[type="text"]{margin-top: 3%}.dis{text-align: left; margin-left: 2.0em}}
@media screen and (min-width:481px) and (max-width:960px){.formBg .right{padding-right: 1%;}}
@media screen and (max-width:960px){#catchBgB{background: none}}
@media screen and (max-width:480px){
.formBg .right,.formBg .left{float: none;width: 100%;}
.formBg{background: url(../images/b1/foromBgspB.jpg) center top repeat-y;background-size: contain;padding-left:1%;}
.dis{text-align: left; margin-left: 2.0em}
    }

/* voice */#voice{background:#fffaeb}.voiceBg{background:url(../images/voiceBg.jpg) no-repeat center top;}
.title{padding:5% 5% 0}.calc{color:#434343;font-size:1em;font-weight:bold}
@media screen and (max-width:960px){ul.calc{font-size:.8em}.voiceBg{background-size:contain}.wrapper.voiceBg{padding:0 2%;}}
@media screen and (min-width:601px){
.calc{width: 90%;margin: 0 auto;margin-right: 4%}
.calc li{float:left;list-style:none;width: calc(90%/ 3);margin-bottom:2%;box-sizing:content-box}
.calc li:not(:nth-child(3n+1)){margin-left:2%}.calc li:nth-child(3n+1){clear:both;}
.calc li{float:left;list-style:none;width: calc(90%/ 3);margin-bottom:2%;box-sizing:content-box;text-align: center;}
.calc li img{width: 50%;}
.calc li:nth-child(3n+1){clear:both;}
}
@media screen and (max-width:600px){.wrapper.voiceBg{padding:0 4%;}
.calc li{float:left;list-style:none;width: calc(94%/ 3);margin-bottom:2%;box-sizing:content-box}
.calc li:not(:nth-child(3n+1)){margin-left:2%}.calc li:nth-child(3n+1){clear:both;}}
/* block1 */@media screen and (min-width:481px){#b1Bg{background:url(../images/b1Bg.jpg) center top;background-size:cover}}
@media screen and (max-width:480px){#b1Bg{background:url(../images/b1Bgsp.jpg) center top;background-size:cover}}
/* block2 */#b2Bg{background:#f1f7f7}
/* block3 */#b3Bg{background:url(../images/imgBg.jpg)}

/* profile */
@media screen and (min-width:1000px){#profile{background-size:contain;}}
@media screen and (min-width:601px){#profile{background:url(../images/profBg.jpg) center bottom no-repeat #f5f5f5;background-size:cover;}.profile_inner{width:60%;}}.prof_title{background:#f5f5f5}.prof_title .wrapper{padding:5% 5% 0}
@media screen and (max-width:600px){#profile{background:#f5f5f5;}}

/* block4 */@media screen and (min-width:481px){#b4Bg{background:url(../images/b4Bg.jpg) no-repeat center top;background-size:cover}}
@media screen and (max-width:480px){#b4Bg{background:url(../images/b4Bgsp.jpg) no-repeat center top;background-size:cover}}
/* bullet */h3{font-size:1.5em !important;text-align:center !important;border:1px solid #fff;border-right:0;border-left:0;padding:1% 0 !important}
.bullettitle{background:#00561f;padding:4px 0;}#bulletBg{background:#f9f8f1}
ul.bullet{list-style: none;font-weight:bold;font-size:1.1rem}
ul.bullet li:before {content: "\f058";position: relative;font-family:  "Font Awesome 5 Free";margin-right: .5em;font-weight:bold;color:#00561f;}
ul.bullet li{border-bottom:1px dashed #c47915;padding:1% 0}
/* pre */#preBg{background:#fffff0}@media screen and (max-width:960px) and (min-width:600px){#preBg .wrapper{padding:0 2%}}
@media screen and (min-width:601px){.pc2{display:block}.sp2{display:none}}
@media screen and (max-width:600px){.pc2{display:none}.sp2{display:block}}
.pre_inner{background:url(../images/pre_inner.jpg) repeat-y center top;background-size:contain;padding:1% 5%}
/* block5 */@media screen and (min-width:481px){#b5Bg{background:url(../images/b5Bg.jpg) no-repeat center top;background-size:cover}}
@media screen and (max-width:480px){#b5Bg{background:url(../images/b5Bgsp.jpg) no-repeat center top;background-size:cover}}
/* privacy */.box{border:2px solid #b5b5b5;overflow:scroll;height:80px;background:#fff;width: 80%;margin:0 auto}.box pre{padding:2%;width:76%}
@media screen and (max-width:480px){.box{height:350px}}

/* フッタ */.credit dd span, .risk dd{color:#fff}
#footer {margin: 0;padding-top: 3rem;background-color: #14425c;color: #fff;}
#footer a {color: #CC9;}
.footer-menu {margin-bottom: 2rem;text-align: center;}
.footer-menu .logo {margin-bottom: 1.25rem;}
.footer-menu ul {margin: 0;padding: 0;list-style: none;}
.footer-menu li:not(:last-child) {margin-bottom: .75rem;}
.attention {margin-bottom: 2.75rem;padding: 1.25rem; border: 1px solid #fff;text-align: justify;color:#fff;background:#08334b}
.credit {margin-bottom: 1.75rem;}
.credit dt {margin-bottom: .75rem;}
.credit h2 {padding: 0;margin-bottom: 1.25rem;background-color: inherit;font-weight: normal;text-align: left;color:#fff !important}
.credit dd:not(:last-child) {margin-bottom: .5rem;}
.credit dd:nth-of-type(2) br {display: none;}
/*.credit dd:nth-of-type(4) { margin-bottom: 1.25rem;}*/
.credit dd span:nth-of-type(2)::before {content: "：";}
.risk h3 {padding: 0;background-color: inherit;color: #fff;font-weight:bold}
.risk dt {color: #fff;font-weight:bold;padding-top:1%}
.copyright {display: block;width: 100%;text-align: center;color:#fff}
@media screen and (min-width: 480px) {
.footer-menu {display: flex;align-items: center;text-align: left;}
.footer-menu {margin-bottom: 1rem;}
.footer-menu .logo {max-width: 40%;margin-bottom: 2rem;margin-right: auto;}
.footer-menu ul {display: flex;align-items: center;flex-wrap: wrap;}
.footer-menu li {margin-left: 2rem;margin-bottom: .75rem;padding-left: 1rem;border-left: 1px solid #cc9;}
/*.footer-menu .logo {width: auto;max-width: auto;max-height: 2.25rem;margin-bottom: .5rem;margin-right: auto;}
.footer-menu li {padding-left: 1rem;border-left: 1px solid #cc9;}*/
}
@media screen and (max-width: 768px) {#footer {padding: 3.5rem 2%;}}
@media screen and (min-width: 768px) {

.footer-in {max-width: 704px;margin: auto;padding:0 3%}
.footer-menu {margin-bottom: .5rem;}
.footer-menu .logo {max-width: 35%;}
.credit dd {display: flex;}
.credit dd span:nth-of-type(1){width: 10rem;}
.credit dd span:nth-of-type(2)::before {margin-left: -1rem;}
.credit dd:nth-of-type(2) br {display: inline;}
.attention {padding: 1.5rem;margin-bottom: 2.75rem;}
}
@media screen and (min-width: 956px) {
.footer-in {max-width: 840px;font-size: 1rem;}
.footer-menu .logo {margin-bottom: 2.5rem;}
.credit dd:nth-of-type(2) br {display: none;}
}

/* pc */
@media screen and (min-width:481px) {.pc{display:block}.sp{display:none}}
@media screen and (max-width:700px) {h2, h3{font-size:1.5em !important}}
/* sp*/
@media screen and (max-width:480px) {
/* none */.sp{display:block}.pc{display:none}.f_left, f_right{float:none;}
/* float */.w60, .w39, .w70, .w29{width:100%}.f_right img, .f_left.w39 img , .f_left.w40{padding-bottom:5%}
/* padding */.block{padding:7% 4%;}.title{padding:7% 4% 0}.block2{padding:5% 4%;}
/* position */.centersp{text-align:center}
/* font */h2{font-size:1.2em !important}.f1_2{font-size:1.1em}.f1_4{font-size:1.1em}h3{font-size:1.1em !important;}
}

.annotation {
	display: block;
	opacity: .75;
	margin-top: .75em;
	margin-bottom: 1.25em;
	font-size: .85em;
	font-weight: normal;
}


/* 無料WEB講座と有料会員の内容 */

.free_and_charged {
	margin: clamp(24px, 20vw, 64px) 1.5em;
	font-size: 1.1rem;
}
.free_and_charged table {
	width: 100%;
	border: solid 4px #000;
}
.free_and_charged table caption {
	caption-side: top;
	margin-bottom: .75em;
	color: #EA7116;
	font-size: 1.5em;
	font-weight: bold;
	text-align: center;
	line-height: 1.25;
}
.free_and_charged tr th,
.free_and_charged tr td {
	padding: clamp(12px, 3vw, 32px);
	border: solid 1px #000;
	vertical-align: top;
}
.free_and_charged tr th {
	width: 50%;
	background-color: #EA7116;
	color: #fff;
	font-size: 1.25em;
	font-weight: bold;
	text-align: center;
}
.free_and_charged tr td {
	background-color: #fff;
}
.free_and_charged ul {
	margin: 0;
	padding: 0;
}
.free_and_charged li {
	margin-left: 1.25em;
	list-style: disc;
}
.free_and_charged li:not(:last-child) {
	margin-bottom: 1.25em;
}
.free_and_charged p {
	margin-top: .75em;
	padding-left: 1em;
	font-size: .9rem;
}
.free_and_charged p::before {
	content: "※";
	display: inline-block;
	width: 1em;
	margin-left: -1em;
}

@media screen and (min-width: 1000px) {
.free_and_charged {
	margin-left: 0;
	margin-right: 0;
	font-size: 1.25rem;
}
}
