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

@font-face {
 font-family: 'notomin';
 font-style: normal;
 font-weight:normal; line-height:100%;
 src: url('../fonts/NotoSerifCJKjp-Medium_sub.woff') format('woff'), url('../fonts/NotoSerifCJKjp-Medium_sub.ttf') format('truetype');
}

@font-face {
 font-family: 'notomin';
 font-style: normal;
 font-weight:bold; line-height:100%;
 src: url('../fonts/NotoSerifCJKjp-Bold_sub.woff') format('woff'), url('../fonts/NotoSerifCJKjp-Bold_sub.ttf') format('truetype'); 
}
@font-face {
 font-family: 'noto';
 font-style: normal;
 font-weight:normal; line-height:100%;
 src: url('../fonts/NotoSansCJKjp-Regular_sub.woff') format('woff'), url('../fonts/NotoSansCJKjp-Regular_sub.ttf') format('truetype');
}

@font-face {
 font-family: 'noto';
 font-style: normal;
 font-weight:bold; line-height:100%;
 src: url('../fonts/NotoSansCJKjp-Bold_sub.woff') format('woff'), url('../fonts/NotoSansCJKjp-Bold_sub.ttf') format('truetype'); 
}

html{
  overflow-x: hidden !important;
  overflow-y:scroll;
  -webkit-transition: all 0.3s ease;
  -moz-transition: all 0.3s ease;
  -ms-transition: all 0.3s ease;
  -o-transition: all 0.3s ease;
  transition: all 0.3s ease; 
  width:100%; margin:0; padding:0; text-align:center;font-size: 1.2rem; }
/* IE10以降 */
@media all and (-ms-high-contrast:none){
html{
  font-size: 18px !important;  }
}

body.entry {text-align:left   }

tr td{ font-size:100%; }
div { box-sizing:border-box}
img { width:100%; }
a img{border:none;}
a { text-decoration:none}
.fonts { font-size:1.2rem !important }
.cf:before,
.cf:after {
    content: " ";
    display: table;
}

.cf:after {
    clear: both;
}

.cf {
    *zoom: 1;
}
.w80 { width:80%; margin-left:auto; margin-right:auto; }
.w100 { width:100%; }
.c_main { background-color:#8D0000 !important; }
.c_beige { background-color:#FFF2CF; }
.beige li { background-color:#FFF2CF; }
.c_lbeige { background-color:#F7F4F0; }
.c_purple { background-color:#7976B1; }
.c_lpurple { background-color:#CDC9E2; }
.c_green { background-color:#529067 !important; }
.c_lgreen { background-color:#CAE1B1; }
.c_orange { background-color:#F07112; }
.c_lorange { background-color:#F9CB9C; }
.c_brown { background-color:#927F78; }
.c_red { background-color:#D63F40 !important}
.c_white { background-color:#FFF !important}
.f_main { color:#8D0000; }
.f_red { color:#BA1B21 !important; }
.f_orange { color:#F4DA45 !important }
.f_lorange { color:#F9CB9C !important }
.f_white { color:#FFF !important }
.f_purple { color:#7976B1 !important; }
.f_lpurple { color:#CDC9E2; }
.f_black { color:#000; }
.f_green { color:#529067 !important; }
.f_vorange {  color:#EE7700;}
.f_brown { color:#927F78 !important; }
.c_global{ background-color:#E9518E;}
.c_consistency{ background-color:#F39950}
.f_consistency{ color:#F39950 !important}
.f_global{color:#E9518E !important}
.c_global{ background-color:#E9518E;}
.c_consistency{ background-color:#F39950}
.c_blue{ background-color:#2259A8}

.pd10{ padding:10px !important;}

.f_small { font-size:0.9rem !important}
.f_xs { font-size:0.7rem !important; line-height:1.0rem }
.f_big { font-size:2.0rem !important; font-weight:bold}
.align_l{ text-align:left !important }
.align_r{ text-align:right !important}
.align_c{ text-align:center !important}
.align_l tr td{ text-align:left }
.align_r tr td{ text-align:right}
.align_c tr td{ text-align:center}

.bggrade { background: -moz-linear-gradient(bottom, #FFF, transparent);
background: -webkit-linear-gradient(bottom, #FFF, transparent);
background: linear-gradient(to top, #FFF, transparent);}

body{
  font-family:'noto'; margin:0; padding:0; width:100%;
    word-wrap : break-word; overflow-wrap : break-word;
	animation: fadeIn 2s ease 0s 1 normal;
    -webkit-animation: fadeIn 2s ease 0s 1 normal; 
}

@keyframes fadeIn {
    0% {opacity: 0}
    100% {opacity: 1}
}

@-webkit-keyframes fadeIn {
    0% {opacity: 0}
    100% {opacity: 1}
}


.fleft { float:left !important;}
.fright { float:right !important;}
.noshadow { box-shadow:none !important; }
.border-l { border-left:1px solid #333;}
.border-t { border-top:1px solid #333;}
.border-t td { border-top:1px solid #333;}
.border-b { border-bottom:1px solid #FFF; padding-bottom:10px; margin-bottom:10px}
.border-n { border:none !important}
.border-r { border-right:1px solid #333;}
.border { border:1px solid #333;}

.forphone { display:none !important }
.mb { margin-bottom:50px !important}
.mt { margin-top:50px !important}
.clear { clear:both !important}
.subttl { background:url(../img/common/bk_subttl.gif) no-repeat left bottom ; font-family:"notomin" !important; font-size:1.6rem; width:100%; clear:both; text-align:left; margin:50px 0 20px 0; padding:0; text-indent:10px}
.h40{height: 500px}
.noto { font-family:"noto"  !important}
.notomin { font-family:"notomin"  !important}
.f80{ font-size:80% !important}
.m0 { margin:0}
/* ↑共通設定 */

/* ↓ヘッダー */

header { margin:0; }
header ul { margin:0; padding:0; width:100%; list-style:none}
header ul li { margin:0; padding:0 10px 10px 0; font-size:0.7rem;}
header ul li img { margin:20px 0 0 0; max-width:350px; width:95%; min-width:200px}
.header { list-style:none; margin:10px 0 0 0; clear:left}
.header li { float:right; margin:0 0 0 5px}
.header li a { color:#000 }
.header li:before{content:'● ';color: #8D0000;}
/* ↑ヘッダー */


/* ↓footメニュー */
.footmenu { padding:0; margin:50px auto 20px auto; list-style:none; clear:both  }
.footmenu li { padding:0 20px ; border-right:1px solid #333; display:inline-block; width:auto; border-right:1px solid #333; }
.footmenu li a { padding:0 20px; font-size:1.0rem; line-height:1.4rem; color:#333  }
/* ↑footメニュー */
/* ↓footer */
footer dl { display:table; margin:0 auto; padding:50px 0; color:#FFF;}
footer dl dt { display:table-cell; vertical-align:middle; text-align:left; padding:0 0 0 20px; margin:0; box-sizing:border-box }
footer dl dt h1 { font-size:2.0rem; line-height:2.2rem; font-weight:bold; margin:0; padding:0 0 10px 0; font-family:"notomin" }
footer dl dt h2 { font-size:1.1rem; line-height:1.2rem; font-weight:normal; margin:0; padding:0 0 5px 0; }
footer dl dt h3 { font-size:1.2rem; line-height:1.2rem; font-weight:normal; margin:0; padding:0 0 5px 0; }
footer dl dt h4 { font-size:1.0rem; line-height:1.2rem; font-weight:normal; margin:0; padding:0; font-family:"notomin" }
footer dl dt.logo { width:120px}
footer dd {  display:table-cell; vertical-align:middle; padding:0 ; margin:0;text-align:right !important}

/* ↑footer */

/* ↓sub */
.sub { text-align:left; text-shadow: 1px 1px 2px #FFFFFF, 0 0 1em #FFFFFF, 0 0 0.2em #FFFFFF;}
.sub h4 { font-size:2.4rem; line-height:2.6rem; padding:40px 0 0 0; margin:0; color:#8D0000; font-weight:bold !important; font-family:"notomin"; }
.sub h3 { font-size:1.2rem; line-height:1.4rem; padding:0 0 20px 0; margin:0; color:#333; font-weight:bold !important; font-family:"notomin"; }
.sub h2 { font-size:2.6rem; line-height:2.8rem; padding:0 0 20px 0; margin:0; color:#8D0000; font-weight:bold;  font-family:"notomin";} 
.sub h1 {
	font-size: 2.0rem;
	line-height: 2.2rem;
	padding: 0 0 10px 0;
	margin: 0;
	color: #8D0000;
	font-family: "notomin";
} 
.sub h5 { font-size:1.4rem; line-height:1.6rem; padding:10px 0; margin:0; color:#8D0000; font-weight:bold; font-family:"noto"  } 
.sub h6 { font-size:1.6rem; line-height:1.8rem; padding:20px 0; margin:0; color:#8D0000; font-weight:bold; font-family:"notomin"  } 
.sub p { font-size:1.0rem; line-height:1.6rem; padding:0 0 20px 0; margin:0; color:#333; font-family:"notomin"; }

.photo { text-align:left; width:35%; float:left; padding:0; margin:0; }
.photo img { width:95%;}
.photor { width:30%; float:right; padding:0 0 10px 10px; margin:0; }
.caption { font-size:0.9rem; line-height:1.0rem; margin:0 0 20px 0 }
.caption:before{content:'● ';	color:#900; }
.caption1 { font-size:0.9rem; margin:20px 10px 0 0; text-align:left }
.caption1:before{content:'● ';	color:#827AB3; }

.caption2 {  padding:0; font-size:1.1rem; margin:0 0 20px 0 ; text-align:left }
.caption2 li{ padding:0 0 0 20px; margin:0;list-style:none; position: relative;}
.caption2 li:before{content:'● '; color:#E9518E;position: absolute;left: 0; top:0; }

.caption3 { font-size:0.9rem; margin:20px 0 0 0; text-align:left }
.caption3:before{content:'● '; color:#F39950 }
.caption4 { font-size:0.9rem; margin:20px 0 0 0; text-align:left }
.caption4:before{content:'■ '; color:#BA1B21 }

.tableul { display:table; margin:0; padding:0; list-style:none; width:100%; }
.tableul li { display:table-cell; vertical-align:middle; margin:0; padding:10px; box-sizing:border-box; text-align:left }
.course { list-style: none; margin: 0 0 30px 0; padding: 0 0 10px 0; }
.course li { margin:10px 0; padding:10px; font-size:1.4rem; box-sizing:border-box; width:300px; border-radius:10px; font-family:"noto"; text-shadow:none !important}
.course li a { color:#FFF; text-align:center; width:270px; display:block; font-weight:bold !important}
.course li:before{content:'>>'; color:#FFF; width:30px; font-size:20px; float:left}
.tag { line-height:25px; font-size:28px; margin:0; padding:0; text-align:left; font-family:"notomin" }
.tag_text { margin:0 0 30px 0; padding:0; display:table; border-collapse:separate; border-spacing:10px; width:100%}
.tag_text li { margin:0; padding:0; text-align:left; list-style:none; display:table-cell; box-sizing:border-box;}
.tag_text li h2 { margin:0; padding:20px; font-size:1.4rem; line-height:140%; border-bottom:#FFF 3px dotted;}
.tag_text li p { margin:0; padding:20px; font-size:1.0rem; line-height:160% !important; }
.tag_text li h3 { margin:0; padding:0; font-size:1.4rem; line-height:140%; font-weight:normal !important }

.bt { box-shadow:2px 2px 2px #333333; padding:20px; margin:50px auto; width:40%; color:#FFF; font-size:1.6rem; display:block; clear:both; border-radius:10px; }
.form { display:table; width:100%; border-left:1px solid #333; border-bottom:1px solid #333; border-right:1px solid #333; margin:0; }
.form dt { display:table-cell; border-right:1px solid #333; width:20%; padding:10px; text-align:center; background-color:#FEEBDC; box-sizing:border-box; margin:0; vertical-align:middle }
.form dd { display:table-cell; padding:10px; text-align:left; box-sizing:border-box; margin:0; }
.form dd input { height:20px;}
.bt_mini { box-shadow:2px 2px 2px #333333; padding:10px; margin:30px 0; width:40%; color:#333; font-size:1.2rem; display:block; clear:both; border-radius:10px; border:1px solid #666; text-align:center }
.anchor{ list-style:none; padding:0; margin:0; }
.anchor li{ display:inline;}
.anchor li a{ color:#8D0000;}
.info { margin:10vh auto; padding:10vh 0; border-bottom:1px solid #8D0000}
.newslist h1 { font-size:1.8rem ; margin:120px 0 10px 0; padding:0 0 20px 0; border-bottom:#CC3333 1px solid; color:#CC3333; font-weight:bold}
.listhead { float:left}
.newslist ul { list-style:none; margin:0 0 0 20px; padding:0; border-right:1px solid #000;}
.newslist ul li { float:left; padding:0 15px; margin:0; border-left:1px solid #000;  }
.newslist a { color:#CC3333;}
.newslistitem { clear:both; margin:100px 0 10px 0; padding:0; border-top:1px solid #000; min-height:30vh }
.newslistitem dl { border-bottom:1px solid #000; margin:0; padding:10px 0; display:table; width:100%}
.newslistitem dl dt { margin:0; padding:0; display:table-cell; width:200px} 
.newslistitem dl dd { margin:0; padding:0; display:table-cell;} 
.newslistitem dl dd a { font-size:1.2rem; line-height:2.0rem; color:#CC3333; font-weight:bold; }
.newslistitem dl dd p { font-size:1.0rem; line-height:1.2rem; margin:0; padding:10px 0 0 20px}
.newsdetail .date{ margin:50px 0 0 0; padding:10px 0; font-size:0.9rem}
.newsdetail h1{ font-size:1.2rem ; margin:0 0 50px 0; padding:0; color:#CC3333; font-weight:bold}
.newsdetail h2 { font-size:1.8rem ; margin:120px 0 10px 0 !important; padding:0 0 20px 0; border-bottom:#333 1px solid; color:#CC3333; font-weight:bold}
.newsmainphoto { float:right; padding:0 0 20px 20px; width:400px}
.newssubphoto { list-style:none; clear:both; margin:0; padding:0}
.newssubphoto li { display:inline-block; padding:5px; border:#000 1px solid; background:#FFF; width:33%; margin:5px 0; box-sizing:border-box }
.newsdetail a { color:#CC3333; margin:30px 0; clear:both; font-size:1.1rem; border-bottom:1px solid #CC3333}
.teacher_c { background-position:top left; background-repeat:no-repeat; background-size:auto 30px; padding-top:30px; margin-top:50px}
.teacher { padding:30px 0 10px 30px; margin:0; text-align:left; font-size:1.5rem; line-height:1.8rem; border-bottom:#FFF 3px dotted; font-family:"notomin" !important; font-weight:bold}
.teacherphoto { width:40%; vertical-align:bottom}
.notforbigpc { display:none}
.entrance { width:100%;  margin:0; padding:0 30px 0 0; box-sizing:border-box; text-align:left; line-height:1.1rem; }
.entrance li{ vertical-align:top !important; }
.entrance ol{   counter-reset: my-counter; list-style: none; padding: 0 0 0 10px;}
.entrance ol li {  margin-bottom: 10px;  padding-left: 30px;  position: relative;}
.entrance ol li:before {
  content: counter(my-counter);
  counter-increment: my-counter;
  color: #222; border:#222 1px solid;  display: block;
  float: left; line-height: 16px; margin-left: -30px; text-align: center; height: 16px;  width: 16px; border-radius: 50%;}
 
.entrance h1 { border-left:5px solid #CC3333; border-bottom:1px solid #CC3333; padding:10px; color:#CC3333; font-family:"notomin"} 
.entrance table { border-top:1px #000000 solid; border-left:1px #000000 solid; margin:20px 0}
.entrance table tr td { padding:10px; border-right:1px #000000 solid; border-bottom:1px #000000 solid; text-align:center; vertical-align:middle } 
.entrance table tr td dl { margin:0; padding:0; width:100%; clear:both}
.entrance table tr td dl dt { margin:0; padding:0; width:50%; float:left; clear:left; text-align:left;}
.entrance table tr td dl dd{ margin:0; padding:0; width:40%; float:left; text-align:right;}
.scholarship { width:40% !important; padding:15px 0 0 15px !important; margin:80px 0 0 40px !important; background:url(../img/common/kuromaru.jpg) no-repeat top left }
.entrance h2 { border-right: 1px solid #000; border-top:#000 1px solid; margin:0 !important; padding:20px 10px; }
.entrance h3 { padding:0 30px; margin:10px 0; }
.entrance h3:before{content:'■ '; color:#BA1B21;  }
.entrance p { padding:0; margin:30px; text-align:left}
.scholarship2 { width:400px !important; color:#BA1B21 }
.colour li { padding:10px 20px 0 25px !important; }
.colour li p { padding:0 !important; margin:0 !important; color:#000 !important; text-shadow:none !important }
.colour li img { padding:10px 0 !important; margin:0 !important }
.colour2 {  margin-bottom:10px !important}
.colour2 li { padding:15px 25px !important; }
.colour li h5 { font-size:1.2rem !important; text-shadow:none !important; font-family:"notomin"  }
.topttl1 { background-size:100% auto; background-position:top right; background-repeat:no-repeat; margin-top:60px; min-height:300px; padding-left:10px; box-sizing:border-box}
.topttl2 { background-size:100% auto; background-position:top right; background-repeat:no-repeat; margin-top:60px; min-height:300px}
.topttl3 { background-size:100% auto; background-position:top right; background-repeat:no-repeat; margin-top:60px;}
.topttl4 { padding-top:200px;}
.topttl4 h2{ padding-top:50px;}
.campusttl { background-image:url(../img/school/campus.jpg); background-size:auto 400px; background-position:right 80px; background-repeat:no-repeat; padding-top:40px; height:460px }

.campusttl h2 { padding-top:100px !important}
.campus { line-height:1.1rem !important}
.campus ul { padding:10px 0 !important;}
.campus ul li { padding:10px 20px 10px 0 !important;}
.uni { margin:0 auto !important; background-size:auto 300px !important; background-position:right 80px !important; background-repeat:no-repeat !important; background-image:url(../img/school/uniform.jpg); height:400px; }
.uni h2 { padding-top:200px}
.forbigpc { display:block; font-size:1.2rem !important; font-weight:normal !important}
.quarter { width:100% !important; padding:20px 0 !important; margin:0 !important; list-style:none; box-sizing:border-box !important; }
.quarter li { margin:0 !important; display:inline-block !important; box-sizing:border-box !important; vertical-align:top !important}
.quarter1 { width:33%; padding:10px !important;}
.quarter2 { width:66%; padding:10px 0 !important; }
.quarter3 { width:50%; padding:0 10px 0 0 !important; text-align:left; }
.quarter4 { width:49%; padding:0 !important; text-align:right; }
.nengou { font-size:80%;}
.kuromarusuji {background:#333; color:#FFF; border-radius:50% 50%; height:20px; width:20px; line-height:20px; font-size:12px; display:block; text-align:center; float:left; padding:0; margin:0 10px 0 0}
.target { width:80vw; margin:0px auto; padding:10px 0; text-shadow:none !important; font-family:"notomin"}
.target h5 { margin:50px 0 20px 0; padding:0 0 0 20px; border-left:#FCC 5px solid; }
.target h3 { margin:20px 0 0 0 !important; color:#8D0000 }
.target h6 { margin:50px 0 20px 0; }
.bt_taiken { background-color:#900; float:right; display:block; width:120px; color:#FFF; font-size:12px; text-align:center; border-radius:20px 20px
!important; margin:0 0 0 0    }
.bt_taiken_day { background-color:#900; float:right; display:block; width:120px; clear:both; color:#FFF; font-size:12px; text-align:center; border-radius:20px 20px
!important; margin:10px 0 0 0    }
.bt_taiken_no { background-color:#CCC; float:right; display:block; width:120px; color:#FFF; font-size:12px; text-align:center; border-radius:20px 20px
!important; margin:30px 0 0 0    }
.doubleline {/*二重取り消し線*/background-image:url(../img/common/eraser.png);background-repeat:repeat-x;background-position: center;}
	/* ↑sub */ 
#return-top { margin:50px auto; width:350px; display:block; border-radius:10px; padding:10px; color:#FFF; height:30px; clear:both }
 .target p { margin:0; padding:0; text-indent:20px}
 .marukakko {
  position: relative;
  width: 100%; max-width:600px;
  padding:0px 20px; margin:20px 0;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
.marukakko::before,
.marukakko::after {
  position: absolute;
  top: 0;
  content: '';
  width: 20px;
  height: 100%;
  border-radius: 50%;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
.marukakko::before {
  left: 0;
  border-left: 3px solid #555;
}
.marukakko::after {
  right: 0;
  border-right: 3px solid #555;
}
 	/* ↑sub */ 
#error {color:#F00;}
.coursemenu div{ width:300px; border-radius:10px; margin:0 0 10px 0; padding:10px; box-sizing:border-box  }
.coursemenu div a{ font-size:1.4rem; color:#FFF; text-shadow:none; font-weight:bold; width:100%; display:block;} 
.coursemenu div a:before{content:'>>'; color:#FFF; width:30px; font-size:20px; float:left}


.ttl_colour {
  display: inline-block;
  font-size: 20px; line-height:20px;
  padding:5px 0 10px 10px; margin:30px 0 0 0;
  position: relative; text-shadow:none !important; width:98%;
  color: #fff;
  z-index: 1;
}
.ttl_colour::before {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: -1;
  background: #5EB7A4;
  transform: scaleY(1.3) perspective(50px) rotateX(5deg);
  transform-origin: bottom left;
}
.dotline{ border-bottom:#5EB7A4 3px dotted; width:100%; margin:50px 0; clear:both}
.dotlinetb{ border-bottom:#FFF 3px dotted; border-top:#FFF 3px dotted; width:100%; margin:20px 0; padding:20px 0; clear:both}

.container { display: flex; flex-wrap: wrap; justify-content:space-around; clear:both; align-content:flex-start }
.colour_box{ background-color:#F2F0E8; border-bottom: #5EB7A4 solid 5px; margin:20px 0; padding:0; box-sizing:border-box; width:48%; font-family:"notomin"}
.colour_boxttl{ font-size: 1.8rem; line-height:2.6rem; margin:20px;}
.colour_boxtxt{ font-size: 1.2rem; line-height:2.2rem; margin:0 20px 30px 20px; text-indent:1.2rem}

.course_con div{ padding:0; box-sizing:border-box; vertical-align:top; text-align:left; font-size:1.1rem; line-height:1.6rem;  }
.pct10 { width:9%; }
.pct20 { width:19%}
.pct30 { width:29%}
.pct40 { width:39%}
.pct50 { width:49%}
.pct60 { width:59%}
.pct70 { width:69%}
.pct80 { width:80%}
.pct90 { width:90%}

.course_con ol{ padding:0 0 20px 25px; margin:0; box-sizing:border-box}
.teacher_ttl{ font-size:50px !important; line-height:40px !important; padding:0 !important; margin:0 !important; }
.teacher_con{ padding:10px 20px !important; margin:0; box-sizing:border-box}
.teacher_con h2{ font-size:1.6rem; line-height:2.6rem;}

.recordtable{ border-bottom:1px #000000 solid; border-right: 1px solid #000}
.recordtable tr td{ padding:10px 5px !important; vertical-align:top; font-size:0.9rem !important}
.recordtd { min-width:140px;font-size:0.9rem !important; line-height:1.2rem !important; margin:0 !important; padding:0 !important }
.voice_con{ background-color:#928078; border-radius:20px; width:32%; margin-top:30px; color:#FFF !important; text-align:left !important ; box-sizing:border-box;}
.voice_con h2{ border-bottom:#FFF 1px solid; padding:10px 10px 10px 20px !important; margin:0 !important;font-weight:normal !important; font-size:1.4rem !important; line-height:2.0rem !important}  
.voice_photo{ float:right; width:40%; margin:20px }
.voice_prof { margin:0 10px 10px 10px !important; padding:0 !important }
.voice_con p{ margin:20px !important }

.voicettl { position: relative; text-decoration: none; margin:20px 0 0 10px;  padding: 10px 0 0 35px; font-size: 1.4rem; height:40px; vertical-align: middle; background: #927F78; border-radius:10px 10px 0 0; color:#FFF; transition: .4s; width:300px; font-weight:bold; box-sizing:border-box; text-align:left}
.voicettl:after { position: absolute; content: ''; right: 0; top: 0; width: 0;  height: 0;   border: none;  border-left: solid 21px transparent;  border-top: solid 41px white;  z-index: 1; transition: .4s; }

.voice_og{ background-color:#928078; border-radius: 0 20px 20px 20px; margin:0 10px; padding:20px; color:#FFF !important; text-align:left !important ; box-sizing:border-box;}
.voice_og_text{ width:55%;} 
.voice_og_photo{ width:25%;} 
.voice_og_prof{ width:17%;} 
.prof_xs { font-size:0.7rem; line-height:1.0rem}

.newsmainphoto2 { float:right; font-size:0.8rem; margin-right:2%; width:32% !important}
.flexbox{display:flex; flex-wrap:wrap; width:100%; clear:both; list-style:none; margin:0; padding:0 }
.flexbox li{ width:32%;box-sizing:border-box; border:#999 1px solid; padding:5px; position: relative; margin:0 1% 20px 0 ; font-size:0.8rem}

.uni_item { background-color:#F3E9DF; border-radius:30px}
.uni_item h1 { font-family:"notomin"; padding:30px 10px !important; }

.modalbt{ 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%;}
/* コース2021追加分 */
.pconly{ display:block; }
.phoneonly{ display:none; }

.circlebox{display: flex;flex-flow: row wrap; list-style:none;justify-content: space-around; width:100%; margin:0 auto; padding:0; max-width:1000px; }
.circlebox li{ border-radius:50%; width:200px; height:200px; text-align:center;position: relative; margin:0 0 20px 0; padding:0; box-sizing:border-box; }
.circlebox li span { position: absolute;
  display: inline-block; left: 0; top: 50%; -webkit-transform: translateY(-50%);   transform: translateY(-50%); width :100%; text-align:center; font-size:14px; line-height:24px}
.recordtable tr td div {font-size:0.9rem !important; line-height:1.2rem !important;}
.jisseki { display: flex;  flex-flow: row wrap;margin:0 !important; padding:0 !important }
.jisseki div{ width:25%; margin:0 !important; padding:0 0 0 10px !important; box-sizing:border-box }
@media screen and ( max-width:1400px) { .jisseki div{ width:50%;}}
@media screen and ( max-width:1000px) {.circlebox li{ width:160px; height:160px;}.jisseki div{ width:25%;}}
@media screen and ( max-width:780px) {.circlebox li{ width:220px; height:220px; } .jisseki div{ width:50%;}}
@media screen and ( max-width:480px) {.circlebox li{ width:150px; height:150px; }}


@media screen and ( max-width:1300px) {
.voice_con h2{  font-size:1.1rem !important; line-height:1.8rem !important}  
}

@media screen and ( max-width:1250px) {
footer dl { width:100% !important}
.h40{ height:200px}
.newslist ul li {padding:0 10px; }
.newslist ul { margin:0 0 0 20px;}
.forbigpc { display:none}
.notforbigpc { display:block; font-size:1.2rem !important; font-weight:normal !important}
.prof {  width:auto; height:auto; important }
.prof img { height:180px; width:auto}
.course { padding: 0 0 10px 0}
.colour li h5 { font-size:1.1rem !important; }
.uni { background-size:auto 230px !important; }
.uni h2 { padding-top:150px}
}

@media screen and ( max-width:1024px) {
.w80 { width:90%; margin:0 auto; }
header ol { display:none}
menu { display:none}

header { margin:0 !important; padding:0 !important; height:60px;  }
header ul li { display:block; margin:0; padding:0; }
header ul li img { margin:5px; height:50px; width:auto}
.forpc { display:none !important }
.forphone { display:block !important  }
.topmain { background-size:contain; width:100vw; min-height:600px; margin-top:0; !important }
.news { width:50%; }
.footmenu { display:none  }
footer { margin:50px 0 0 0; }
footer dl { display:block;  }
footer dl dt { display:block; float:left }
footer dl dd { display:block; clear:both; width:90%; padding:30px 0 0 0; text-align:left;font-size:0.8rem; line-height:1.2rem;  }

footer dl dt h1 { font-size:1.0rem; line-height:1.2rem; }
footer dl dt h2 { font-size:0.9rem; line-height:1.2rem; }
footer dl dt h3 { font-size:1.0rem; line-height:1.2rem; }
footer dl dt h4 { font-size:0.7rem; line-height:1.2rem; }


.photo { width:100%; float:none; padding:0; margin:0; }
.cont {  width:100%; float:none; padding:0; margin:0;  }
.tableul { display:block;  }
.tableul li { display:block;  padding:10px;   }
.h40{ height:200px}
.w33 { border-collapse:separate;}
.w33 li {width:90%; margin:10px auto }
.w66 { width:90% !important }
.voice { display:block !important; width:80vw;}
.voice li { display:block !important; margin:10px 0 0 0 !important; min-height:260px; clear:both }
.course li:before{ width:6vw;}
.form { display:block; border:none; }
.form dt { display:block; border:none; width:100%; text-align:left }
.form dd  { display:block; border:none; width:100% }
.bt_mini { width:80%; }
.newslist ul { clear:both !important; }
.newslist ul li {padding:0 15px; }
.newslistitem dl dt { width:150px}
.newsmainphoto { width:300px}
.newssubphoto li { width:49% ; }
.flexbox li{ width:49% ; }
.topttl1 {  margin-top:0; min-height:100px}
.topttl2 { margin-top:0 !important; padding-top:40px !important; min-height:200px}
.teacherphoto { width:30%; vertical-align:top}
.voice { width:90vw;}
.sub h2 { font-size:1.2rem; line-height:1.4rem; }
.scholarship { width:100% !important; padding:15px !important; margin:0 !important; background-position:top left }

.campusttl { margin:0 auto !important; padding:0 !important; background-position:top right }
.campusttl h2 { padding-top:150px !important}
.campus ul li { padding:10px 0 !important; margin:0 !important; width:97% !important;  }

.topttl4 { padding-top:0;}
.club2 li h4{ width:32%;  }
.colour li h5 { font-size:1.8rem !important; line-height:2.2rem !important; padding-bottom:10px }
.voice1 { width:90vw; margin:0 auto;}
.uni { margin:0 auto !important; background-position:right top !important; height:350px; }
.uni h2 { padding-top:20px}
.topttl4 h2{ padding-top:0px;}
.target { width:94vw; margin:0 0 0 2vw; } 

.colour_box{ width:98%; }
.pct30 { width:99%}
.pct40 { width:99%}
.pct50 { width:99%;}
.pct60 { width:99%}
.pct70 { width:99%}
.pct10 { width:19%; }
.pct90 { width:80%}

.course_con div{ padding:20px 0;}
.voice_con{  width:99%; }
.voice_con h2{  font-size:1.6rem !important; line-height:2.4rem !important}  
.voice_photo{ width:30%;  }
.voice_con{  font-size:1.3rem;}
.voice_con p{  line-height:2.4rem}
.voice_og{  font-size:1.3rem;  line-height:2.4rem} 
.voice_og_text{  -webkit-order: 3; order: 3; width:95%;} 
.voice_og_photo{ -webkit-order: 1; order:1;width:50%;} 
.voice_og_prof{ -webkit-order: 2; order:2;width:45%; font-size:2.0rem}      
.prof_xs { font-size:1.0rem; line-height:1.4rem}
.menu { width:90vw; margin:0 auto; padding:0}
.gourmet h1 {margin:50px 20px 20px 0 !important;}
.colour3{ width:100%; margin:20px 0; padding:20px 0 0 20px  }
.colour3 img{ position:relative; width:40%; float:right; }
.pconly{ display:none; }
.phoneonly{ display:block; }

.club2020 li{ width:49%;}
.club2020 li h2{ margin:0 0 10px 0 !important; padding:0 !important;  } 
}

@media screen and (max-width:780px) { 
.h40{ height:100px}
.topmain { padding-top:15vh !important;  }
.histrory { margin:30px 0; float:none; width:95%; }
.histroryphoto { width:95%; float:none; clear:both; padding:20px 0 0 0; margin:0; }
.clubrecord { font-size:1.2rem !important; padding:10px 0 0 10px !important; width:300px !important}
.club2 li h4{ width:49%;  }
.voice1 ul {  float:none !important; width:100% !important; }
.campusttl { background-size:contain; }
.campusttl h4 { padding-top:150px !important}
.campusttl h2 { padding-top:40px !important}
.uni { height:auto; background-size:70% auto !important;}
.uni h2 { padding-top:210px}

.quarter li { display:block !important; }
.quarter1 { width:100%; padding:0 !important;}
.quarter2 { width:100%; padding:0 !important; }
.quarter3 { width:100%; padding:0 !important; text-align:left; }
.quarter4 { width:100%; padding:0 !important; text-align:left; }
.nengou { font-size:80%; display:block; width:100%}
.targetbox { display:none; }
.targetbox_phone { display:block; float:right; border:#666 1px solid; padding: 5px; margin:2px 5px; font-size:10px !important; line-height:10px !important; color:#666}

.topttl1 { background-position:0 70px; margin-top:0;}
.coursemenu{  margin:10px 0 30px 0;   }
.coursemenu div{ width:48%; border-radius:10px; margin:0 0 5px 0; padding:10px  }
.coursemenu div a{ font-size:14px; font-weight:normal  } 
.coursemenu div a:before{content:' ' !important; width:0; }
.w45{ width:48% !important; float:left; margin-right:2% !important; }
.down { margin-top:150px}
.down h1 { font-size:1.4rem; line-height:2.0rem  }
.down h5 { font-size:1.2rem; line-height:1.6rem  }
.course_main { background-size:70%; background-position: right 85px}
.menu div { width:90%; margin:10px 0}
.sub h4{ font-size:1.4rem !important; line-height:1.6rem !important}
.sub p { font-size:0.9rem; line-height:1.2rem; }
p { font-size:0.9rem; line-height:1.2rem; }

}
@media screen and (max-width:480px) { 
.w80 { width:94%; }
.news { width:90%; margin:0 auto; padding:10px 0; float:none; clear:both}
.histrory dt { width:100%;  float:none; padding:10px 0 0 0   }
.histrory dd { width:100%; float:none; border-bottom:dotted #999999 1px; padding:10px; box-sizing:border-box }
.h40{ height:10px}
.anchor li{ display:block; margin:0 0 5px 0; text-indent:5px}
.anchor li a{ color:#FFF; background-color:#8D0000; width:90%; display:block}
.anchor li a:hover{ background-color:#F63;}
.time2 { display:block; }
.time2 li { display:block; width:100%;  }
.listhead { float:none !important; clear:both}
.newslistitem dl { display: block;}
.newslistitem dl dt { display: block; width:100%}
.newslistitem dl dd { display: block; width:100%}
.newsmainphoto { width:200px}
.newssubphoto li { width:98% ; display:block }
.sub h4 { font-size:1.8rem; line-height:2.0rem; padding:20px 0 0 0; }
.tag_text { margin:0 0 30px 0 !important; padding:0 !important; display:block;}
.tag_text li { width:90%; display:block; }
.teacherphoto { text-align:center !important; padding-bottom:20px !important }
.teacherphoto img { width:80%; }
.sub h2 { font-size:1.4rem; line-height:1.6rem !important; } 
.entrance table tr td dl dt {width:100%; float:none;}
.entrance table tr td dl dd{ width:100%; float:none;}
.entrance p { padding:0; margin:10px}
.entrance ul li{ padding:0; margin:0 10px }
.entrance h3 { padding:0 10px; line-height:1.6rem !important }
.entrance h1 { line-height:2.0rem !important }
.scholarship2 { padding:10px 0 0 0 !important; margin:0 !important }
.campusttl { padding-top:180px}
.sub h3 { padding:0 !important;}
.forbigpc { display:block; font-size:1.2rem !important; font-weight:normal !important}
.notforbigpc { display:none}
.prof { float:none; margin:20px auto !important; width:90%; }
.prof img { width:100%; height:auto }

.voicettl { width:230px; }
.colour li h5 { font-size:1.2rem !important; line-height:1.6rem !important;  }
.course li:before{ width:15vw;}
.voice { width:94vw !important;}
.voice li { width:98%; margin:10px}
.voice1 ul { width:90%; margin:0 auto;}
.voice1 ul li{ float:none; width:100% !important; padding:0; margin:0; font-size:120% }
.voice1 ul li img{ width:100% !important; }
.voice1 { width:94vw; margin:0 auto;}
.campusttl h4 { padding-top:200px !important}
.campusttl h2 { padding-top:0 !important; margin-top:0;}
.campusttl p { padding-top:0 !important; margin-top:0;}
.uni { background-size:auto 100px !important; height:auto; }
.uni h2 { padding-top:110px}
.target { width:90vw; margin:0 0 0 2vw }  
.newsmainphoto2 { width:200px; font-size:0.6rem; line-height:15px!important}
.flexbox li{ width:100%;}
}
@media screen and (max-width:340px) { 
.coursemenu { margin:10px 0}
.coursemenu div{ width:49%; margin:0 0 5px 0; padding:5px; }
.coursemenu div a{ font-size:12px; font-weight:normal  } 
.w45{ width:49% !important; float:left; margin-right:1% !important; }
}

.ocamline{border-bottom: 2px dotted #333333; padding-bottom: 5px;margin-bottom: 10px;}
.ocamfs{font-size: 14px !important; line-height:20px !important; margin:0 0 15px 15px; }
.ocamfxs{font-size: 12px !important; line-height:18px !important; width:100%; box-sizing:border-box; padding:0 0 5px 20px}
	
.ocam{ width :100%; display:flex; font-size:14px; line-height:20px; padding:0 0 10px 15px; box-sizing:border-box }
.ocam div { min-width:110px }

@media screen and ( max-width:780px) {
.ocam{ display:block;}
}