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

html {  min-height:100%; }
body { margin: 0px; padding: 0px; font-size: 13px; font-family: "メイリオ", "游ゴシック", YuGothic, Meiryo, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", sans-serif; line-height: 150%; -webkit-text-size-adjust: none; color: #222;}
.highlight a:hover *{ filter: alpha(opacity=75); -moz-opacity:0.75; opacity:0.75;}
.clearfix:after { content: "."; display: block; height: 0; clear: both; visibility: hidden;}  
.clearfix { display: inline-table; overflow: hidden;}  
/* Hides from IE-mac \*/  
* html .clearfix { height: 1%; }  
.clearfix { display: block; }  
/* End hide from IE-mac */  
img {max-width: 100%;height: auto;width /***/: auto;border: none;vertical-align: bottom;}
img.miniimage { display: none; }
@media screen and (min-width: 737px) {
   img.spimage { display: none; } /* miniを表示 */
   img.bigimage  { display: block; } /* bigを表示 */
}
@media screen and (max-width: 736px) {
   img.spimage { display: block; } /* miniを表示 */
   img.bigimage  { display: none; }  /* bigを非表示 */
}
p { margin: 0; padding: 0; }
ul { margin: 0; padding:0; }
li { margin: 0; padding:0; }
h1 { font-size: 12px; font-weight: normal; margin:0; padding:0; line-height: 20px; text-align: right; }
a:link { color: #507D32; text-decoration: none; }
a:visited { color: #507D32; text-decoration: none; }
a:hover { color: #222222; text-decoration: none; }
a:active { color: #507D32; text-decoration: none; }
strong { font-weight: normal; }
.text_center { text-align:center; }
.text_right { text-align:right; }
.text_red { color: #CC0000; }
.text_bold { font-weight:bold; }
.text11 { font-size: 11px; line-height: 200%; }
.text13 { font-size: 13px; line-height: 200%; }
.text15 { font-size: 15px; line-height: 200%; }
.text17 { font-size: 17px; line-height: 200%; }
.text19 { font-size: 19px; line-height: 200%; }
.text21 { font-size:21px; line-height: 200%; }
.text25 { font-size:25px; line-height: 200%; }
.text40 { font-size:40px; }
.bottom5 { margin-bottom: 5px; }
.bottom10 { margin-bottom: 10px; }
.bottom15 { margin-bottom: 15px; }
.bottom20 { margin-bottom: 20px; }
.bottom30 { margin-bottom: 30px; }
.bottom40 { margin-bottom: 40px; }
.bottom50 { margin-bottom: 50px; }
.top20 { margin-top: 20px; }
.top50 { margin-top: 50px; }
.top80 { margin-top: 80px; }
.top100 { margin-top: 100px; }
.sb-slidebar { display: none; }
.space40 {margin: 60px 20px; }
.pcbr {}
.spbr {display: block;}

#page-top {position: fixed;bottom: 10px;right: 10px;width: 40px; z-index:400;}
#spHead {display: none;}

.btnHead {display: inline-block;text-align: center;text-decoration: none;line-height: 28px;outline: none; width:100%;}
.btnHead::before,
.btnHead::after {position: absolute;z-index: -1;display: block;content: '';}
.btnHead,
.btnHead::before,
.btnHead::after {-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;-webkit-transition: all .3s;transition: all .3s;}
.btnHead {position: relative;z-index: 2;background-color: #FFF;border: 1px solid #222222;color: #FFF;line-height: 28px;overflow: hidden;}
.btnHead:hover {color: #FFF; border: 1px solid #222222;}
.btnHead::after {top: -100%;width: 100%; height: 100%;}
.btnHead:hover::after {top: 0; background: #222; color: #FFF;}

.header {width: 100%; background: url(image/bg_headsp.jpg) repeat-x top; position: absolute; top: 0; z-index: 10000;}
#headerWrap {width: 100%; margin: 0 auto;}
#headLogo {width: 160px; margin-left: 2.5%; float: left; }
#headLogo h1 {font-size: 13px; margin: 0; padding: 0; font-weight: normal;}
#headContact {width: 120px; float: right;}
#headContactIn {}
#headLink {}
#headReserve {}
#headBtn {}

#footer {width: 100%;}
#footLogo {width: 195px;  margin: 0 auto 10px;}
#footLogo h2 {margin: 0; padding: 0;}
#footCopy {margin-bottom: 30px; text-align: center;}

#wrapperContainer {width: 100%; position: relative; z-index: 0; height: 100%;}
.wrapper {height: 100%;}
#headLeft {width: 15%; float: left; margin-top: 36px; background: url(image/head_side1tab.jpg) no-repeat center top; background-size: cover;}
#headTop {display: none;}
#headcenter {width: 70%; float: left;}
#headRight {width: 15%; float: left; margin-top: 36px; background: url(image/head_side2tab.jpg) no-repeat center top; background-size: cover;}
#headBottom {display: none;}
#headCopy {width: 80%; margin: 45px auto; z-index: 100;}
#headCopy h2 {margin: 0; padding: 0;}
#arrowWH {width: 30px; margin: 0 auto; margin-top: -30px; z-index: 1; position: relative;}
@media screen and (max-width: 460px) {
	#headLeft {display: none;}
	#headTop {background: url(image/head_side1sp.jpg) repeat-x center top; height: 100px; margin-top: 36px; position: relative; z-index: 1; display: inherit;}
	#headcenter {width: 100%; position: relative; top: 0; bottom: 0; margin: auto;}
	#headCopy {width: 80%; margin: 15px auto; z-index: 100;}
	#headRight {display: none;}
	#headBottom {background: url(image/head_side2sp.jpg) repeat-x center top; height: 100px; margin-top: -120px; position: relative; z-index: 1; display: inherit;}
	#arrowWH {width: 30px; margin: 0 auto; margin-top: -50px; z-index: 1; position: relative;}
}

.container {width: 95%; margin-left: auto; margin-right: auto;}
.containerW {width: 99%; margin-left: auto; margin-right: auto;}
.arrow {width: 30px; margin: 0 auto; padding: 30px 0 0; clear: both;}

#anchorArea {width: 100%; background: url(image/bg_anchortab.png) repeat-x center; padding: 50px 0 30px; z-index: 1; position: relative;}
@media screen and (max-width: 460px) {
	#anchorArea {width: 100%; background: url(image/bg_anchorsp.png) repeat-x center; padding: 50px 0 30px; z-index: 1; position: relative;}
}
#anchorInner {width: 97%; margin: 0 auto;}
.anchorBtn {width: 48%; margin: 0 1% 20px; float: left;}
.anchorBtn1 {width: 48%; margin: 0 1% 20px; float: left;}
.anchorBtn2 {width: 48%; margin: 0 26% 20px; float: left;}

#philos {width: 100%; background: url(image/bg_philossp.jpg) no-repeat center top; background-size: cover; position: relative; z-index: 0; margin: -40px 0 50px; padding: 60px 0 50px;}
#bragging {width: 100%; background: url(image/bg_bragsp.jpg) no-repeat center top; background-size: cover; position: relative; z-index: 0; margin: -60px 0 50px; padding: 60px 0 50px;}
#course {width: 100%; background: url(image/bg_coursesp.jpg) no-repeat center top; background-size: cover; position: relative; z-index: 0; margin: -60px 0 50px; padding: 60px 0 50px;}
#entry {width: 100%; background: url(image/bg_entrysp.jpg) no-repeat center top; background-size: cover; position: relative; z-index: 0; margin: -60px 0 50px; padding: 60px 0 50px;}
#event {width: 100%; background: url(image/bg_eventsp.jpg) no-repeat center top; background-size: cover; position: relative; z-index: 0; margin: -60px 0 50px; padding: 60px 0 50px;}
.title h2 {display: inline-block; background: #FFF; color: #A07233; font-size: 30px; line-height: 40px; padding: 5px 20px; margin: 0 0 15px;}
.titleEN {font-size: 17px; color: #FFF; line-height: 30px; font-family: 'Raleway', sans-serif; font-weight: 700; margin-bottom: 10px;}
.coverText {width: 100%; color: #FFF; font-size: 15px; line-height: 150%;}
.coverText h3 {font-family: "Sawarabi Mincho"; font-size: 21px; line-height: 30px; margin: 0 0 15px; padding: 0; font-weight: normal;}
.coverTextL h3 {font-family: "Sawarabi Mincho"; font-size: 21px; line-height: 30px; margin: 15px 0 15px; padding: 0; font-weight: normal; color: #FFF;}
.coverTextR h3 {font-family: "Sawarabi Mincho"; font-size: 21px; line-height: 30px; margin: 15px 0 15px; padding: 0; font-weight: normal; color: #FFF;}

.sepa3 {width: 96%; float: left; margin: 0 2% 20px;}
.sepa2 {width: 96%; float: left; margin: 0 2%;}
.sepa4 {width: 21%; float: left; margin: 0 2%;}

.philosMidashi h3 {font-family: "Sawarabi Mincho"; font-size: 21px; line-height: 30px; margin: 0 0 20px; padding: 0; font-weight: normal; text-align: center;}
.philosImg {width: 100%; margin-bottom: 20px;}

.contactText {background: url(image/bg_wave1sp.png) repeat-x center top #862E3A; padding: 30px 0 20px; font-size: 15px; line-height: 25px; text-align: center; color: #FFF; font-weight: bold;}
.contactBtnW {background: url(image/bg_wave3sp.png) repeat-x center bottom; padding: 0 0 70px; position: relative; z-index: 1;}
.contactBtn1 {width: 80%; margin: 0 auto; margin-bottom: 20px;}
.contactBtn2 {width: 80%; margin: 0 auto;}

.voiceIntro {width: 100%;}
.voiceIcon {width: 80px; margin: 20px 0;}
.voiceIconG {width: 80px; margin: 0 0 20px; float: left;}
.voiceStu {font-family: "Sawarabi Mincho"; font-size: 18px; line-height: 30px;}
.voiceName {font-family: "Sawarabi Mincho"; font-size: 21px; line-height: 30px; margin: 10px 0;}
.voiceName span {font-size: 20px;}
.voiceNameG {font-family: "Sawarabi Mincho"; font-size: 21px; line-height: 30px; float: left; margin: 35px 0 0 20px;}
.voiceNameG span {font-size: 20px;}
.voiceImg {width: 100%; max-width: 300px; margin-bottom: 15px;}
.voiceStuT {clear: both; margin-bottom:15px;}
.voiceGuaT {clear: both; margin-bottom: 30px;}
.voicePoint {font-size: 15px; color: #FFF; display: inline-block; margin-bottom: 10px; background: #862E3A; font-weight: bold; line-height: 30px; padding: 5px 15px; border-radius: 20px;}

#courseImg {width: 100%; max-width: 600px; margin: 0 auto 20px;}
.courseL {width: 100%; margin-bottom: 20px;}
.courseR {width: 100%; margin-bottom: 20px;}
.midashi h2 {font-family: "Sawarabi Mincho"; font-size: 30px; color: #862E3A; line-height: 50px; padding-bottom: 30px; margin-bottom: 25px; background: url(image/line.png) no-repeat left bottom; font-weight: normal;}
.midashi h3 {font-family: "Sawarabi Mincho"; font-size: 21px; color: #862E3A; line-height: 35px; margin-bottom: 25px;}
.midashi2 {font-size: 18px; color: #862E3A; margin-bottom: 10px; font-weight: bold;}
.midashi3 {font-size: 15px; color: #862E3A; margin-bottom: 5px; font-weight: bold;}
.coursePoint {font-size: 18px; color: #FFF; display: inline-block; margin-bottom: 10px; background: #862E3A; font-weight: bold; line-height: 30px; padding: 5px 15px; border-radius: 20px;}

.entryText {width: 100%; margin-bottom: 30px;}
.entry {width: 100%; border-top: 1px solid #A07233; background: #6F4F00;}
.entry2 {width: 100%; border-top: 1px solid #A07233; background: #6F4F00;}
.entryLast {width: 100%; clear: both; border-top: 1px solid #A07233; border-bottom: 1px solid #A07233; background: #6F4F00;}
.entryInnerL {border-left: 1px solid #A07233; border-right: 1px solid #A07233;}
.entryInnerR {border-left: 1px solid #A07233; border-right: 1px solid #A07233;}
.entryL {text-align: center; color: #FFF; width: 30%; padding: 10px 0; float: left;}
.entryL2 {text-align: center; color: #FFF; width: 30%; padding: 10px 0; float: left;}
.entryR {width: 62%; padding: 10px 4%; float: left; background: #FFF;}
.entryR2 {width: 62%; padding: 10px 4%; float: left; background: #FFF;}
.entryR ul {}
.entryR li {counter-increment: cnt; list-style-type:none;}
.entryR li:before{display: marker; content: "(" counter(cnt) ") ";}
.entryR2 ul {}
.entryR2 li {counter-increment: cnt; list-style-type:none;}
.entryR2 li:before{display: marker; content: "(" counter(cnt) ") ";}

.event {background: #A07233; margin-bottom: 30px;}
.eventImg {width: 100%;}
.eventTitle {padding: 10px 20px; font-size: 18px; background: #862E3A; color: #FFF; font-weight: bold;}
.eventDate {padding: 10px 20px; color: #FFF; background: #A07233;}