@charset "utf-8";
/* CSS Document */
/* =============================================================================
PC コンテンツ
   ========================================================================== */
body {
	width: 100%;
	margin: 0;
	padding: 0;
	color: #3f3a39;
	font-family: source-han-sans-japanese, sans-serif;
	font-style: normal;
	font-weight: 300;
	line-height: 1.8;
	font-size: 1rem;
}
.image_right {
	float: right;
	margin: 0 0 21px 25px;
}
.image_left {
	float: left;
	margin: 0 25px 30px 0;
}
.clearfix:after {
	content: "";
	display: block;
	clear: both;
}
.sp {
	display: none;
}
.text_box, .title_box {
	background: #193549;
	padding: 50px 0;
}
.title_box h2 {
	padding: 20px 0;
}
.text_box p {
	margin: 0 auto;
	font-size: 1.6rem;
	line-height: 1.4;
	text-align: center;
	color: #fff;
}
.text_box .mini {
	font-size: 1.3rem;
}
.title_box {
	background: #e2ebf0;
}
.no_space {
	padding: 0 0;
}
.no_space h2.title {
	margin: 0 auto;
}
header h1 {
	background: url("../img/head.png") center top / cover no-repeat #fff;
	min-width: 100%;
	height: 592px;
	max-width: 1366px;
	margin: 0 auto;
}
header picture {
	display: block;
	text-align: center;
	margin: 0 auto;
}
a:hover {
	opacity: 0.8;
}
section {
	margin: 0 auto;
	text-align: center;
	width: 100%;
	background: #fff;
	padding: 0 0 80px;
}
.bg_gray {
	background: #E2EBF0;
}
.bg_white {
	background: #fff;
	padding-bottom: 30px;
	margin-bottom: 30px;
}
article {
	width: 860px;
	margin: 0px auto;
	text-align: left;
}
h2.title, h3.title {
	font-size: 2.5rem;
	line-height: 1.2;
	color: #fff;
	font-weight: 700;
	background: #C70200;
	padding: 30px 0;
	margin: 0 auto 50px;
}

h2.simple{
	font-size: 2.5rem;
	line-height: 1.2;
	color: #414e55;
	font-weight: 700;
	padding: 30px 0;
}




h2.title em {
	color: #FFF000;
}
h3 {
	font-size: 1.8rem;
	text-align: center;
	line-height: 1.4;
	margin: 0 auto 30px;
	padding: 30px 0;
}
h3.title {
	padding: 0;
}
h3.qa {
	color: #C70200;
	text-align: left;
	font-size: 2rem
}
h3.qa:before {
	content: "Q";
	font-size: 1.2rem;
	padding: 10px 15px;
	margin-right: 10px;
	display: inline-block;
	border-radius: 50%;
	background: #C70200;
	color: #fff;
}
p {
	margin-bottom: 30px;
	text-align: left;
}
ul li {
	list-style-type: none;
}
ul.check {
	margin: 30px auto;
}
ul.check li {
	font-weight: bold;
}
ul.check li:before {
	font-family: "Font Awesome 5 Free";
	content: '\f00c';
	font-weight: 900;
	color: #C70200;
	margin-right: 5px;
}
.pri, .pri a {
	text-align: center;
	font-size: 14px;
	margin: 0 auto 10px;
}
.pri a:hover {
	color: cornflowerblue;
}
footer {
	text-align: center;
	padding: 20px 0;
	margin: 0 auto;
	font-size: 1rem;
}
img {
	max-width: 100%;
	height: auto;
	width /***/ : auto;
}
.head_pc {}
.head_sp {
	display: none;
}
.blue_area {
	background: #193549;
	color: #fff;
}
.yellow_area {
	background: #faebc6;
}
.gray_area {
	background: #f5f5f5;
}
.main {
	padding: 10px;
	margin: 20px auto;
}
.main_in {
	padding: 10px;
}
.main ul {
	margin-left: -20px;
}
.main_border {
	padding: 20px;
	margin: 20px auto;
	border: 1px solid #555151;
}
.main_border2 {
	padding: 20px;
	margin: 20px auto;
	border: 10px solid #aceda3;
	background: #ffffff;
}
.midashi_font {
	font-size: 32px;
	line-height: 47px;
	text-align: center;
	color: #1A1A1A;
	font-weight: 600;
	padding: 20px 0px;
}
/* =============================================================================
成果
   ========================================================================== */
.seika_box {
	text-align: center;
	margin: 0 auto;
	width: 100%;

}
.seika_box article {
	width: 960px;
	margin: 0 auto;
}
.seika_box ul {
	overflow: hidden;
}
.seika_box li {
	padding: 10px;
	background: #f4f4f4;
	border: 1px solid #868788;
	width: 300px;
	margin: 0 20px 20px 0;
	float: left;
}
.seika_box dl {
	font-size: 22px;
	line-height: 1;
	font-weight: 600;
	color: #ffffff;
	text-align: center;
	padding: 15px 0 3px 0;
	background: #193549;
}
.seika_photo {
	padding: 10px;
	text-align: center;
}
.seika_name {
	font-size: 24px;
	font-weight: 600;
	text-align: center;
	padding: 5px 0px;
}
/* =============================================================================
お客様の声
   ========================================================================== */
.voice, .voice2 {
	overflow: hidden;
	text-align: center;
	margin: 0 auto;
}
.voice article, .voice2 article {
	width: 980px;
	text-align: center;
	margin: 0 auto;
}
.voice h2.title, .voice2 h2.title {
	background: #193549;
}
.voice li, .voice2 li {
	float: left;
	width: 45%;
	display: block;
	margin: 0 20px 20px 0;
}
.voice2 li {
	width: 30%;
}
/* =============================================================================
理由
   ========================================================================== */
.riyu {
	padding: 0;
}
.riyu dl {
	margin: 0 auto 30px;
	border: 5px #C70200 solid;
}
.riyu dt {
	font-size: 2.5rem;
	padding: 20px;
	background: #C70200;
	line-height: 1.2;
	color: #fff;
	text-align: center;
}
.riyu dt strong {
	color: #ECFF1B;
	font-weight: 600;
}
.riyu dt em {
	font-size: 1.2rem;
	display: block;
	margin: 0 auto 10px;
	border: 2px solid;
	width: 150px;
}
.riyu dd {
	padding: 30px;
}
/* =============================================================================
エリア
   ========================================================================== */

.setsumeikai{
	background:#2D8CFF;
}

.setsumeikai article{
	background:#fff;
	padding:20px;
}

.setsumeikai h2{
	background:0;
	background-size:cover;
}

.blue_obi {
	padding: 10px 0px 3px 0px;
	background: #C70200;
	color: #ffffff;
	text-align: center;
}
.midashi_l {
	font-size: 40px;
	line-height: 54px;
	padding: 10px 0px;
}
.midashi_m {
	font-size: 32px;
	line-height: 42px;
}
.midashi_s {
	font-size: 24px;
	line-height: 42px;
}
.riyu_box {
	margin: 10px auto;
	padding: 2em;
	border: 1px solid #ccc;
	/* 枠線 */
	background: #fff;
	/* 背景色 */
	box-shadow: 1px 1px 2px #ccc;
}
.riyu_in {
	padding: 30px 0px;
}
.project_box {
	margin: 0px auto 20px;
	background: #ffffff;
	box-shadow: 0 2px 4px rgba(0, 0, 0, 0.22);
}
.project_box .box-title {
	font-size: 1.2em;
	background: #193549;
	padding: 10px 20px 0px 20px;
	color: #FFF;
	font-weight: bold;
	letter-spacing: 0.05em;
}
.project_box_in {
	padding: 20px;
	margin: 0;
}
.get_box {
	margin: 2em auto;
	background: #ffffff;
	box-shadow: 0 2px 4px rgba(0, 0, 0, 0.22);
}
.get_box .box-title {
	font-size: 1.2em;
	background: #57a7e0;
	color: #FFF;
	font-weight: bold;
	letter-spacing: 0.05em;
}
.get_box_in {
	padding: 20px;
	margin: 0;
}
.sono_no {
	padding: 6px 15px;
	background: #ffffff;
	color: #E53E40;
	width: 70px;
	font-size: 20px;
	margin-bottom: 10px;
}
.dekiru_title {
	position: relative;
	padding: 10px 0px 5px 44px;
	background: #54abf3;
	font-weight: bold;
	font-size: 18px;
	line-height: 38px;
}
.dekiru_title:after, .dekiru_title:before {
	content: '';
	height: 18px;
	width: 4px;
	display: block;
	background: #00A8FF;
	position: absolute;
	top: 8px;
	left: 15px;
	border-radius: 10px;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	transform: rotate(45deg);
	-webkit-transform: rotate(45deg);
	-moz-transform: rotate(45deg);
	-o-transform: rotate(45deg);
	-ms-transform: rotate(45deg);
	margin-top: 10px;
	margin-left: 10px;
}
.dekiru_title:before {
	height: 10px;
	transform: rotate(-45deg);
	-webkit-transform: rotate(-45deg);
	-moz-transform: rotate(-45deg);
	-o-transform: rotate(-45deg);
	-ms-transform: rotate(-45deg);
	top: 16px;
	left: 7px;
	margin-top: 10px;
	margin-left: 10px;
}
.naiyou_box {
	padding: 25px;
	margin: 20px auto;
	border: 10px solid #2038a2;
}
a:hover {
	opacity: 0.8;
}
.tokutei_area {
	margin: 10px auto;
	padding: 40px 0px;
}
footer {
	padding: 8px 0;
	text-align: center;
	background: #C70200;
	color: #ffffff;
}
/* =============================================================================
装飾・テキストカラー・背景色
   ========================================================================== */
strong {
	font-weight: 800;
}
.bg_gray {
	background: #eae8ed;
}
.bg_blue {
	background: #d0e5f3;
}
.red {
	color: crimson;
}
.blue {
	color: #3a9cfd;
}
.line_pink {
	background: linear-gradient(transparent 60%, #f6c 60%);
}
.line_yellow {
	background: linear-gradient(transparent 60%, #ff6 60%);
}
.under {
	text-decoration: underline;
}
.big {
	font-size: 1.8rem;
	line-height: 1.2;
}
.mini {
	font-size: 1rem;
}
/* =============================================================================
申し込み箇所
   ========================================================================== */
.red {
	color: #C70200;
	font-weight: bold;
	text-align: center;
	font-size: 1rem;
}
.big {
	font-size: 2rem;
}
.btn_box {
	border: 3px double #193549;
	background: #fff;
	margin: 30px auto;
	padding: 30px 0;
	box-sizing:content-box;
}

.btn_box p {
	text-align: center;
}
.btn_box h4 {
	font-size: 2rem;
	text-align: center;
}
.btn_box ul.box {
	margin-bottom: 50px;
}
.course dl {
	margin: 30px auto 50px;
	text-align: center;
}
.course dt {
	margin-bottom: 20px;
}
.money {
	width: 90%;
	margin: 0 auto;
}
.btn, .btn2 {
	display: block;
	padding: 10px 20px;
	width: 600px;
	text-decoration: none;
	color: #FFF;
	background: #3a86bc;
	border-radius: 8px;
	font-size: 1.5rem;
	margin: 20px auto;
	text-align: center;
	box-shadow: 3px 5px 0px #eee;
	border: 2px solid #fff;
}
.btn2 {
	background: #C70200;
}
.money h3 {
	background: #000;
	color: #fff;
	font-size: 20px;
	padding: 20px;
	text-align: center;
	margin: 50px auto 20px;
}
.money span {
	font-size: 15px;
	display: block;
	text-align: center;
	margin-bottom: 30px;
}
.money dl {
	width: 80%;
	margin: 0 auto 30px;
	border-bottom: 1px solid #000;
	padding-bottom: 20px;
}
.money dt, .money td {
	padding: 15px;
}
.money dt {
	background: #ddd;
	text-align: center;
	width: 20%;
	padding: 10px;
	margin-right: 20px;
	display: inline-block;
}
.money dt.title {
	display: block;
	background: #333;
	color: white;
	font-weight: bold;
	width: 100%;
	margin-bottom: 20px;
}
.money dd {
	display: inline-block;
	text-align: left;
	vertical-align: middle;
}
.cre {
	border: 3px solid #C00;
	margin: 30px auto;
	width: 80%;
}
.cre dt {
	background: #C00;
	width: 100%;
	color: #fff;
	text-align: center;
	padding: 20px;
	line-height: 1.4;
	font-size: 1.2rem;
}
.cre dd {
	padding: 0 20px 20px;
	text-align: left;
}


.jishu{
	font-size:1.2em;
	background:#fff;
	border:solid 10px #666;
	width:650px;
	padding:30px 30px;
	margin:10px auto;

}

.tsujo{
	font-size:1.2em;
	background:#fff;
	border:solid 10px #3a9cfd;
	width:650px;
	padding:30px 30px;
	margin:10px auto;
}

.hosho{
	font-size:1.2em;
	background:#fff;
	border:solid 10px #CC0000;
	width:650px;
	padding:30px 30px;
	margin:10px auto;
}

.advanced{
	font-size:1.2em;
	background:#fff;
	border:solid 10px #570082;
	width:650px;
	padding:30px 30px;
	margin:10px auto;
}


.jishu,.tsujo,.hosho,.advanced{
	max-width:100%;
}



.huge{
	font-size:3.4em;
	line-height:1;
}

.price{
	font-size:2em;
}

.small{
	font-size:0.8em;
}

.ita{
	font-style:italic;
}
.gray{
	color:#666;
}

.crimson{
	color:#CC0000;
}
.violet{
	color:#570082;
}

.btn3{
	background:#45ca1d;
	text-decoration:none;
	color:#fff;
	font-size:1.1em;
	font-weight:bold;
	width:500px;
	padding:15px 30px;
	border-radius:4px;
	display:block;
	text-align:center;
	margin:10px auto 20px;
	box-shadow: 0px 6px 0px 0px #3c9200;
	position:relative;
	max-width:100%;
}

.btn3:hover{
 color:#fff;
 box-shadow: 0px 1px 0px 0px #3c9200;
 bottom: -6px;
}


.jishubtn,.tsujobtn,.hoshobtn,.advancedbtn{
	background:#45ca1d;
	text-decoration:none;
	color:#fff;
	font-size:1.1em;
	font-weight:bold;
	width:200px;
	padding:5px 10px;
	border-radius:4px;
	display:;
	text-align:center;
	margin:10px auto;
	position: relative;
}


.jishubtn{
	bottom:560px;
	right:700px
}


.advancedbtn{
	bottom:50px;
	right:600px
}


.bunkatsu {
	margin: 0 auto;
	font-size:0.8em;
}


.bunkatsu dl {
	width: 80%;
	margin: 0 auto 20px;
	border-bottom: 1px solid #000;
	padding-bottom: 10px;
}
.bunkatsu dt, .bunkatsu td {
	padding: 15px;
}
.bunkatsu dt {
	background: #ddd;
	text-align: center;
	width: 20%;
	padding: 10px;
	margin-right: 20px;
	display: inline-block;
}
.bunkatsu dt.title {
	display: block;
	background: #333;
	color: white;
	font-weight: bold;
	width: 100%;
	margin-bottom: 20px;
}
.bunkatsu dd {
	display: inline-block;
	text-align: left;
	vertical-align: middle;
}

.content{
    margin: 0 auto;
    padding: 40px;
}
.modal{
    display: none;
    height: 100vh;
    position: fixed;
    top: 0;
    width: 100%;
}
.modal__bg{
    background: rgba(0,0,0,0.8);
    height: 100vh;
    position: absolute;
    width: 100%;
}
.modal__content{
    background: #fff;
    left: 50%;
    padding: 40px;
    position: absolute;
    top: 50%;
    transform: translate(-50%,-50%);
    width: 60%;
}


.mendan {
	background: url(../img/mendan.jpg);
	width: 700px;
	max-width:100%;
	height: 500px;
	margin:30px auto;
	text-align:center;
	background-size:contain;
	background-repeat:no-repeat;
}

.mendan-btn {
	background:#3c3;
	position:relative;
	color:#fff;
	text-decoration:none;
	font-size:2em;
	font-weight:600;
	border-radius:8px;
	margin:0 auto;
	top:63%;
	width:600px;
	padding:25px 0;
	overflow:hidden;
	display: block;
	justify-content:center;
	align-items:center;
	max-width:95%;

}

.mendan-btn:after,.mendan-btn-sp:after{
	animation: shiny 3s ease-in-out infinite;
	position: absolute;
    content: '';
    display: inline-block;
    top: -180px;
    left: 0;
    width: 30px;
    height: 100%;
    background-color: #fff;
}


@-webkit-keyframes shiny {
    0% { -webkit-transform: scale(0) rotate(45deg); opacity: 0; }
    80% { -webkit-transform: scale(0) rotate(45deg); opacity: 0.5; }
    81% { -webkit-transform: scale(4) rotate(45deg); opacity: 1; }
    100% { -webkit-transform: scale(50) rotate(45deg); opacity: 0; }
}


.jouchu {
	position: fixed;
	margin: 0 auto;
	bottom: 0px;
	z-index: 10;


}


.center-box{
	display:flex;
	align-items:center;
	justify-content:center;
}


.jouchu:hover{
	filter:brightness(110%);
	opacity:1;

}


@keyframes fuwafuwa {
    0% {-webkit-transform: scale(1) }
    100% {-webkit-transform: scale(1.05) }

}


.normal{
	border:solid 5px #0166ff;
	padding-bottom:40px;
	background:#dfecfd	
}
.advance{
	border:solid 5px #673499;
	padding-bottom:40px;
	background:#f0eaf8
}
.jishu2{
	border:solid 5px #01cbcb;
	padding-bottom:40px;
	background:#cfffff

}

.bunkatsu h3{
	font-size:1.5rem;
	padding:0;
	background:#ababab;
	color:#fff;
}



.fuwafuwa {
    animation: fuwafuwa 0.8s alternate infinite;
}
@keyframes fuwafuwa {
    0% {-webkit-transform: scale(1) }
    100% {-webkit-transform: scale(1.1) }

}

.g-btn{
	background: linear-gradient(#72d20c, #2db804);

	color: #fff;
	font-size: 30px;
	font-weight: bold;
	text-decoration: none;
	text-align: center;
	width: 500px;
	max-width: 100%;
	padding: 24px 0 28px;
	margin: 20px auto;
	border-radius: 8px;
	position: relative;
	display: block;
	transition: 0.2s;
	overflow:hidden;

}

.g-btn button:hover{
	background:rgba(255,255,255,0.8);
	background-blend-mode:lighten;
}




a.btn{
	background: linear-gradient(#f3ff4e,#ffbc00);
	border-top:solid 3px #fffff1;
	border-bottom:solid 3px #958e00;
	color: #000;
	font-size: 1.6rem;
	font-weight: bold;
	text-decoration: none;
	text-align: center;
	width: 600px;
	max-width: 100%;
	padding: 23px 0 23px;
	margin: 50px auto;
	border-radius: 100px;
	position: relative;
	display: block;
	transition: 0.2s;
	overflow:hidden;
	border-right:none;
	border-left:none;

}

a.btn:hover{
		background: linear-gradient(#ffbc00,#f3ff4e);
}

a.btn:before{
	font-family:Font Awesome\ 5 Free;
	content:"\f35a";
	font-weight:900;
	margin-right:20px;
	font-size:2.3rem;
	vertical-align:middle;
}



#countdown{
	font-weight:bold;
	margin:0 auto;
	text-align:center;
	background:#f00;
	color:#fff;
	
}

.timetext{
	font-size:1.5rem;

}


#CDT,#CDT2,#CDT3{
	font-size:2.3rem;
}





@media screen and (max-width:750px) {

.modal__content{
	width:95%;
}

.bunkatsu{
	text-align:left;
	margin:0;
	

}

.bunkatsu dl{
	width:100%;
}

.bunkatsu dt{
	width:80px;
	font-size:0.9em;
}

.bunkatsu dd{
	font-size:0.9em;
}


.huge{
	font-size:2.5em;
}


a.btn3{
	max-width:90%;
}


.bunkatsu h3{
	padding:5px 10px
}

a.btn{
	width:100%;
	font-size:1rem;
}

a.btn:before{
	font-size:1.2rem;
	margin-right:10px;
}


	
.timetext{
	font-size:1.4rem;
}


#CDT,#CDT2,#CDT3{
	font-size:1.7rem;
	display:block;
}
	
	
}