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

.btnLink{ margin:50px auto; text-align:center;}

#sideMenu {
	z-index: 999;
	position: fixed;
	right: 0;
	top: 540px;
	display: block;
}
#sideMenu:hover{ opacity: 0.7;}

#headerInner{ padding:5px 0 0; height: 75px;}
#headerInner h1 a{ font-size: 32px;	color: #333; vertical-align: middle;}
#headerInner h1 span{ font-size: 0.75rem; font-weight: normal;}
#headerInner h1 img{ margin-top: -8px; margin-right: 5px; width: 130px; height: auto;}
#headerInner #headerContents{ padding:10px 0;}


/*----------------------------------------------------------------------------
***                                                                   mainSec
----------------------------------------------------------------------------*/
#topBox{ position: relative;}
#topBox::before{
	content: '';
	width: 50%;
	height: 100%;
	background-image: url(/hoiku/images/bg_top01.jpg);
	background-repeat: no-repeat;
	background-size: cover;
	background-position: bottom;
	position: absolute;
	left: 0;
	top: 0;
	}
#topBox::after {
	content: '';
	width: 50%;
	height: 100%;
	background-image: url(/hoiku/images/bg_top02.jpg);
	background-repeat: no-repeat;
	background-size: cover;
	background-position: bottom;
	position: absolute; 
	right: 0;
	top: 0;
	z-index: -1;
}
#topBox #topBoxInner{ position: relative; padding:0 0 45px;}
#topBoxInner > div{ position: relative;}
#topBoxInner h2{ font-size: 60px; color: #333;}
#topBoxInner h2 > span{  font-size: 24px; font-weight:normal;}
#topBoxInner h2 > span .txtColorPk{ color: #f33c71;}
#topBoxInner h2 img{ margin-bottom: 10px;}
#topBoxInner .choiseBox{ margin:0; text-align:center;}
#topBoxInner .choiseBox .choiseTxt{ position: relative; display:inline-block; margin:20px auto 35px;}
#topBoxInner .choiseBox .choiseTxt p:last-child{ font-size: 18px; margin-top: 1em;}
#topBoxInner .choiseBox .choiseTxt p strong{ color: #ff6666; font-size: 48px;}
#topBoxInner .choiseBox .choiseTxt:before{
	content: '';
	background: url(/hoiku/images/img_choise01.png) no-repeat;
	width: 80px;
	height: 76px;
	position: absolute;
	left:-70px;
	bottom:-10px;
	background-size: contain;
}
#topBoxInner .choiseBox .choiseTxt::after {
	content: '';
	background: url(/hoiku/images/img_choise01.png) no-repeat;
	transform: scale(-1, 1);
	width: 80px;
	height: 76px;
	position: absolute;
	right: -70px;
	bottom: -10px;
		background-size: contain;
}

#topBoxInner .cpnBanner{ position: absolute; right:30px; top:30px;}
#topBoxInner .cpnBanner:hover{ opacity: 0.7;}

.choiseType .choiseTypeBtn{ width: 920px; margin:0 auto;}
.choiseType .choiseTypeBtn a{ text-decoration: none;}
.choiseType .choiseTypeBtn a:hover{ opacity: 0.7;}
.choiseType .choiseTypeBtn dl{ position: relative; width: 440px; height: 210px; display:-webkit-box; display:-ms-flexbox; display:flex; -ms-flex-wrap:wrap; flex-wrap:wrap; }
.choiseType .choiseTypeBtn li:first-child dl{ background: #783fa3; border-radius: 15px;}
.choiseType .choiseTypeBtn li:last-child dl{  background: #32a6a6; border-radius: 15px; }
.choiseType .choiseTypeBtn dl dd.fukidashiTxt {
	height: 66%;
	display: flex;
	align-items: center;
	justify-content: center;
	order: 1;
	width: 100%;
	font-size: 1.25rem;
	font-weight: bold;
	background: url(/hoiku/images/btn_choise01b.png) no-repeat;
	background-size: cover;
	background-position: center;
	border-radius: 15px;
}
.choiseType .choiseTypeBtn li:last-child dl dd.fukidashiTxt {
	background: url(/hoiku/images/btn_choise02b.png) no-repeat;
	background-size: cover;
	background-position: center;
	border-radius: 15px;	
}
.choiseType .choiseTypeBtn dl dd.fukidashiTxt strong{ margin-top: -6%;}
.choiseType .choiseTypeBtn dl dd.fukidashiTxt span{ color: #ff5089; font-size: 1.375rem;}
.choiseType .choiseTypeBtn dl dt{ height: 34%; width: 100%; order: 2; position: relative;}
.choiseType .choiseTypeBtn dl dt::before{ content: ''; display: inline-block; width: 105px; height: 105px; background: url(/hoiku/images/btn_ill_choise01.png) no-repeat; position: absolute; left:20px; bottom:20px;}
.choiseType .choiseTypeBtn li:last-child dl dt::before{  background: url(/hoiku/images/btn_ill_choise02.png) no-repeat; }
.choiseType .choiseTypeBtn dl dt p{ color: #FFF; font-size: 1.375rem; position: absolute; bottom: 20px; left: 140px;}
.choiseType .choiseTypeBtn dl dt p span{ color: #ffde00; font-size: 1.5rem; }
.choiseType .choiseTypeBtn dl dd.typeTagTxt{ position: absolute; left:20px; top:-10px;}
.choiseType .choiseTypeBtn dl dd.typeTagTxt span{ background: #e8e8e8; font-size: 0.75rem; border-radius:100vh; padding:0.2em 1em; font-weight: bold; margin-right: 0.5em; }
.choiseType .choiseTypeBtn dl dd.typeTagTxt span::before{ content: '#'; display: inline-block; margin-right: 0.2em;}
.choiseType .choiseTypeBtn dl dt:after {
	content: "";
	background: url(/hoiku/images/btn_choisebtn.png) no-repeat;
	position: absolute;
	top: 0;
	bottom: 0;
	margin: 6px auto 0;
	width: 40px;
	height: 40px;
	right: 20px;
	background-size: contain;
}


#mainImg{ width:100%; height:440px;}
.english #mainImg{ background-color:#dfd1ed;}
.education #mainImg{ background-color:#bce8ed;}

#mainImgInner{
	width:1110px;
	height:440px;
	margin:0 auto;
	padding:0 0 0 70px;
	background-image:url(/hoiku/images/main_p.png);
	background-position:right top;
	background-repeat:no-repeat;
	background-size:auto 100%;
	position: relative;
	z-index: 0;
}
.english #mainImgInner {
	background-image: url(/hoiku/images/main_p_en.png);
}
#mainImgInner:after{
	content: "";
	width: 100%;
	height: 100%;
	background-image: url(/hoiku/images/main_deco.png);
	background-position: right top;
	background-repeat: no-repeat;
	background-size: auto 100%;
	position: absolute;
	z-index: -1;
}

#mainImg #midashi1{ font-size:22px; color:#fff; font-weight:bold; text-shadow: 2px 2px 8px#838383; margin-bottom: 1em;}
#mainImg #midashi1 > span{ font-size: 28px; font-weight: bold; margin-top: 0.3em;}
#mainImg #midashi1 strong{ font-size: 44px; display: inline-block; line-height: 1.3em;}
#mainImg #midashi1 strong .txtColorWt{ font-size: 32px;}
#mainImg .txtColorPk{ color: #ff7083;}
#mainImg .txtColorYe{ color: #fff648; font-size: 47px;}
#mainImg .txtColorBl{ color:#4686c5;}
#mainImg .txtColorWt * { color: #FFF; }
#mainImg .txtColorWt{ line-height: 1.6em; margin-top: -1em; display: inline-block;}
#mainImg .txtColorWt span{ font-size: 29px;}
#mainImg .cpnBanner{ position: absolute; right:-80px; top:30px;}
#mainImg .cpnBanner:hover{ opacity: 0.7;}
#mainImg .topBnr{ margin:1em auto;}
#mainImg .topBnr a:hover{ opacity: 0.7;}

.english #mainImg #midashi1{ font-size:22px; color:#fff; font-weight:bold; }
.english #mainImg #midashi1 > span{ font-size: 23px; font-weight: bold;}
.english #mainImg #midashi1 strong{ font-size: 44px; display: block; line-height: 1.3em; margin-left: -0.5em; text-shadow: 2px 2px 5px #FFF;}
.english #mainImg .txtColorWt{ line-height: 1.6em; margin-top: -1em; display: block;}
.english #mainImg .txtColorWt span{ font-size: 29px;}

.education #mainImg #midashi1{ font-size:22px; color:#fff; font-weight:bold; }
.education #mainImg #midashi1 > span{ font-size: 23px; font-weight: bold;}
.education #mainImg #midashi1 strong{ font-size: 44px; display: block; line-height: 1.3em; text-shadow: 2px 2px 5px #FFF;}
.education #mainImg .txtColorWt{ line-height: 1.6em; margin-top: -1em; display: block;}
.education #mainImg .txtColorWt span{ font-size: 29px;}
.education #mainImg .txtColorBl{ margin-left: -0.5em;}


.topBtn { margin: 60px 0 0;}
.topBtn a {
	font-size: 23px;
	position: relative;
	color: #686868;
	background: #FFF;
	border: 5px solid #fff648;
	border-radius: 100vh;
	font-weight: bold;
	display: inline-block;
	line-height: 0.8em;
	text-align: center;
	padding: 0 1.3em 0.5em;
	box-shadow: 4px 4px 8px #61adb6;
}
.english .topBtn a {
	box-shadow: 2px 2px 5px #b299c7;
}
.education .topBtn a {
	box-shadow: 2px 2px 5px #84bbc1;
}
.topBtn a .btnTxt:after{ content: ">"; display: inline-block; font-size: 15px; font-weight: normal; vertical-align: middle;	margin-left: 1em; margin-bottom: 0.4em;}
.topBtn a .btnTxt strong{ font-size: 28px; color: #ff6666;}
.topBtn a .fukidashi { font-size: 17px; display: block; width: 130px; padding: 0.2em 0; position: absolute; left: 0; right: 0; top: -2em; margin: auto; color: #FFF; background: #ff6666; line-height: 1.5em;}
.topBtn a .fukidashi span{ color: #fffa48; font-size: 19px; }
.topBtn a .fukidashi:before { content: ""; position: absolute; left: calc(50% - 6px); margin: auto; bottom: -6px; border-width: 6px 3.5px 0 3.5px; border-style: solid; border-color: #ff6666 transparent transparent transparent;}
.topBtn a:hover { background: #fffaa1; text-decoration: none;}

#programBanner{ background: #3a72b5; z-index: 0; position: relative;}
#programBanner::before{
	content: ''; 
	width: 100%;
	height: 100%;
	background-image: url(/hoiku/images/bg_stripe.png);
	background-position: center top;
	background-repeat: repeat;
	background-size: auto;
	position: absolute;
	z-index: -1;
	}
#programBanner dl{  max-width: 980px; margin:0 auto; padding:20px 0;}
#programBanner dl * { color: #FFF; z-index: 999;}
#programBanner dl dt { font-size: 26px; border-right:6px solid #FFF; padding-right: 0.8em; }
#programBanner dl dt::before{
	content: '';
	width: 64px;
	height: 60px;
	background-image: url(/hoiku/images/ico_megahon.png);
	background-position: center top;
	background-repeat: no-repeat;
	background-size: auto 100%;
	display:inline-block;
	margin-right: 0.5em;
	z-index: 2;
}
#programBanner dl dt > span { line-height: 1.4em;}
#programBanner dl dt span span{ border:1px solid #f46606; font-size: 20px; background: #FFF; color: #f46606; padding: 0.1em 0.3em; margin-right: 0.2em;}

#programBanner dl dd:first-of-type { margin-left: 1.3em; position: relative; z-index: 1;}
#programBanner dl dd:first-of-type strong{ padding-bottom: 0.3em; border-bottom:2px solid #ffec00; display:inline-block; font-size: 24px; margin-bottom: 0.4em; }
#programBanner dl dd:first-of-type span{ color: #ffec00; font-weight:bold;}
#programBanner dl dd:last-of-type a:hover{ opacity: 0.7;}
#programBanner dl dd:last-of-type a{ background: #FFF; border-radius: 17px; padding: 0.7em; text-align:center; margin-left: 20px;}
#programBanner dl dd:last-of-type span{ color: #f46606; font-size: 11px; font-weight: normal;}
#programBanner dl dd:last-of-type span::after{ content: '▼'; font-size: 10px; margin-top: 0.3em; display: block;}

#programBanner dl dd:first-of-type::after {
	content: '';
	width: 107px;
	height: 80px;
	background: url(/hoiku/images/img_cpn05.png) no-repeat;
	background-position: center top;
	background-repeat: no-repeat;
	background-size: contain;
	position: absolute;
	right: -40px;
	top: -60px;
	z-index: -1;
	background-size: contain;

}

#hoikuSec{ max-width: 980px; margin:60px auto 80px;}
#hoikuSec h3{ width:10em; border-bottom:3px solid #e48691;}
#hoikuSec ul{ margin:60px auto;}
#hoikuSec #readTxtBox{ margin: 40px auto;}

#readTxtBox{ margin:60px auto 50px;}
#readTxtBox p{ font-size: 18px; line-height: 1.5em;}
#readTxtBox p strong{ font-size: 25px; border-bottom:4px solid #fffa48; padding-bottom: 0.3em; margin-top: 0.5em; display:inline-block;}
#readTxtBox p:first-child strong{ border: none; font-size: 24px; display:block; margin: -0.5em 0 0.4em;}
#readTxtBox p .txtColorGr{ color: #8bdd68; font-size: 32px;}
#readTxtBox p .txtColorPk{ color: #ff6666; font-size: 32px;}


#careerBox{ border:10px solid #bacfe5; max-width: 780px; margin:50px auto 60px; padding: 20px;}
#careerBox h4{ font-size: 2rem; color: #3a72b5; margin-bottom: 0.5em;}
#careerBox h4 strong{ font-size: 1rem; font-weight: normal; margin: 0 0 0.8em; display: inline-block;}
#careerBox h4 strong::before {
	content: '';
	display:inline-block;
	transform: rotate(45deg);
	width: 30px;
	border: 0;
	border-top: 2px solid #ffed0b;
	margin: 0;
	padding: 0;
	vertical-align: middle;
}
#careerBox h4 strong::after {
	content: '';
	display: inline-block;
	transform: rotate(315deg);
	width: 30px;
	border: 0;
	border-top: 2px solid #ffed0b;
	margin: 0;
	padding: 0;
	vertical-align: middle;
}
#careerBox h4 strong .wakuTxt{ background: #d91673; margin: 0 0.2em; padding:0.3em 0.5em; font-weight: bold; color: #FFF;}
#careerBox h4 strong .pinkTxt{ font-weight: bold; color: #d91673; font-size: 1.375rem;}
#careerBox div{ margin: 10px 0; align-items: flex-end;	justify-content: flex-end;	position: relative;}
#careerBox p{ line-height: 1.6em;}
#careerBox .careerImg{ position: absolute; left:0; bottom:-50px;}
#careerBox dl{ background: #f4f4f4; margin: 1em 0 0; padding: 1.2em 0; border-radius:15px;}
#careerBox dl dt{ color: #ee6606; margin-bottom: 0.5em; font-size: 1.125rem;}
#careerBox dl dd{ line-height: 1.6em; font-size: 0.875rem;}

#interestSec{ width:900px; margin:40px auto;}
#interestSec p{ text-align:left; font-size:22px; color:#333; margin:0 0 1em;}
#interestSec p span{ font-size:28px; font-weight:bold; color:#e293a8;}
#interestSec #checkBox{
	width:515px;
	float:left;
}
#interestSec #checkBox li{
	font-size:16px;
	line-height:1.8em;
	padding:0 0 0 25px;
	background-image:url(/images/icon_check.png);
	background-size:20px;
	background-position:left -1px;
	background-repeat:no-repeat;
}
#interestSec #groupBox{ width:345px; float:right; background: #ededed; padding: 12px 12px;}
#interestSec #groupBox p{ padding:5px 0 0; margin:0; text-align:left; font-size:12px; color:#666; line-height:1.5em;}
#interestSec #groupBox li{ float:left; margin:10px 20px 0 0;}
#interestSec #groupBox li:last-child{ margin-right:0;}


#pageLink{ width:980px; margin:0 auto 40px;}
#pageLink li{ float:left; margin:0 40px 0 0;}
#pageLink li:last-child{ margin:0;}

#optionSec,
#advantageSec,
#flowSec,
#companySec{ background-image:url(/images/line.jpg); background-repeat:repeat-x; margin:0 auto; padding:80px 0 0;}

#contentsArea h3{ text-align:center; font-size:42px; color:#333; line-height:1.5em; margin:0 auto; padding:0 0.5em;}

/*----------------------------------------------------------------------------
***                                                              optionSec
----------------------------------------------------------------------------*/

#optionSec{ margin:40px auto 100px; text-align:center; padding: 80px 0 0;}
#optionSec h3{ display:inline-block; border-bottom:3px solid #3c98aa;}
 #optionSec p{ font-size: 18px; margin: 2.2em 0 0;}
/*#optionSec div{ margin: 2em 0;}
#optionSec div a:hover{ opacity: 0.7;} */

#optionSec div{ max-width: 800px; margin:50px auto;}

#optionSec a{
	display: block;
	background: #ddcfeb;
	border-radius: 100vh;
	text-decoration: none;
}
#optionSec a:hover{ opacity: 0.7;}
#optionSec div:last-of-type a{ background: #b2dee3;}

#optionSec a dl{display: flex; justify-content: space-between;}
#optionSec a dl dt {
	order: 2;
	background: #783fab;
	height: 100%;
	width: 260px;
	padding: 30px 30px 30px 20px;
	border-radius: 0 100vh 100vh 0;
	color: #FFF;
	font-size: 1.1rem;
	position: relative;
}
#optionSec div:last-of-type a dl dt {
	background: #32a6a6;
}
#optionSec a dl dt::after {
	content: '▶';
	position: absolute;
	top: 50%;
	right: 10px;
	transform: translateY(-50%);
	color: #ffde00;
	}
#optionSec a dl dt span{color: #ffde00; font-size: 1.38rem;}
#optionSec a dl dd::before{ content: ''; display: inline-block; width: 105px; height: 105px; background: url(/hoiku/images/btn_ill_choise01.png) no-repeat; background-size: contain; margin-top: -35px; }
#optionSec div:last-of-type a dl dd::before{ background: url(/hoiku/images/btn_ill_choise02.png) no-repeat; background-size: contain; }
#optionSec a dl dd {
	order: 1;
	padding: 30px 0px 0px 30px;
	font-weight: bold;
	display:-webkit-box; display:-ms-flexbox; display:flex;
}
#optionSec a dl dd li{ font-size: 1.1rem; margin: 0 0 0.3em; text-indent: -1.5em; padding-left: 1.5em;}
#optionSec a dl dd li::before{ content: ''; display: inline-block; background: url(/hoiku/images/btn_ill_choise_check.png); background-size: contain; width: 15px; height: 12px; margin-right: 0.5em; }
#optionSec a dl dd li span {color: #eb2c57;	font-size: 1.25rem;}
#optionSec div > dl{ margin-left: 80px; margin-top: 1em;} 
#optionSec div > dl dt{ background: #e7e7e7; color: #383838; font-size: 0.95rem; padding: 0.2em 0.5em; font-weight: 500;}
#optionSec div > dl dd{ font-size: 0.875rem;	margin-left: 0.5em;	line-height: 2em; }


/*----------------------------------------------------------------------------
***                                                              advantageSec
----------------------------------------------------------------------------*/
#advantageSec{ text-align:center;}
#advantageSec #advantageInner{ width:840px; margin:50px auto 0;}
#advantageSec h3{ display:inline-block; border-bottom:3px solid #3c98aa;}
#advantageSec #advantageInner>dl{ margin: 40px 0;}
#advantageSec #advantageInner > dl dt::before{ content: ''; display: inline-block; background: url(/hoiku/images/img_point01.jpg) no-repeat; width: 110px; height: 30px; margin-right: 0.5em; vertical-align: middle;}
#advantageSec #advantageInner > dl:last-of-type dt::before{ background: url(/hoiku/images/img_point02.jpg) no-repeat;}
#advantageSec #advantageInner > dl dt{ color: #ff6666; font-size: 26px; text-align:left; margin-bottom: 30px;}
#advantageSec #advantageInner > dl dd{ font-size: 18px; line-height: 1.6em;}
#advantageSec #advantageInner > dl dd .txtBox{ max-width: 520px;}
#advantageSec .brandBox{ background: #fff6f7; position: relative; padding: 30px 0; max-width: 720px; margin:-10px auto 40px;}
#advantageSec .brandBox::before {
	content: '';
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 38px 38px 0 0;
	border-color: #ff6666 transparent transparent transparent;
	position: absolute;
	left:0;
	top:0;
}
#advantageSec .brandBox::after {
	content: '';
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 0 0 38px 38px;
	border-color: transparent transparent #ff6666 transparent;
	position: absolute;
	right: 0;
	bottom: 0;	
}
#advantageSec .brandBox p{ color: #f9ac12; font-weight:bold; font-size: 20px; margin-bottom: 1em;}
#advantageSec .brandBox ul{ max-width: 550px; margin:0 auto;}
#advantageSec .brandBox ul li{ width: 130px;}
#advantageSec .brandBox dl dl{}
#advantageSec .brandBox dl dt{ order: 2; font-size: 12px; text-align:center; width: 100%; color: #494949; font-weight:normal; margin-top: 1em;}
#advantageSec .brandBox dl dd{ order: 1; width: 100%; text-align:center;}

/*----------------------------------------------------------------------------
***                                                                   flowSec
----------------------------------------------------------------------------*/
#flowSec{}
#flowSec #flowInner{
	width:840px;
	height:880px;
	margin:40px auto 0;
	position:relative;
	background-image:url(/hoiku/images/img_flowBox.png);
	background-repeat:no-repeat;
}
#flowSec h3{ width:10em; border-bottom:3px solid #e48691;}
#flowSec dl{ position:absolute; background-repeat:no-repeat;}
#flowSec #step01{
	width:240px;
	height:217px;
	padding:0;
	top:0;
	left:0;
	background-image:url(/images/img_flowBox_type01.png);
	background-size:240px 217px;
}
#flowSec #step01::before {
	content: '';
	position: absolute;
	left:-40px;
	top:-40px;
	background: url(/hoiku/images/img_suport01.png) no-repeat;
	width: 90px;
	height: 130px;
}
#flowSec #step02{
	width:240px;
	height:217px;
	padding:0;
	top:0;
	left:310px;
	background-image:url(/images/img_flowBox_type02.png);
	background-size:240px 217px;
}
#flowSec #step02::before {
	content: '';
	position: absolute;
	right: -60px;
	bottom: -60px;
	background: url(/hoiku/images/img_suport02.png) no-repeat;
	width: 124px;
	height: 144px;
	z-index: 1;
}
#flowSec #step03{
	width:240px;
	height:400px;
	padding:0;
	top:0;
	right:0;
	background-image:url(/images/img_flowBox_type03.png);
	background-size:240px 400px;
}
#flowSec #step04{
	width:240px;
	height:217px;
	padding:0;
	top:430px;
	right:13px;
	background-image:url(/images/img_flowBox_type04.png);
	background-size:240px 217px;
}
#flowSec #step04::before {
	content: '';
	position: absolute;
    right: -90px;
    bottom: 0px;
	background: url(/hoiku/images/img_suport03.png) no-repeat;
	width: 140px;
	height: 150px;
}
#flowSec #step05{
	width:240px;
	height:217px;
	padding:0;
	top:430px;
	left:310px;
	background-image:url(/images/img_flowBox_type05.png);
	background-size:240px 217px;
}
#flowSec #step05::before {
	content: '';
	position: absolute;
	left: -6px;
	top: -50px;
	background: url(/hoiku/images/img_suport04.png) no-repeat;
	width: 124px;
	height: 110px;
}
#flowSec #step06{
	width:217px;
	height:240px;
	padding:0;
	top:430px;
	left:0;
	background-image:url(/images/img_flowBox_type06.png);
	background-size:217px 240px;
}
#flowSec #step06::before {
	content: '';
	position: absolute;
	left: -50px;
    top: -155px;
	background: url(/hoiku/images/img_suport05.png) no-repeat;
	width: 260px;
	height: 180px;
}
#flowSec #step07{
	width:840px;
	height:170px;
	padding:0;
	bottom:0;
	left:0;
	background-image:url(/images/img_flowBox_type07.png);
}
#flowSec #step07::before {
	content: '';
	position: absolute;
	right: 130px;
	top: -50px;
	background: url(/hoiku/images/img_suport06.png) no-repeat;
	width: 114px;
	height: 200px;
}
#flowSec dt{
	width:217px;
	padding:90px 0 0;
	margin:0 0 20px;
	font-size:30px;
	color:#000;
	line-height:1em;
	text-align:center;
	background-position:center 20px;
	background-size:60px;
	background-repeat:no-repeat;
}
#flowSec #step01 dt{ background-image:url(/images/icon_flow01.png); padding:65px 0 0;}
#flowSec #step02 dt{ background-image:url(/images/icon_flow02.png);}
#flowSec #step03 dt{ background-image:url(/images/icon_flow03.png); width:240px;}
#flowSec #step04 dt{ background-image:url(/images/icon_flow04.png); margin:0 0 20px 25px;}
#flowSec #step05 dt{ background-image:url(/images/icon_flow05.png); margin:0 0 20px 25px;}
#flowSec #step06 dt{ background-image:url(/images/icon_flow06.png); padding:65px 0 0;}
#flowSec #step07 dt{ background-image:url(/images/icon_flow07.png); width:100%; padding:65px 0 0; position:relative;}
#flowSec #step07 dt .leftSide{ position:absolute; top:30px; left:280px;}
#flowSec #step07 dt .rightSide{ position:absolute; top:30px; right:280px; transform:scale(-1, 1);}


#flowSec dd{ width:217px; font-size:16px; color:#333; padding:0 1em;}
#flowSec #step01 dd{}
#flowSec #step02 dd{}
#flowSec #step03 dd{ width:240px;}
#flowSec #step04 dd{ margin:0 0 0 25px;}
#flowSec #step05 dd{ margin:0 0 0 25px;}
#flowSec #step06 dd{}
#flowSec #step07 dd{ width:840px; text-align:center;}

/*----------------------------------------------------------------------------
***                                                                cpnSec
----------------------------------------------------------------------------*/
#cpnSec{ background: #fffef1; max-width: 840px; margin:0 auto; position: relative; padding:15px; }
#cpnSec::before{
	content: '';
	position: absolute;
	width: calc(100% - 30px);
	height: calc(100% - 30px);
	background: url(/hoiku/images/bg_cpn.png) no-repeat top center;
	}
#cpnSec .sectionInner{ max-width: 570px; position: relative; margin:0 auto; padding: 55px 0 75px;}
#cpnSec h3{ color:#333333; border-bottom:4px solid #fffa48; padding:0 0 0.3em; font-size: 32px; line-height: 1.3em;}
#cpnSec h3 strong{ color: #e61673; font-size: 43px;}
#cpnSec h3 span{ font-size: 28px;}
#cpnSec h3 span::before{ content: '／'; display: inline-block; -webkit-transform: rotate(90deg); transform: rotate(90deg); }
#cpnSec h3 span::after{ content: '／'; display: inline-block;  }
#cpnSec p.txtBox{ margin: 30px 0; font-size: 18px;}
#cpnSec dl{ width: 540px;}
#cpnSec dl:first-of-type{ margin-bottom: 15px;}
#cpnSec dl dt{ background: #ff4a82; width: 250px; font-size: 22px; position: relative;}
#cpnSec dl:last-of-type dt{ background: #5d97c1;}
#cpnSec dl dt span{ color: #FFF;}
#cpnSec dl dt strong{ font-size: 23px; color: #FFF;}
#cpnSec dl dt::before {
	content: '';
	width: 100%;
	height: 100%;
	background-image: url(/hoiku/images/bg_stripe.png);
	background-position: center top;
	background-repeat: repeat;
	background-size: auto;
	position: absolute;
	z-index: 1;
}
#cpnSec dl dt::after{
	content: '';
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 7.5px 0 7.5px 13px;
	border-color: transparent transparent transparent #ff4a83;
	position: absolute;
	top: 0;
	bottom: 0;
	right: -10px;
	margin: auto;
}
#cpnSec dl:last-of-type dt::after {
	content: '';
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 7.5px 0 7.5px 13px;
	border-color: transparent transparent transparent #5d97c1;
	position: absolute;
	top: 0;
	bottom: 0;
	right: -10px;
	margin: auto;
}
#cpnSec dl dd{ background: #FFF; padding: 0.5em 1.2em; width: 290px; font-size: 20px; }
#cpnSec dl dd .txtcolorPk{ color: #e61673; font-size: 32px; font-weight:bold;}
#cpnSec .nisBox{ margin-top: 0.5em; font-size: 19px;}
#cpnSec .nisBox div{ background: #eaeaea; font-size: 12px; padding:0.5em; color: #000;}
#cpnSec .nisBox .txtcolorPk{ font-size: 24px;}
#cpnSec .novaUsagi{ position: absolute; right:-160px; bottom:77px;}

/*----------------------------------------------------------------------------
***                                                                programSec
----------------------------------------------------------------------------*/
#programSec{ max-width: 840px; margin:100px auto 0; position: relative; border:15px solid #f46606; text-align: center; padding:70px 45px;}
#programSec h3{ background: #3a72b5; font-size: 32px; position: absolute; top: -50px; left: 0; right: 0; margin: auto; display:inline-block; max-width: 645px; padding:0.5em 0 0.6em 1.2em;}
#programSec h3 > span::after{
	content: '';
	display:inline-block;
	background: url(/hoiku/images/img_cpn02.png) no-repeat;
	width: 56px;
	height: 50px;
	margin-left: 0.2em;
}
#programSec h3 > span{ color: #FFF;}
#programSec h3 > span strong{ font-size: 36px; color: #FFF;} 
#programSec h3 > span strong span{ color: #fff200; }
#programSec .flexBox p{ font-size: 20px; padding-left: 20px;}
#programSec .flexBox p span{ color: #3a72b5; font-size: 22px; font-weight: bold;}
#programSec .pImg{ position: absolute; left:-45px; top:-60px;}
.programContBox { margin: 30px 0;}
#programSec h4{ display:inline-block; border-bottom:4px solid #fffa48; padding-bottom: 0.3em; font-size: 24px; margin-bottom: 1em;}
.programContBox .detailBox{ }
.programContBox .detailBox li{ font-weight:bold; font-size: 19px;}
.programContBox .detailBox li p::before{ content: '●'; display: inline-block; color: #f29600; font-size: 12px;}
.programContBox .detailBox li p{ text-indent: -1em; padding-left: 1em;}
.programContBox .detailBox li .txtcolorOr{ color: #f46606; font-size: 22px;}
.programContBox .detailBox li .smallTxt{ font-size: 14px; font-weight:normal;}
.programContBox .checkBox{ margin: 30px auto; max-width: 615px;}
.programContBox .checkBox ul{ background: #ecf1f7; padding: 20px 30px; border-radius:20px;}
.programContBox .checkBox li{ margin: 0.5em 0;}
.programContBox .checkBox li::before{ 
	content: '';
	display: inline-block;
	background: url(/hoiku/images/ico_check.png) no-repeat;
	width: 20px;
	height: 20px;
	margin-right: 0.5em;
	vertical-align: middle;
}
.programContBox .detailBox2 {}
.programContBox .detailBox2 strong{ font-size: 18px;}
.programContBox .detailBox2 .txtcolorOr{ color: #f46606; font-size: 22px; }
.programContBox .detailBox2 .smallTxt{ font-size: 14px; font-weight:normal;}

.programContBox .checkBox .smallTxt{ text-align:right; margin-top: 0.2em; font-size: 14px;}
.programAreaBox div{ column-count: 5; max-width: 600px; margin:0 auto;}
.programAreaBox dl{ margin: 0 0 1.5em;}
.programAreaBox dt{ border:1px solid #3a72b5; background: #ecf1f7; color: #3a72b5; width: 4em; display:inline-block; text-align:center; padding:0.2em 0.3em;}
.programAreaBox dd{ display:inline-block; font-size: 18px;}


/*----------------------------------------------------------------------------
***                                                                companySec
----------------------------------------------------------------------------*/
#companySec{}
#companySec h3{ width:6em; border-bottom:3px solid #f6e775;}
#companySec h4{ text-align:center; font-size:24px; font-weight:normal; color:#000; line-height:2.5em;}
#companySec p{ text-align:center; font-size:18px; color:#666; line-height:1.5em;}
#companySec dl{
	width:850px;
	margin:25px auto;
	padding:75px 50px 25px;
	box-sizing:border-box;
	border:1px solid #c9caca;
	position:relative;
	background-image:url(/images/logo_glr.png);
	background-size:15%;
	background-position:right 15px bottom 10px;
	background-repeat:no-repeat;
}
#companySec dt{ position:absolute; top:15px; left:-18px;}
#companySec dd{
	width:370px;
	float:left;
	padding-left:30px;
	font-size:18px;
	color:#666;
	line-height:2em;
	background-image:url(/images/icon_column.png);
	background-size:20px auto;
	background-position:left center;
	background-repeat:no-repeat;
}
#companySec dd:last-child{ width:550px;}


/*----------------------------------------------------------------------------
***                                                           プログラムページ
----------------------------------------------------------------------------*/
.programPage{ margin: 100px 0;}
.programPage .recruitBtn{ margin: 60px 0 0;}
.programPage .recruitBtn a:hover{ opacity: 0.7;}