@charset "utf-8";

@import url('https://fonts.googleapis.com/css?family=Crimson+Text:400,400i,600,600i|Merriweather|Sorts+Mill+Goudy:400,400i');

@font-face { font-family: "Yu Gothic"; src: local("Yu Gothic Medium"); font-weight: 100; }
@font-face { font-family: "Yu Gothic"; src: local("Yu Gothic Medium"); font-weight: 200; }
@font-face { font-family: "Yu Gothic"; src: local("Yu Gothic Medium"); font-weight: 300; }
@font-face { font-family: "Yu Gothic"; src: local("Yu Gothic Medium"); font-weight: 400; }
@font-face { font-family: "Yu Gothic"; src: local("Yu Gothic Bold"); font-weight: bold; }

/*	RESET CSS
================================================== */
html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font:inherit;vertical-align:baseline}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}body{line-height:1}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:'';content:none}table{border-collapse:collapse;border-spacing:0}
body {line-height:1;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%;}
a { text-decoration:none;outline:0;-webkit-tap-highlight-color:rgba(0,0,0,0);}

/*	BASE
================================================== */
html{
	font-size:10px;
	}

body{
	font-family: "游ゴシック体", "Yu Gothic", YuGothic, "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", sans-serif;
	font-size:1.3rem;
	color:#444;
	overflow-y: scroll;
	-webkit-text-size-adjust: 100%;
	background:#F7F7F7;
	}

button, input, select, textarea{
	font-family:inherit; font-size:100%;
	}

a {
	color:#4C3E38;
	text-decoration:underline;
	-webkit-transition: 0.5s;
	-moz-transition: 0.5s;
	transition: 0.5s;
	word-break: break-all;
	}

a:hover {
	opacity:0.7;
	-webkit-transition: 0.5s;
	-moz-transition: 0.5s;
	transition: 0.5s;
	}

*,
*:before,
*:after {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	}

img{
	vertical-align:top;
	-webkit-box-sizing: content-box;
	-moz-box-sizing: content-box;
	box-sizing: content-box;
	height:auto;
	}
/* 
body *{
	overflow:hidden;
	}
 */
@media screen and (min-width: 769px) {

	.sp { display:none; }
	a.tel{ text-decoration:inherit; color:inherit; cursor:default; }
	a.tel:hover{ opacity:1; }

}

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

	.pc { display:none; }
	.sp { display:block; }
	img { width:100%; height:auto; }

}

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

	html{
	font-size:9px;
	}

}

/*	SLIDEBARS
================================================== */
[canvas=container] {
	background-color: transparent !important; /* Basic background color, overwrite this in your own css. */
	}
[off-canvas] {
	background-color: #3D2E28 !important; /* Basic background color, overwrite this in your own css. */
	color: #fff !important; /* Basic colors, overwrite this in your own css. */
	}
#btn-open{
	display:none;
	}
@media screen and (max-width: 768px) {
	[canvas=container] {
	margin:60px 0 0 !important;
	overflow:hidden !important;
	}
	[canvas=header]{
	position:fixed;
	top:0;
	width:100%;
	height:60px;
	background:#fff;
	z-index:999 !important;
	}
	#btn-open{
	display:block;
	}
}

/*	SLIDER
================================================== */
.bx-wrapper{
	box-shadow: none !important;
	border: 0 !important;
	left: 0 !important;
	margin:0 auto !important;
	background:transparent !important;
	overflow: visible !important;
	}

.bx-wrapper img{
	width:100%;
	height:auto;
	}

/*	COMMON
================================================== */

main{
	margin: 80px auto 0px;
	}

#top main{
	margin: 0 auto;
	}

figure img{
	width:100%;
	height:auto;
	}

section{
	margin:0 auto;
	padding:80px 0;
	overflow:hidden;
	}

section article{
	width:70%;
	max-width:896px;
	margin:0 auto;
	overflow:hidden;
	}

section p{
	line-height:2;
	}

section h2{
	margin:0 auto 40px;
	text-align:center;
	}

section:not(#concept) h2{
	display:block;
	font-family: 'Sorts Mill Goudy', serif;
	font-style:italic;
	font-size:4rem;
	letter-spacing:0.1rem;
	color:#3D2E28;
	}

section:not(#concept) h2 span{
	display:inline-block;
	margin: 0 0 20px;
	padding: 0.5em 2.2em 0.5em 2.4em;
	font-family: 游明朝, "Yu Mincho", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
	transform: rotate(.03deg);
	font-weight:600;
	font-style:normal;
	font-size:1.4rem;
	letter-spacing:0.1rem;
	line-height: 1;
	background:
	url(../img/slash.svg) no-repeat left bottom,
	url(../img/slash.svg) no-repeat right top;
	background-size:29px auto;
	color:#6D625E;
	}

section#services h2 span,
section#flow h2 span,
section#company h2 span{
	background:
	url(../img/slash_w.svg) no-repeat left bottom,
	url(../img/slash_w.svg) no-repeat right top;
	background-size:29px auto;
	}

section h3{
	font-family: 游明朝, "Yu Mincho", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
	transform: rotate(.03deg);
	font-weight:600;
	font-style:normal;
	font-size:1.7rem;
	letter-spacing:0.1rem;
	line-height:1.6;
	color:#3D2E28;
	}

section h3 span{
	display:block;
	font-family: 'Crimson Text', serif;
	font-weight:600;
	font-style:italic;
	font-size:1.6rem;
	letter-spacing:0.05rem;
	}

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

section{
	padding:70px 0;
	}

section article{
	width:80%;
	max-width:80%;
	}

section h2{
	margin:0 auto 50px;
	}

section:not(#concept) h2{
	font-size:2.7rem;
	}

section:not(#concept) h2 span{
	margin: 0 0 30px;
	font-size:1.3rem;
	font-weight:bold;
	line-height:1.5 !important;
	}

}

.btn{
	margin:0 auto !important;
	padding:0.5em 0 !important;
	text-align:center !important;
	line-height:1 !important;
	}

.btn a{
	display:inline-block;
	height: auto;
	line-height: 1.5;
	min-height:40px;
	padding: 1em 35px 1em 30px;
	text-align:center;
	text-decoration:none;
	font-size:1.4rem;
	font-weight:bold;
	letter-spacing:0.1rem;
	color:#fff;
	background:#4BA7A8 url(../img/btn_w.svg) no-repeat right center;
	background-size:40px auto;
	overflow: hidden;
	}

.btn.box a:before{
	content: "";
	display: block;
	position: absolute;
	top: 0px;
	left: 0px;
	width: 100%;
	height: 100%;
	text-indent: -9999px;
	outline: none;
	z-index: 2;
	}

.btn.box a:hover:before{
	opacity:0.2;
	background:#fff;
	}

.center{ text-align:center !important; }
.left{ text-align:left !important; }
.right{ text-align:right !important; }
.flex { 
	display:flex;
	flex-direction: row;
	flex-wrap: wrap;
	overflow:hidden;
	}

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

	.btn a{
	display:block;
	width:85%;
	margin:0 auto;
	}
	
	.flex{
	display:block;
	width:100%;
	}

}

/*	HEADER
================================================== */

@media screen and (min-width: 769px) {

#header{
	position:fixed;
	width:100%;
	overflow:visible;
	z-index:999;
	/* TRANSFORM */
	background: rgba(247, 247, 247, 0);
	transition: .5s;
	}

#header .inner{
	position:relative;
	width:100%;
	max-width:1280px;
	margin:0 auto;
	padding:30px 30px 10px;
	transition: .5s;
	}

#header:after{
	content:"";
	display:block;
	position:absolute;
	top:80px;
	left:50%;
	width:300%;
	max-width:300%;
	margin-left:-150%;
	height:1px;
	background:#ccc;
	}

#header h1{
	position:absolute;
	top:95px;
	font-size:1.2rem;
	font-weight:bold;
	letter-spacing:0.1rem;
	color:#645753;
	transition: .5s;
	}

#header .logo{
	width:224px;
	}

#header .logo img{
	width:100%;
	}

#header nav{
	position:absolute;
	top:0;
	right:30px;
	padding:30px 0 0;
	text-align:right;
	letter-spacing:0.1rem;
	}

#header nav li{
	float:left;
	display:block;
	}

#header nav li a{
	display:block;
	height:42px;
	line-height:42px;
	padding:0 1em;
	text-decoration:none;
	font-size:1.3rem;
	font-weight:bold;
	letter-spacing:0.05rem;
	color:#fff;
	}

#header nav li:last-child a{
	margin-left:1em;
	padding: 0px 2.5em 0px 2em;
	text-align:center;
	text-decoration:none;
	font-size:1.3rem;
	font-weight:bold;
	letter-spacing:0.1rem;
	color:#fff;
	background:#4BA7A8 url(../img/btn.svg) no-repeat 92% center;
	background-size:7px auto;
	opacity:0.9;
	}

#header nav li:last-child a:hover{
	opacity:1;
	}

/* TRANSFORM */

#header.transform{
	background: rgba(247, 247, 247, 1);
	margin-top:-20px;
	}

#header.transform h1{
	display:none;
	}

#header.transform nav li a{
	color:#645853;
	}

#header.transform nav li:last-child a{
	color:#fff;
	}

}

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

	#header{
	border-bottom:1px solid #ccc;
	}

	#header .inner{
	width:90%;
	margin:0 auto;
	padding:10px 0 0;
	}

	#header h1{
	font-size: 0.9rem;
	color: #776C68;
	letter-spacing: 0.1rem;
	margin-bottom: 3px;
	}

	#header .logo{
	width:50%;
	max-width:168px;
	}

	#header .logo img{
	width:100%;
	}

	#header nav{
	display:none;
	}

	#btn-open{
	position:absolute;
	top:0;
	right:0;
	margin:0;

	display:block;
	width:60px;
	height:60px;
	text-indent:-99999px;
	background:url(../img/open.png) no-repeat center center;
	background-size:38% auto;
	}

	#btn-close {
	position:absolute;
	top:0;
	right:0;
	width:60px;
	max-width:60px;
	height:60px;
	margin:0;
	background:url(../img/close.png) no-repeat center center;
	background-size:38% auto;
	font-size:0;
	}

	#sidemenu {
	width: 60%;
	max-width: 300px;
	}
	#sidemenu a{
	display:block;
	padding:1.5em;
	text-decoration:none;
	color:#fff;
	}
	#sidemenu ul{
	margin:4em 0 0;
	}
	#sidemenu li{
	border-bottom:1px solid #776C68;
	}
	#sidemenu li:last-child a{
	background:url(../img/check_w.png) no-repeat 1.5em center;
	background-size:auto 20px;
	padding-left:3.5em;
	}


}

/*	FOOTER
================================================== */

#footer {
	padding:20px 0;
	text-align:center;
	background:#4C3E38;
	color:#fff;
	}

#footer a{
	color:#fff;
	}

#footer p{
	font-size:1.0rem;
	letter-spacing:0.3rem;
	color:#B7B2B0;
	}

#footer nav{
	display:none;
	}

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

	#footer nav{
	display:block;
	}

	#footer nav ul{
	}

	#footer nav ul li{
	}

	#footer nav ul li a{
	display:block;
	}

	#footer p{
	letter-spacing:0.15rem;
	}

}

/*	mainphoto
================================================== */

#mainphoto{
	padding:0;
	width:100%;
	max-width:1280px;
	}

#mainphoto header{
	position:absolute;
	margin:160px 0 0 50px;
	padding:0;
	}

#mainphoto h2{
	width:710px;
	margin:0 0 15px;
	text-align:left;
	}

#mainphoto h2 img{
	width:100%;
	height:auto;
	}

#mainphoto p{
	margin:0 0 0 65px;
	font-family: 游明朝, "Yu Mincho", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
	transform: rotate(.03deg);
	font-weight:600;
	font-style:normal;
	font-size:1.7rem;
	letter-spacing:0.05rem;
	line-height:1.8;
	color:#3D2E28;
	}

#mainphoto p span.sp{
	display:none;
	}

#mainphoto .slider{
	float:right;
	width:900px;
	position:relative;
	z-index:-1;
	}

#mainphoto .slider:after{
	position:absolute;
	top:0;
	left:0;
	display:block;
	width:900px;
	height:630px;
	content:"";
	display:block;
	background:
	url(../../img/topslider.svg) no-repeat left top,
	url(../../img/topslide_cover.png) repeat-x top;
	background-size:
	60px 100%,
	100% 80px;
	z-index:999;
	}

#mainphoto .slider img{
	width:100%;
	height:auto;
	}

#mainphoto figure{
	clear:both;
	width:40px;
	margin:0 auto;
	padding:15px 0;
	}

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

	#mainphoto .slider{
	float: none;
	width:95%;
	margin: 0 0 0 5%;
	position:relative;
	z-index:-1;
	}

	#mainphoto .slider:after{
	width:100%;
	height:0;
	padding-bottom:70%;
	background:
	url(../../img/topslider.svg) no-repeat -1px center;
	background-size:
	auto 110%;
	}

	#mainphoto header{
	/* margin: 58% auto 20px; */
	position:relative;
	margin: -60px 0 0;
	padding:0;
	}

	#mainphoto h2{
	width: 100%;
	height:0;
	padding-bottom:54%;
	margin: 0 0 10px;
	background:url(../../img/title_sp.png) no-repeat;
	background-size:100% auto;
	}

	#mainphoto h2 img{
	display:none;
	}

	#mainphoto p {
	margin: 0 0 0 10%;
	font-size:1.5rem;
	}

	#mainphoto p span.sp{
	display:inline;
	}

	#mainphoto figure {
	padding: 20px 0;
	}

}

/*	concept
================================================== */

#concept{
	background:#fff
	url(../../img/concept_bg_ini.png) no-repeat center top;
	background-size:1280px auto;
	text-align:center;
	}

#concept h2{
	margin:0 auto;
	}

#concept h2 span{
	display:inline-block;
	margin:0 auto 50px;
	padding:0.5em 1.8em 0.5em 2em;
	font-family: 'Sorts Mill Goudy', serif;
	font-style:italic;
	font-size:1.3rem;
	letter-spacing:0.15rem;
	background:
	url(../img/slash.svg) no-repeat left bottom,
	url(../img/slash.svg) no-repeat right top;
	background-size:29px auto;
	color:#6D625E;
	}

#concept h3{
	display:inline-block;
	margin:0 auto 40px;
	padding:0 1.8em 0 2em;
	font-family: 游明朝, "Yu Mincho", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
	transform: rotate(.03deg);
	font-weight:600;
	font-size:2.3rem;
	letter-spacing:0.1rem;
	background:
	url(../img/dquote.svg) no-repeat left top,
	url(../img/dquote_end.svg) no-repeat right top;
	background-size:17px auto;
	color:#333;
	line-height:1.5;
	}

#concept p{
	margin:0 auto 2rem;
	font-weight:bold;
	font-size:1.4rem;
	line-height:1;
	letter-spacing:0.05rem;
	text-align:center;
	}

#concept p span{
	display:inline-block;
	padding:0.7em 0;
	border-bottom:1px solid #E2E0DF;
	}

#concept p:last-child{
	margin:2em auto 0;
	}

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

	#concept{
	background:#fff
	url(../../img/a.png) no-repeat top right;
	background-size:
	126px auto;
	}

	#concept h2 span{
	margin:0 auto 40px;
	}

	#concept h3 {
	display:block;
	padding: 0 1em 0 1em;
	margin:0 auto 30px;
	font-size:2rem;
	}

	#concept h3:before {
	content:"　";
	}

	#concept p {
	margin:0 auto 30px;
	line-height:31px;
	font-size:1.3rem;
	text-align:center;

	padding-top: 0;
	padding-bottom: 0;
	background: repeating-linear-gradient(rgba(255,255,255,0) 0,
	rgba(255,255,255,0) 30px,
	#E2E0DF 30px,
	#E2E0DF 31px);
	}

	#concept p:last-child{
	margin:3em auto 0;
	background:none;
	}

	#concept p span {
	display: inline;
	padding: 0;
	border-bottom: 0px;
	}

}

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

	#concept p {
	text-align:left;
	}
	#concept p span br{
	display:none;
	}
	
}

/*	services
================================================== */

#services{
	background:
	url(../../img/services_bg_ini.png) no-repeat center top,
	url(../../img/services_bg.jpg) no-repeat center center;
	background-size:
	1280px auto,
	cover;
	color:#fff;
	}

#services article{
	width:75%;
	max-width:1024px;
	}

section#services h2 span{
	color:#fff;
	}

section#services h3{
	color:#fff;
	}

#services .box3 div{
	width:28%;
	margin-right:8%;
	}

#services .box3 div:nth-of-type(3n){
	margin-right:0;
	}

#services .box3 div h3{
	margin:0 auto 15px;
	text-align:center;
	}

#services .box3 div span{
	margin:10px auto 0;
	text-align:center;
	color:#CECBC9;
	}

#services .box3 div > figure{
	width:86px;
	margin:0 auto 40px;
	}

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

	#services{
	background:
	url(../../img/s.png) no-repeat top left,
	#857d7a url(../../img/services_bg.jpg) no-repeat center top;
	background-size:
	145px auto,
	400% auto;
	color:#fff;
	}

	.box3 div{
	width:100% !important;
	padding:0 0 !important;
	margin:0 auto 40px !important;
	}

	.box3 div:last-child{
	margin:0 auto 0 !important;
	}

	#services .box3 div > figure{
	width:70px;
	margin:0 auto 30px;
	}


}

/*	photos
================================================== */

#photos{
	padding:0;
	}

@media screen and (min-width: 1600px) {

	#photos .subslider{
	width:100%;
	}

	#photos .subslider li{
	float:left;
	width:20%;
	}

	#photos .subslider li img{
	width:100%;
	}

}

/*	whatscebu
================================================== */

#whatscebu{
	background:
	url(../../img/whatscebu_bg_ini.png) no-repeat center top,
	url(../../img/whatscebu_bg_1.png) no-repeat center top,
	url(../../img/whatscebu_bg_2.png) no-repeat center 640px;
	background-size:
	1280px auto,
	1600px auto,
	1600px auto;
	}

#whatscebu .box2{
	width: 80%;
	max-width: 1000px;
	margin:0 auto 40px;
	}

#whatscebu .box2 div{
	float:left;
	width:50%;
	padding:0 50px;
	}

#whatscebu .box2 div h3{
	margin:0 auto 30px;
	padding:0 0 10px;
	border-bottom:1px solid #3D2E28;
	font-size:1.8rem;
	}

#whatscebu div dt{
	font-family: 游明朝, "Yu Mincho", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
	transform: rotate(.03deg);
	font-weight:600;
	font-style:normal;
	font-size:1.6rem;
	letter-spacing:0.1rem;
	color:#3D2E28;
	background:url(../img/check.png) no-repeat left center;
	background-size:25px auto;
	margin:0 0 10px;
	padding:0 0 0 35px;
	height:25px;
	line-height:25px;
	}

#whatscebu div dd+dt{
	margin-top:30px;
	}

#whatscebu .strength h2{
	margin: 0 auto 20px;
	}

#whatscebu .strength h2 span{
	font-family: 'Sorts Mill Goudy', serif;
	font-weight:400;
	font-style:italic;
	font-size:1.4rem;
	letter-spacing:0.15rem;
	color:#3D2E28;
	}

#whatscebu .strength ul{
	overflow:hidden;
	}

#whatscebu .strength li{
	float:left;
	width:20%;
	text-align:center;
	}

#whatscebu .strength li figure{
	width:100px;
	margin:0 auto 20px;
	}

#whatscebu .strength p{
	font-weight:bold;
	letter-spacing:0.1rem;
	line-height:1.5;
	}

#whatscebu .strength p span{
	display:block;
	font-family: 'Crimson Text', serif;
	font-weight:bold;
	font-style:italic;
	font-size:1.5rem;
	letter-spacing:0.05rem;
	color:#9E9693;
	margin:0.5em 0 0;
	}

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

	#whatscebu{
	background:
	url(../../img/w.png) no-repeat top right,
	url(../../img/whatscebu_bg_1_sp.png) no-repeat top left;
	background-size:
	126px auto,
	132px auto;
	}

	#whatscebu .box2{
	width:100%;
	max-width:100%;
	padding:0 10%;
	background:
	url(../../img/whatscebu_bg_2_sp.png) no-repeat bottom right;
	background-size:
	134px auto;
	}

	#whatscebu .box2 div{
	float:none;
	width:100%;
	padding:0 0;
	margin:0 auto 40px;
	}

	#whatscebu .box2 div:last-child{
	margin:0 auto 0;
	}

	#whatscebu .strength{
	width:90%;
	max-width:90%;
	}

	#whatscebu .strength ul{
	margin: 0 0 -30px;
	text-align:center;
	font-size: 0;
	}

	#whatscebu .strength li{
	float:none;
	display:inline-block;
	width:33.33%;
	margin:0 auto 30px;
	text-align:center;
	font-size:1.2rem;
	}

	#whatscebu .strength li figure{
	width:80px;
	}

	#whatscebu .strength li p span{
	font-size:1.4rem;
	margin: 0.3em 0 0;
	}

	#whatscebu .box2 div h3{
	letter-spacing:0;
	}

}


/*	curriculum
================================================== */

#curriculum{
	background:#fff
	url(../../img/curriculum_bg_ini.png) no-repeat center top;
	background-size:
	1280px auto;
	}

section#curriculum h2{
	line-height:50px;
	}

#curriculum article{
	width:90%;
	max-width: 1080px;
	}

#curriculum .box3 div{
	width: 33.33%;
	margin: 0 0 50px 0;
	padding: 0 2.7% 0;
	}

#curriculum .box3 div h3{
	margin:0 auto 15px;
	text-align:center;
	}

#curriculum .box3 div > figure{
	width:100%;
	margin:0 auto 20px;
	}

#curriculum .box3 div h3{
	font-size:1.6rem;
	}

#curriculum .box3 div h4{
	height:32px;
	line-height:32px;
	margin:0 auto 20px;
	text-align:center;
	font-weight:bold;
	font-size:1.4rem;
	letter-spacing:0.1rem;
	color:#fff;
	background:#3D2E28;
	}

#curriculum .box3 div h4 img{
	width:18px;
	padding:6px 0.3em;
	}

#curriculum .read{
	margin:0 auto 70px;
	}

#curriculum .read p{
	margin:0 auto 20px;
	text-align:center;
	line-height:2.1;
	font-size:1.4rem;
	font-weight:bold;
	letter-spacing:0.05rem;
	}

#curriculum .read:before{
	content:"";
	display:block;
	width:100px;
	height:1px;
	margin:0 auto 50px;
	background:#3D2E28;
	}

#curriculum .forcompany{
	position:relative;
	border:3px double #9E9693;
	padding:40px;
	background:#F2F2F2;
	overflow:hidden;
	}

#curriculum .forcompany h3{
	margin:0 auto 10px;
	}

#curriculum .forcompany h3:nth-of-type(1){
	float:left;
	width:45%;
	margin:0 auto;
	padding:30px 20px 30px 0;
	text-align:center;
	}

#curriculum .forcompany  h3:nth-of-type(1) span{
	display:block;
	margin:0 auto;
	font-family: 'Sorts Mill Goudy', serif;
	font-weight:400;
	font-style:italic;
	font-size:3rem;
	letter-spacing:0.15rem;
	color:#3D2E28;
	}

#curriculum .forcompany h3 em{
	color:#4BA7A8;
	}

#curriculum .forcompany p{
	line-height:1.8;
	}

#curriculum .forcompany .box a{
	content: "";
	display: block;
	position: absolute;
	top: 0px;
	left: 0px;
	width: 100%;
	height: 100%;
	text-indent: -9999px;
	outline: none;
	z-index: 2;
	}

#curriculum .forcompany .box a:hover{
	opacity:0.2;
	background:#fff;
	}

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

	#curriculum{
	background:#fff
	url(../../img/c.png) no-repeat top left;
	background-size:
	145px auto;
	}

	#curriculum .box3{
	width:80%;
	margin: 0 auto 50px;
	}

	section#curriculum h2{
	line-height:1;
	}

	section#curriculum h2 img{
	display:block;
	width:30px;
	margin:0 auto 5px;
	}

	#curriculum .read p{
	font-size:1.3rem;
	line-height:2;
	}

	#curriculum .forcompany {
	padding:30px 0;
	}
	
	#curriculum .forcompany h3:nth-of-type(1){
	float:none;
	width:100%;
	margin:0 auto;
	padding:30px 0;
	font-size:1.5rem;
	letter-spacing:0;
	}

	#curriculum .forcompany h3:nth-of-type(1) span{
	font-size:2.5rem;
	letter-spacing:0.3rem;
	}

	#curriculum .forcompany h3:nth-of-type(2){
	font-size:1.5rem;
	padding:0 30px;
	}
	
	#curriculum .forcompany p{
	line-height:2;
	padding:0 30px;
	}
	
}

/*	flow
================================================== */

#flow{
	background:
	url(../../img/flow_bg_ini.png) no-repeat center top,
	url(../../img/flow_bg.jpg) no-repeat center center;
	background-size:
	1280px auto,
	cover;
	color:#fff;
	}

section#flow h2 span{
	color:#fff;
	}

section#flow h3{
	color:#fff;
	}

#flow article{
	width:86%;
	max-width:86%;
	}

#flow .box5{
	margin:0 auto 70px;
	}

#flow .box5 div{
	float:left;
	width:20%;
	padding:0 3% 0 1%;
	background:url(../../img/flow_direct.png) no-repeat right bottom;
	background-size:auto 200px;
	}

#flow .box5 div:last-child{
	padding:0 3% 0 1%;
	background:none;
	}

#flow .box5 div:nth-of-type(3n){
	margin-right:0;
	}

#flow .box5 div h3{
	margin:0 auto 15px;
	text-align:left;
	}
	
#flow h3 span {
    display: block;
    font-family: inherit;
    font-weight: 400;
    font-style: normal;
    font-size: 8rem;
    letter-spacing: 0.05rem;
    text-align:left;
    line-height: 1;
    margin:0 0 10px;
}

#flow .notice {
	overflow:hidden;
	}

#flow .notice div {
	float:left;
	width:30%;
	margin-left:2.5%;
	padding-left:2.5%;
	}

#flow .notice div:first-child {
	margin-left:0;
	}

#flow .notice div + div{
	border-left:1px solid #ddd;
	}

#flow .notice div h4{
	height:25px;
	line-height:25px;
	margin:0 auto 10px;
	font-size:1.5rem;
	letter-spacing:0.1rem;
	background:url(../img/check_w.png) no-repeat;
	background-size:25px auto;
	padding:0 0 0 35px;
	}

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

	#flow{
	background:
	url(../../img/f.png) no-repeat top right,
	#857d7a url(../../img/flow_bg.jpg) no-repeat center top;
	background-size:
	145px auto,
	300% auto;
	color:#fff;
	}

#flow .box5{
	margin:0 auto 30px;
	}

#flow .box5 div{
	float:none;
	width:100%;
	padding:0 0 50px;
	background:url(../../img/flow_direct_sp.png) no-repeat center bottom;
	background-size:200px auto;
	}

#flow .box5 div:last-child{
	padding:0 3% 0 1%;
	background:none;
	}

#flow h3 {
    padding:20px 0 0;
}

#flow h3 span {
    float:left;
    margin:0 20px 50px 0;
}

#flow .notice div {
	float:none;
	width:100%;
	margin:0;
	padding:0;
	margin-top:20px;
	padding-top:20px;
	}

#flow .notice div:first-child {
	margin-top:0;
	}

#flow .notice div + div{
	border-top:1px solid #ddd;
	border-left:0;
	}

#flow .notice div p{
	font-size:1.2rem;
	line-height:1.8;
	}

}

/*	company
================================================== */

#company{
	background:
	url(../../img/company_bg.jpg) no-repeat 57% center;
	background-size:
	cover;
	color:#fff;
	}

section#company h2 span{
	color:#fff;
	}

section#company h3{
	color:#fff;
	}

#company article{
	width: 80%;
	}

#company article figure{
	width:50%;
	float:left;
	text-align:center;
	}

#company article figure img{
	width:50%;
	max-width:140px;
	margin:0 auto;
	}

#company article h2{
	margin-right:5%;
	margin-bottom: 30px;
	color:#ccc;
	}

#company article h2 span{
	color:#fff;
	}

#company article p{
	margin-right:5%;
	text-align:center;
	line-height:2.3;
	color:#fff;
	}

	#company article h2 span:before,
	#company article h2 span:after {
	background: #fff;
	}

#company article dl {
	width: 50%;
	font-size:1.3rem;
	line-height:1.8;
	color:#fff;
	overflow:hidden;
}
#company article dt {
	float:left;
	width:20%;
	padding:1.2rem 0 1.2rem;
	font-weight:bold;
	letter-spacing:0.1rem;
}
#company article dd {
	padding:1.2rem 0 1.2rem 20%;
	border-bottom:1px solid #9E9693;
	overflow: visible;
}
#company article dd a{
	color:#fff;
	text-decoration:underline;
}



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

	#company{
	padding:100px 0 60px;
	}

	#company article figure{
	width:80%;
	float:none;
	margin:0 auto 50px;
	}

	#company article figure img{
	width:40%;
	}

	#company article h2{
	margin: 0 5% 30px !important;
	margin-bottom: 
	}

	#company article p{
	margin: 0 5% !important;
	text-align:left;
	}

	#company article p br{
	display:none;
	}

	#company article {
	padding-left:0;
	padding-right:0;
	}
	#company article dl {
	width: 100%;
	margin:0 auto;
	}
	#company article dl dt{
	width: 25%;
	}
	#company article dl dd{
	padding-left: 25%;
	}

}

/*	mailform
================================================== */

#mailform{
	}

#mailform article{
	width: 90%;
	max-width:700px;
	}

#mailform p{
	width:80%;
	margin:0 auto;
	margin-bottom: 40px;
	text-align:center;
	letter-spacing:0.2rem;
	color:#222;
	}

.lineheight4{
	line-height:4 !important;
	}

input[type="text"].wauto{
	width:auto !important;
	}

.w40{
	width:40% !important;
	}

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

#mailform h2{
	margin-bottom:40px;
	}

#mailform p{
	letter-spacing:0.1rem;
	text-align:left;
	}

.w40{
	width:100% !important;
	}


}

/*	form.css - CUSTOMIZE
================================================== */

#mailformpro, table#mfp_confirm_table {
	width: 100% !important;
	}

form .must{
	padding-left:1em !important;
	}

form .must:before{
	content:"*";
	float:left;
	width:1em;
	margin-left:-1em;
	font-family: 'Open Sans', sans-serif;
	color:#4BA7A8;
	}

form#mailformpro dl dt,
form#mailformpro dl dd{
	color:#111;
	}

form#mailformpro dl dt{
	font-size:1.4rem !important;
	letter-spacing:0.2rem;
	}

form#mailformpro dl dt span{
	display:block;
	margin:0.6em 0;
	font-family: 'Open Sans', sans-serif;
	font-size:1.1rem;
	letter-spacing:0.1rem;
	line-height:1.5;
	text-transform:uppercase;
	}

input[type="text"],
input[type="date"],
input[type="tel"],
input[type="email"],
input[type="file"],
textarea{
	border:1px solid #bbb !important;
	}

form .guideline{
	border:1px solid #bbb !important;
	margin-bottom: 2em;
	}

form .guideline + p{
	text-align:center;
	font-size:1.4rem;
	}

div.mfp_buttons button[type="submit"],
div.mfp_buttons button#mfp_button_send {
	background:#4BA7A8 !important;
	color:#fff !important;
	}

div.mfp_err{
	color:#FF915A !important;
	}

.problem{
	background:#F8E8D7 !important;
	}

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

	form dl,
	.mfp_buttons,
	table#mfp_confirm_table{
	width:90% !important;	
	}

	form#mailformpro dl dt{
	font-size:inherit !important;
	}

	form#mailformpro dl dt span{
	display:inline;
	padding-left:1em;
	}
	
}

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

	#mailformpro,
	table#mfp_confirm_table{
	width:90%;
	}

	#mailformpro dl dt{
	margin: 0 0 1em !important;
	}

	#mailformpro dl dd{
	margin: 0 0 1.5em !important;
	}

	#mailformpro dl dt span{
	display:inline;
	font-size:1.2rem;
	}

}





#footer nav{
	display:none;
	}