﻿@charset "utf-8";
.img-responsive {
  display: block;
  height: auto;
  max-width: 100%;
}

/*----text----*/
.textBlack{ color:#333;}
.textDarkred{ color:#ad2a18;}
.textYellow{ color:#FF0;}
.textOrange{ color:#FEA515;}
.textDarkorange{ color:#eb6f00;}
.textWhite{ color:#FFF;}

/*----background color----*/
.bgOrange{ background-color:#FEA515;}
.bgWhite{ background-color:#FFF;}


/*----border color----*/
.borderOrange{ border:#FCD797 solid 1px;}
.borderOrange2{ border:#FCD797 solid 2px;}
.borderOrange3{border-bottom:#F39801 dotted 2px;}

/*----gray for other----*/
.textGray{color:#d2d2d2}/*--main color--*/
.textGray2{color:#CE7C4F}/*--main color 薄い--*/
.borderGray{border:#d2d2d2 solid 1px;}/*--main color--*/
.borderGray2{border:#d2d2d2 solid 2px;}/*--main color--*/
.borderGrayB{border-bottom:#ccc solid 1px;}
.bgGray{ background-color:#ececec;}
.bgGray2{ background-color:#d2d2d2;}
/*----red for other----*/
.textRed{ color:#F00;}
.textBrightred{ color:#ee5150;}
.borderRed{ border:#F00 solid 1px;}
.borderBrightred{  border:#ee5150 solid 1px;}
.bgRed{ background-color:#ffccbf;}
.contBox section{ clear:both;}

/*.contBox*/ .textBold{ font-weight:900}
.contBox .fs180{ font-size:180%;}
.contBox .fs150{ font-size:150%;}
.contBox .fs120{ font-size:120%;}
.contBox .fs110{ font-size:110%;}
.contBox .fs90{ font-size:90%;}
.contBox .fs80{ font-size:80%;}
.contBox .fs70{ font-size:70%;}
.contBox .fs50{ font-size:50%;}

.contBox .textSizeXS{ font-size:10px;}
.contBox .textSizeS{ font-size:12px;}
.contBox .textSizeM{ font-size:16px;}
.contBox .textSizeL{ font-size:20px;}
.contBox .textSizeXL{ font-size:24px;}

@media  only screen and (max-width:768px){
.contBox .textSizeL{ font-size:16px;}
.contBox .textSizeXL{ font-size:20px;}
}


.contBox section{ clear:both;}


.contBox .lineHight150{ line-height:150%;}

/*.contBox*/ .pdtb20{ padding-top:20px; padding-bottom:20px;}
/*.contBox */.pdtb15{ padding-top:15px; padding-bottom:15px;}
.pdtb10, .contBox .pdtb10{ padding-top:10px; padding-bottom:10px;}
.pdtb5, .contBox .pdtb5{ padding-top:5px; padding-bottom:5px;}
/*.contBox*/ .pdtb3{ padding-top:3px; padding-bottom:3px;}

/*.contBox*/ .pdlr30{ padding-left:30px; padding-right:30px;}
/*.contBox*/ .pdlr20{ padding-left:20px; padding-right:20px;}
/*.contBox*/ .pdlr15{ padding-left:15px; padding-right:15px;}
.pdlr10, .contBox .pdlr10{ padding-left:10px; padding-right:10px;}
.pdl10, .contBox .pdl10{ padding-left:10px;}
.pdr10, .contBox .pdr10{ padding-right:10px;}
/*.contBox*/ .pdlr5{ padding-left:5px; padding-right:5px;}
/*.contBox*/ .pdlr3{ padding-left:3px; padding-right:3px;}

/*.contBox*/ .mgt5{ margin-top:10px;}
/*.contBox*/ .mgt10{ margin-top:10px;}
/*.contBox*/ .mgt20{ margin-top:20px;}

/*.contBox*/ .mgb10{ margin-bottom:10px;}
/*.contBox*/ .mgb20{ margin-bottom:20px;}

/*.contBox */.mgl10{ margin-left:10px;}
@media only  screen and (max-width:768px){
/*.contBox*/ .mgl10{ margin-left:0px;}
}
/*.contBox*/ .mgl20{ margin-left:20px;}

/*.contBox*/ .mgr1{ margin-right:1px;}
@media  only screen and (max-width:768px){
/*.contBox*/ .mgr1{ margin-right:0px;}
}

/*.contBox*/ .mgr10{ margin-right:10px;}
@media  only screen and (max-width:768px){
/*.contBox*/ .mgr10{ margin-right:0px;}
}
/*.contBox*/ .mgr20{ margin-right:20px;}


/*.contBox*/ .mgtb10{ margin-top:10px; margin-bottom:10px;}


.contBox h1{ margin-bottom:10px; font-size:32px;}/*--for image--*/
@media only  screen and (max-width:768px){
.contBox h1{ font-size:18px;}/*--for image--*/
}

.contBox h2{ margin:20px auto 10px; font-size:26px; clear:both;}/*--for image--*/
@media  only screen and (max-width:768px){
.contBox h2{ font-size:18px;}
.contBox h2 span.blk{ clear:both; display:block;}

}
.contBox h2.underline {
	padding-bottom: .5em;
	border-bottom: 1px solid #ccc;
}

.contBox h3{ margin:10px auto 10px; font-size:24px; clear:both;}/*--for text--*/
@media  only screen and (max-width:768px){
.contBox h3{ font-size:16px;}/*--for image--*/
}

.contBox h4{ margin-bottom:0;}/*--for text--*/
.contBox h5{ margin-bottom:0;}/*--for text--*/
.contBox h6{ margin-bottom:0;}/*--for text--*/

.contBox p{ margin:5px 0; padding:0; line-height:150%;}


body {
-webkit-print-color-adjust: exact;
}

.btn {
white-space: normal;
}
.flapnone {
white-space: nowrap !important;
}

  max-width: 100%;
  height: auto;
}


  .card-block .tab-content {
    padding: 0;
    border-color: transparent; }
  @media (min-width: 1200px) {
    .card-block {
      padding: 20px; } }
  @media (max-width: 767px) {
    .card-block {
      padding: 10px; } }

.card-block_2 {
  padding: 15px;
  overflow-y:scroll;
  overflow-x:hidden;
  height:250px;
  border: 1px solid #6cb2e6;
 }

.addData{position:relative;}
.addData .addDataIconPlis{z-index:0; position: absolute; top:0; left:0; background:url(../img/btn_pluson.png) top left no-repeat; width:50px; height:50px;}
.addData span.addData01{ display:block; padding:8px;}
.addData a{color:#565656}


td.bg1 {
	font-size:12pt;
	text-align:center;
	vertical-align:middle;
background: #bbd1fd; 
/*background: -moz-linear-gradient(top,  #bbd1fd 0%, #62b0f3 50%, #058ee9 100%);
background: -webkit-linear-gradient(top,  #bbd1fd 0%,#62b0f3 50%,#058ee9 100%);
background: linear-gradient(to bottom,  #bbd1fd 0%,#62b0f3 50%,#058ee9 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#bbd1fd', endColorstr='#058ee9',GradientType=0 );*/
border-radius:8px;
padding:17px 15px;
}

td.bg {
	font-size:12pt;
	text-align:center;
	vertical-align:middle;
	height:60px;
	border-radius:8px;
	padding:17px 15px;
background: #bbd1fd;
/*background: -moz-linear-gradient(top,  #bbd1fd 0%, #62b0f3 50%, #058ee9 100%);
background: -webkit-linear-gradient(top,  #bbd1fd 0%,#62b0f3 50%,#058ee9 100%);
background: linear-gradient(to bottom,  #bbd1fd 0%,#62b0f3 50%,#058ee9 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#bbd1fd', endColorstr='#058ee9',GradientType=0 );*/
}
td.bg a, td.bg1 a{text-decoration:none;}
td.bg a:hover, td.bg1 a:hover{color:#ce0823;}



table.listV {
	border-top:#4458e2 solid 1px;
	/*border-left:#4458e2 solid 1px;*/
	/**/border:#6cb2e6 solid 1px;
	/*border-left:#6cb2e6 solid 1px;*/
	border-collapse: collapse;
	margin:0 auto;box-shadow:none;
}
table.listV th{
	background:/*#4458e2*/#a4cfef;
	/*color:#FFF;*/
	font-weight:normal;
	text-align:center;
	padding:5px 15px;
	border-right:/*#fff solid 1px*/#6cb2e6 solid 1px;
	box-shadow:none;
	border-top:#6cb2e6 solid 1px;
}

/*@media screen and (max-width:400px){

 table thead{ display: block;}
 table thead th{ width:100%;}
 table tr{ display:block;}
 table td{ display: inherit; text-align:left;}
 table td::before{
 	content: attr(data-label);
	float:left;
	font-weight:900;
	display:block;
 }

}*/

table.listV th span{ display:block;}
table.listV tr:first-child{
	border-top:#6cb2e6 solid 1px !important;
}
table.listV th:first-child{
	border-left:#6cb2e6 solid 1px;
}
table.listV th:last-child{
	border-right:#6cb2e6 solid 1px;	
}
table.listV td{
	padding:5px 15px;
	border-right:/*#4458e2 solid 1px*/#6cb2e6 solid 1px;	
	border-left:/*#4458e2 solid 1px*/#6cb2e6 solid 1px;	
	border-bottom:/*#4458e2 solid 1px*/#6cb2e6 solid 1px;	
}

table.listV tr:nth-child(2n+1){
	/*background:#dfe2f5;*/
}


table#gakko {border-collapse:collapse;}
td#gakko {padding:3px; text-align:left;}
span#title {font-size:12pt; font-weight:bolder;}
#pb {page-break-before: always; }
td.tigai1 {border:1px solid #123996; background-color:#406edc; color:#ffffff; text-align:center;font-size:10pt;font-weight:bold;}
td.tigai2 {border:1px solid #123996; background-color:#ffffff; color:#000000; text-align:left; padding:3px 10px;font-size:10pt}



@media print, screen and (min-width: 768px) {
ul.schoolList li{ height:120px;}
ul.schoolList li .school_info2{width:310px;}
ul.schoolList li .school_info2 .school_name{font-size:14px; font-weight:900; padding:0 0 10px 0;}
ul.schoolList li .school_info2 .school_description{font-size:12px; padding:5px 0 0 0;}
ul.schoolList li .school_btnarea{width:100px;}
}

/****************************************
スクロールのスタイル
****************************************/

.scrollbar
{
	margin:0 auto;
	float: left;
	height: 300px;
	width: 100%;
	background: #F5F5F5;
	overflow-y: scroll;
	margin-bottom: 25px;
}

.force-overflow{min-height: 450px;}

.scrollbar::-webkit-scrollbar-track{background-color: #dcdcdc;}

.scrollbar::-webkit-scrollbar{width: 6px; background-color: #F5F5F5;}

.scrollbar::-webkit-scrollbar-thumb{background-color: #0ae; border-radius: 6px;}


/****************************************
学校検索 学校詳細
****************************************/

ul.resultList{margin: 0; padding:0;}
ul.resultList li{list-style:none; margin-bottom:10px;margin-top: 10px; padding:0; border-bottom:#ccc solid 1px;}
ul.resultList li:first-child{margin-top: 0;}
ul.resultList li .resultListColA,ul.resultList li .resultListColB{ margin:0; padding:0;}
ul.resultList li .resultListColA p{ margin:15px 0;}
ul.resultList li .resultListColB img{ border:#d6d6d6 solid 1px; padding:0;}/*--shimazaki 20170920--*/
ul.resultList li .resultListColB button{ margin:10px 0;}




@media print, screen and (min-width: 768px) {
ul.resultList li .resultListColA h3{ margin-left:15px}
ul.resultList li .resultListColA p{ margin:50px 0 0;}
ul.resultList li .resultListColB .photo{ float:right !important;}
}


@media only screen and (max-width: 767px) {
ul.resultList li .resultListColA h3{ margin-left:20px}

ul.resultList li .resultListColB{ margin:0 auto; width:90%;}

ul.resultList li .resultListColA .schoolName{ font-size:110%;}
ul.resultList li .resultListColB img{ /*width:100%;*/}

}


.searchJLS{ text-align:left; margin:0; padding:5px 15px 5px 5px;}
ul.listCol4{ margin:0 0 0 10px; padding:0;}
ul.listCol4 li{ list-style:none; float:left; font-weight:normal; padding:5px 5px 5px 10px; border:#0074bf solid 1px; margin-top: -1px; margin-right: -1px;  line-height:25px;}
ul.listCol4 li input{ margin-right:5px;}

.searchJLS .searchbox{ margin:5px; padding:15px; height: 100%; min-height: 100%;height: auto;}

@media (min-width: 992px) {
.searchJLS .searchbox{ margin-left:15px;}
.searchJLS p.comment{ margin-left:15px;}
}


@media screen and (min-width: 768px) and (max-width: 979px) {
.searchJLS .searchbox{ margin-left:15px;}
.searchJLS p.comment{ margin-left:15px;}
}



@media screen and (max-width: 768px) {
	.searchJLS{ width:100%;}
	ul.listCol4 li{border-right:#0074bf solid 1px;}
	ul.listCol4 li:last-child{border-bottom:#0074bf solid 1px;}
}



/* accordionMerit */

ul.accordionMerit em{
	background:#F9F3E4;
	border-radius:10px;
	font-size:10px;
	color:#F00;
	padding:2px 5px;
	margin-right:5px;
	font-weight:normal;
}
ul.accordionMerit {
	width:100%;
	margin:10px auto 0 5px;
	padding-left:5px;
}
ul.accordionMerit span {
	display:block;
	padding:0px;
	background-position:97% center;
	background-repeat:no-repeat;
	text-align:left;
}
ul.accordionMerit li {
	list-style:none;
	display:inline-block;
	vertical-align:top;
}
ul.accordionMerit ul {display:none; margin:0; padding:0; }
ul.accordionMerit > li {
	font-weight:900;
	font-size:14px;
	font-size:1.4rem;
	position: relative;
	width:100%;
	border:#217fc4 solid 1px;
}
ul.accordionMerit > li > p {
	cursor:pointer;
	padding:0px;
	margin-bottom:0;
}
ul.accordionMerit > li > p span {
	background:#52a0e8 url("../img/icon_openP.png") 98% center no-repeat;
	background-size: 14px auto;
	text-decoration:none;
	padding:0px 0 0 8px;
	font-size: 1.4rem;
	width:100%;
	display:block;
	line-height: 38px;
	color:#FFF;
}
ul.accordionMerit > li > p span.open {
	background:#52a0e8 url("../img/icon_closeP.png") 98% center no-repeat;
	background-size: 14px auto;
}


ul.accordionMerit > li label{ padding:5px;}



@media (min-width: 979px) {
.matchHeight{height:55px;}

ul.accordionMerit .for2nd li{
	display:inline-block;
    vertical-align:top;
	height: 100%;
}
}

ul.accordionMerit > li > ul > li {
	font-weight:normal;
	color:#333;
	padding:5px;
	display:inline-block;
}
ul.accordionMerit li.col-sm-6, ul.accordionMerit li.col-md-3 {
	padding-left:2em;
	text-indent:-1em;
}
ul.accordionMerit > li > ul > li p span {
	background:#78c1ff url("../img/icon_openP.png") 98% center no-repeat;
	background-size: 14px auto;
	text-decoration:none;
	padding:0px 0 0 8px;
	font-size: 1.4rem;
	width:100%;
	display:block;
	line-height: 38px;
	color:#FFF;
}
ul.accordionMerit > li > ul > li p span.open {
	background:#78c1ff url("../img/icon_closeP.png") 98% center no-repeat;
	background-size: 14px auto;
}
ul.accordionMerit > li > ul > li > ul{
	display:-webkit-box;
    display:-moz-box;
    display:-ms-box;
    display:-webkit-flexbox;
    display:-moz-flexbox;
    display:-ms-flexbox;
    display:-webkit-flex;
    display:-moz-flex;
    display:-ms-flex;
    display:flex;
    -webkit-box-lines:multiple;
    -moz-box-lines:multiple;
    -webkit-flex-wrap:wrap;
    -moz-flex-wrap:wrap;
    -ms-flex-wrap:wrap;
    flex-wrap:wrap;
}

ul.schoolSNS { margin:15px 40px 0; padding:0;}
ul.schoolSNS  li{ list-style:none; float:left; margin-right:10px;}

.schoolSNS img{ width:100%;}


.practice{ color:#F00; font-size:12px; border-radius:15px; background:#eee; padding:3px 10px;}

/*----common----*/

.contBox{
 padding:5px 25px;
  -webkit-border-radius: 0px;
          border-radius: 0px;
  background: #fff;
  box-shadow: 1px 1px 5px rgba(126, 142, 159, 0.1);
  margin:20px;
}
@media  only screen and (max-width:767px){
.contBox{
 padding:1px 5px 10px;
 margin-bottom:15px;
  -webkit-border-radius: 0px;
          border-radius: 0px;
  background: #fff;
  box-shadow: 1px 1px 5px rgba(126, 142, 159, 0.1);
  margin:0px 0 15px;
}
}

.contBox section{ clear:both;}

/*.contBox*/ .textBold{ font-weight:900}
.contBox .fs180{ font-size:180%;}
.contBox .fs150{ font-size:150%;}
.contBox .fs120{ font-size:120%;}
.contBox .fs110{ font-size:110%;}
.contBox .fs90{ font-size:90%;}
.contBox .fs80{ font-size:80%;}
.contBox .fs70{ font-size:70%;}
.contBox .fs50{ font-size:50%;}

.contBox .textSizeXS{ font-size:10px;}
.contBox .textSizeS{ font-size:12px;}
.contBox .textSizeM{ font-size:16px;}
.contBox .textSizeL{ font-size:20px;}
.contBox .textSizeXL{ font-size:24px;}

@media  only screen and (max-width:768px){
.contBox .textSizeL{ font-size:16px;}
.contBox .textSizeXL{ font-size:20px;}
}


.contBox section{ clear:both;}


.contBox .lineHight150{ line-height:150%;}

/*.contBox*/ .pdtb20{ padding-top:20px; padding-bottom:20px;}
/*.contBox */.pdtb15{ padding-top:15px; padding-bottom:15px;}
.pdtb10, .contBox .pdtb10{ padding-top:10px; padding-bottom:10px;}
.pdtb5, .contBox .pdtb5{ padding-top:5px; padding-bottom:5px;}
/*.contBox*/ .pdtb3{ padding-top:3px; padding-bottom:3px;}

/*.contBox*/ .pdlr30{ padding-left:30px; padding-right:30px;}
/*.contBox*/ .pdlr20{ padding-left:20px; padding-right:20px;}
/*.contBox*/ .pdlr15{ padding-left:15px; padding-right:15px;}
.pdlr10, .contBox .pdlr10{ padding-left:10px; padding-right:10px;}
.pdl10, .contBox .pdl10{ padding-left:10px;}
.pdr10, .contBox .pdr10{ padding-right:10px;}
/*.contBox*/ .pdlr5{ padding-left:5px; padding-right:5px;}
/*.contBox*/ .pdlr3{ padding-left:3px; padding-right:3px;}

/*.contBox*/ .mgt5{ margin-top:10px;}
/*.contBox*/ .mgt10{ margin-top:10px;}
/*.contBox*/ .mgt20{ margin-top:20px;}

/*.contBox*/ .mgb10{ margin-bottom:10px;}
/*.contBox*/ .mgb20{ margin-bottom:20px;}

/*.contBox */.mgl10{ margin-left:10px;}
@media only  screen and (max-width:768px){
/*.contBox*/ .mgl10{ margin-left:0px;}
}
/*.contBox*/ .mgl20{ margin-left:20px;}

/*.contBox*/ .mgr1{ margin-right:1px;}
@media  only screen and (max-width:768px){
/*.contBox*/ .mgr1{ margin-right:0px;}
}

/*.contBox*/ .mgr10{ margin-right:10px;}
@media  only screen and (max-width:768px){
/*.contBox*/ .mgr10{ margin-right:0px;}
}
/*.contBox*/ .mgr20{ margin-right:20px;}


/*.contBox*/ .mgtb10{ margin-top:10px; margin-bottom:10px;}


.contBox h1{ margin-bottom:10px; font-size:32px;}/*--for image--*/
@media only  screen and (max-width:768px){
.contBox h1{ font-size:18px;}/*--for image--*/
}

.contBox h2{ margin:20px auto 10px; font-size:26px; clear:both;}/*--for image--*/
@media  only screen and (max-width:768px){
.contBox h2{ font-size:18px;}
.contBox h2 span.blk{ clear:both; display:block;}

}
.contBox h2.underline {
	padding-bottom: .5em;
	border-bottom: 1px solid #ccc;
}

.contBox h3{ margin:10px auto 10px; font-size:24px; clear:both;}/*--for text--*/
@media  only screen and (max-width:768px){
.contBox h3{ font-size:16px;}/*--for image--*/
}

.contBox h4{ margin-bottom:0;}/*--for text--*/
.contBox h5{ margin-bottom:0;}/*--for text--*/
.contBox h6{ margin-bottom:0;}/*--for text--*/

.contBox p{ margin:5px 0; padding:0; line-height:150%;}

.stripLines {
  height: 10px;
  background-image: linear-gradient(
    90deg,
    hsla(240, 50%, 50%, 1),
    hsla(240, 0%, 50%, 1) 33.33%,
    hsla(240, 0%, 50%, 0) 33.33%,
    hsla(240, 0%, 50%, 0) 100%);
  background-size: 3px 100%;
  width: 60%;
}

.mainBox{ margin:20px auto; clear:both;}

@media  screen and (min-width:768px){
.mainBoxLeft{ padding-left:0; margin-top:20px;}
.mainBoxRight{ padding-right:0; margin-top:20px;}
}

@media  only screen and (max-width:768px){
.mainBoxLeft{ padding:0; margin-top:20px;}
.mainBoxRight{ padding:0; margin-top:20px; margin-bottom:10px;}
}


.interviewListBox, .interviewListBox ul{ margin:0px; padding:0;}
.interviewListBox li{ font-size:16px; list-style:none; margin:0; padding:0; margin-top: -1px; margin-right: -1px;}
.interviewListBox li a:hover{filter:alpha(opacity=70); -moz-opacity: 0.7; opacity: 0.7;}

@media  screen and (min-width:768px){
.pcDel{ display:none;}
}
@media  screen and (min-width:640px){
.pcDel2{ display:none;}
}
@media  only screen and (max-width:767px){
.spDel{ display:none;}
}
@media print{
.pcDel{display:none;}
}


/*---for button 4piece---*/
@media  screen and (min-width:768px){
.interviewListBox li.fourpiece{ width:25%;}
}
/*---for button 5piece---*/
@media  screen and (min-width:768px){
.interviewListBox li.fivepiece{ width:20%;}
}
/*---for button 6piece---*/
@media  screen and (min-width:768px){
.interviewListBox li.sixpiece{ width:16.6%;}
}
/*---for button 7piece---*/
@media  screen and (min-width:768px){
.interviewListBox li.sevenpiece{ width:14%; text-align:left !important;}
}


.profilPhoto{text-align:center;}

.profileBox{margin:15px auto; padding:15px; text-align:center; font-size:14px;}
.profileBox .nameJp{font-size:150%; font-weight:700;}
.profileBox .name span.san{ font-weight:normal; font-size:90%; /*margin-right:30px;*/}
.profileBox .nameEn{ font-weight:normal;}
.profileBox .age{font-weight:normal; font-size:110%;}
.profileBox .school a{ font-size:110%;}
.profileBox .other{font-weight:normal;}


@media  screen and (min-width:768px){
.photoSP { float:right; margin:0 auto 15px}
}

@media  only screen and (max-width:768px){
.photoSP img {display:block; margin:0 auto 15px}
}

.spirit{ /*font-size:120%; line-height:180%;*//* text-indent:1em;*/}

.headingBox{}

.headingBox dl{ margin-bottom:0;}
.headingBox dt{
text-align:center;
font-size:16px;
padding:10px;
border-radius:8px 8px 0px 0px ;
-moz-border-radius:8px 8px 0px 0px ;
-webkit-border-radius:8px 8px 0px 0px ;
-webkit-background-size: 10px 10px;
-moz-background-size: 10px 10px;
background-size: 10px 10px;
}

.headingBox dd{
font-size:14px;
padding:15px;
margin-top: -2px;
}


@media screen and (min-width: 992px) {
.headingBoxH dd{ height:260px;}
}
@media screen and (min-width: 768px) and (max-width: 991px) {
.headingBoxH dd{ height:280px;}
}

@media screen and (max-width: 767px) {
.headingBoxH dd{ height: auto;}
}

@media print{
.headingBoxH dd{ height:260px;}
}

.headingBox2 li{ background-color:#f1e8fd; border:#FFF solid 5px; border-radius:10px;}
.headingBox2 li dt{ color:#7b59a2; padding:10px 0;}


.headingBox dd span{ display:block;font-size:14px; font-weight:700; padding:0 0 10px;}

.headingBox p.downArrow{font-size:30px; text-align:center;}
@media  only screen and (max-width:767px){
.headingBox p.downArrow{font-size:30px; padding:0; margin:0; text-align:center;}
}


.anythingBox{ margin:15px auto; padding:15px;}
.anythingBox img.pmark{ margin:20px 0 10px 10px;}
.anythingBox .anythingTitle{ font-size:16px; font-weight:900; padding:5px 0;}
.anythingBox .anythingText{ font-size:14px; padding:5px 0;}



@media print, screen and (min-width: 768px) and (max-width: 992px) {
.anythingBox{text-align:left;}
}

@media  only screen and (max-width:767px){
.anythingBox{margin:15px auto; padding:5px 10px; /*text-align:center;*/}
.anythingBox img{ float: none; margin: auto;}
.anythingBox .adviceComment{ font-size:14px; text-align:left;}
}


.anythingBox ul{ margin:0 0 20px; padding:0;}
.anythingBox li{ text-align:left; margin-left:20px;}



ul.marknone li{list-style:none;}

table.responsiveTable { width: 100%; }
.responsiveTable th, .responsiveTable td  { padding: 10px; border:#666 solid 1px;}
.responsiveTable th  { width: 20%; text-align:left;}
/*.responsiveTable th.innner3 { margin:0; padding:5px 0px; text-indent:-3em; padding-left:3em}*/
@media  only screen and (max-width:767px){
    .responsiveTable { margin: 0; }
    .responsiveTable th,
    .responsiveTable td{
    width: 100%;
    display: block;
    border-top: none;
    }
  .responsiveTable tr:first-child th { border-top: 1px solid #666; }
}

.roundBox{
padding:15px;
border-radius:8px ;

-moz-border-radius:8px;
-webkit-border-radius:8px;
-webkit-background-size: 10px 10px;
-moz-background-size: 10px 10px;
background-size: 10px 10px;
}

/*----text----*/
.textBlack{ color:#333;}
.textDarkred{ color:#ad2a18;}
.textYellow{ color:#FF0;}
.textOrange{ color:#FEA515;}
.textDarkorange{ color:#eb6f00;}
.textWhite{ color:#FFF;}

/*----background color----*/
.bgOrange{ background-color:#FEA515;}
.bgWhite{ background-color:#FFF;}


/*----border color----*/
.borderOrange{ border:#FCD797 solid 1px;}
.borderOrange2{ border:#FCD797 solid 2px;}
.borderOrange3{border-bottom:#F39801 dotted 2px;}



/*----gray for other----*/

.textGray{color:#d2d2d2}/*--main color--*/
.textGray2{color:#CE7C4F}/*--main color 薄い--*/
.borderGray{border:#d2d2d2 solid 1px;}/*--main color--*/
.borderGray2{border:#d2d2d2 solid 2px;}/*--main color--*/
.borderGrayB{border-bottom:#ccc solid 1px;}
.bgGray{ background-color:#ececec;}
.bgGray2{ background-color:#d2d2d2;}


/*----red for other----*/
.textRed{ color:#F00;}
.textBrightred{ color:#ee5150;}
.borderRed{ border:#F00 solid 1px;}
.borderBrightred{  border:#ee5150 solid 1px;}
.bgRed{ background-color:#ffccbf;}



/*----green for route1----*/

.textGreen{color:#2AA738}/*--main color--*/
.textGreen2{color:#CE7C4F}/*--main color 薄い--*/
.borderGreen{border:#2AA738 solid 1px;}/*--main color--*/
.borderGreen2{border:#2AA738 solid 2px;}/*--main color--*/
.borderGreen3{border:#E0F0E2 solid 2px;}/*--main color--*/
.borderGreen4{border:#3baa92 solid 2px;}/*--main color--*/
.borderGreenUnder2{border-bottom:#B5E8BA dotted 2px;}/*--main color--*/

.bgGreen{ background-color:#E0F0E2;}
.bgGreen2{ background-color:#2AA738;}
.bgGreen3{ background-color:#3baa92;}
.interviewListBox ul.green li{border:#2AA738 solid 1px;}

.stripGreen {
background-color: #E0F0E2;
background-image: -webkit-gradient(linear, 0 0, 100% 100%,
            color-stop(.25, #B9EABE), color-stop(.25, transparent),
            color-stop(.5, transparent), color-stop(.5, #B9EABE),
            color-stop(.75, #B9EABE), color-stop(.75, transparent),
            to(transparent));
background-image: -webkit-linear-gradient(-45deg, #B9EABE 25%, transparent 25%,
          transparent 50%, #B9EABE 50%, #B9EABE 75%,
          transparent 75%, transparent);
background-image: -moz-linear-gradient(-45deg, #B9EABE 25%, transparent 25%,
          transparent 50%, #B9EABE 50%, #B9EABE 75%,
          transparent 75%, transparent);
background-image: -ms-linear-gradient(-45deg, #B9EABE 25%, transparent 25%,
          transparent 50%, #B9EABE 50%, #B9EABE 75%,
          transparent 75%, transparent);
background-image: -o-linear-gradient(-45deg, #B9EABE 25%, transparent 25%,
          transparent 50%, #B9EABE 50%, #B9EABE 75%,
          transparent 75%, transparent);
background-image: linear-gradient(-45deg, #B9EABE 25%, transparent 25%,
          transparent 50%, #B9EABE 50%, #B9EABE 75%,
          transparent 75%, transparent);
  width: 100%;
}


.headingBox dt.green{
color:#2AA738;
border:1px solid #2AA738;
background-color: #E0F0E2;
background-image: -webkit-gradient(linear, 0 0, 100% 100%,
            color-stop(.25, #B9EABE), color-stop(.25, transparent),
            color-stop(.5, transparent), color-stop(.5, #B9EABE),
            color-stop(.75, #B9EABE), color-stop(.75, transparent),
            to(transparent));
background-image: -webkit-linear-gradient(-45deg, #B9EABE 25%, transparent 25%,
          transparent 50%, #B9EABE 50%, #B9EABE 75%,
          transparent 75%, transparent);
background-image: -moz-linear-gradient(-45deg, #B9EABE 25%, transparent 25%,
          transparent 50%, #B9EABE 50%, #B9EABE 75%,
          transparent 75%, transparent);
background-image: -ms-linear-gradient(-45deg, #B9EABE 25%, transparent 25%,
          transparent 50%, #B9EABE 50%, #B9EABE 75%,
          transparent 75%, transparent);
background-image: -o-linear-gradient(-45deg, #B9EABE 25%, transparent 25%,
          transparent 50%, #B9EABE 50%, #B9EABE 75%,
          transparent 75%, transparent);
background-image: linear-gradient(-45deg, #B9EABE 25%, transparent 25%,
          transparent 50%, #B9EABE 50%, #B9EABE 75%,
          transparent 75%, transparent);
}

.headingBox dd.green{border:1px solid #2AA738; margin-top:-1px;}

.headingBox dd.brown span{color:#2AA738;}



/*----brown for route2----*/

.textBrown{color:#BB654C}/*--main color--*/
.textBrown2{color:#CE7C4F}/*--main color 薄い--*/
.borderBrown{border:#BB654C solid 1px;}/*--main color--*/
.bgBrown{ background-color:#E4E7E1;}
.bgBrown2{ background-color:#BB654C;}
.interviewListBox ul.brown li{border:#BB654C solid 1px;}

.stripBrown {
background-color: #fcf9f8;
background-image: -webkit-gradient(linear, 0 0, 100% 100%,
            color-stop(.25, #f7e9e1), color-stop(.25, transparent),
            color-stop(.5, transparent), color-stop(.5, #f7e9e1),
            color-stop(.75, #f7e9e1), color-stop(.75, transparent),
            to(transparent));
background-image: -webkit-linear-gradient(-45deg, #f7e9e1 25%, transparent 25%,
          transparent 50%, #f7e9e1 50%, #f7e9e1 75%,
          transparent 75%, transparent);
background-image: -moz-linear-gradient(-45deg, #f7e9e1 25%, transparent 25%,
          transparent 50%, #f7e9e1 50%, #f7e9e1 75%,
          transparent 75%, transparent);
background-image: -ms-linear-gradient(-45deg, #f7e9e1 25%, transparent 25%,
          transparent 50%, #f7e9e1 50%, #f7e9e1 75%,
          transparent 75%, transparent);
background-image: -o-linear-gradient(-45deg, #f7e9e1 25%, transparent 25%,
          transparent 50%, #f7e9e1 50%, #f7e9e1 75%,
          transparent 75%, transparent);
background-image: linear-gradient(-45deg, #f7e9e1 25%, transparent 25%,
          transparent 50%, #f7e9e1 50%, #f7e9e1 75%,
          transparent 75%, transparent);
-webkit-background-size: 10px 10px;
-moz-background-size: 10px 10px;
background-size: 10px 10px;
  width: 100%;
}


.headingBox dt.brown{
color:#BB654C;
border:1px solid #BB654C;
background-color: #fcf9f8;
background-image: -webkit-gradient(linear, 0 0, 100% 100%,
            color-stop(.25, #f7e9e1), color-stop(.25, transparent),
            color-stop(.5, transparent), color-stop(.5, #f7e9e1),
            color-stop(.75, #f7e9e1), color-stop(.75, transparent),
            to(transparent));
background-image: -webkit-linear-gradient(-45deg, #f7e9e1 25%, transparent 25%,
          transparent 50%, #f7e9e1 50%, #f7e9e1 75%,
          transparent 75%, transparent);
background-image: -moz-linear-gradient(-45deg, #f7e9e1 25%, transparent 25%,
          transparent 50%, #f7e9e1 50%, #f7e9e1 75%,
          transparent 75%, transparent);
background-image: -ms-linear-gradient(-45deg, #f7e9e1 25%, transparent 25%,
          transparent 50%, #f7e9e1 50%, #f7e9e1 75%,
          transparent 75%, transparent);
background-image: -o-linear-gradient(-45deg, #f7e9e1 25%, transparent 25%,
          transparent 50%, #f7e9e1 50%, #f7e9e1 75%,
          transparent 75%, transparent);
background-image: linear-gradient(-45deg, #f7e9e1 25%, transparent 25%,
          transparent 50%, #f7e9e1 50%, #f7e9e1 75%,
          transparent 75%, transparent);
}

.headingBox dd.brown{border:1px solid #BB654C; margin-top:-1px;}

.headingBox dd.brown span{color:#BB654C;}




/*----blueviolet for route3----*/

.textBlueviolet{color:#5E66AD}/*--main color--*/
.textBlueviolet2{color:#BCC4E4}/*--main color 薄い--*/
.borderBlueviolet{border:#5E66AD solid 1px;}/*--main color--*/
.borderBlueviolet2{border:#BBC4E4 solid 1px;}/*--main color 薄い--*/
.borderBluevioletUnder2{border-bottom:#BBC4E4 dotted 3px;}/*--main color 薄い--*/
.bgBlueviolet{ background-color:#BBC4E4;}
.bgBlueviolet2{ background-color:#5E66AD;}
.bgBlueviolet3{ background-color:#E1E4F9;}
.interviewListBox ul.blueviolet li{border:#5E66AD solid 1px;}

.stripBlueviolet {
background-color: #fafbfd;
background-image: -webkit-gradient(linear, 0 0, 100% 100%,
            color-stop(.25, #e7e8f3), color-stop(.25, transparent),
            color-stop(.5, transparent), color-stop(.5, #e7e8f3),
            color-stop(.75, #e7e8f3), color-stop(.75, transparent),
            to(transparent));
background-image: -webkit-linear-gradient(-45deg, #e7e8f3 25%, transparent 25%,
          transparent 50%, #e7e8f3 50%, #e7e8f3 75%,
          transparent 75%, transparent);
background-image: -moz-linear-gradient(-45deg, #e7e8f3 25%, transparent 25%,
          transparent 50%, #e7e8f3 50%, #e7e8f3 75%,
          transparent 75%, transparent);
background-image: -ms-linear-gradient(-45deg, #e7e8f3 25%, transparent 25%,
          transparent 50%, #e7e8f3 50%, #e7e8f3 75%,
          transparent 75%, transparent);
background-image: -o-linear-gradient(-45deg, #e7e8f3 25%, transparent 25%,
          transparent 50%, #e7e8f3 50%, #e7e8f3 75%,
          transparent 75%, transparent);
background-image: linear-gradient(-45deg, #e7e8f3 25%, transparent 25%,
          transparent 50%, #e7e8f3 50%, #e7e8f3 75%,
          transparent 75%, transparent);
-webkit-background-size: 10px 10px;
-moz-background-size: 10px 10px;
background-size: 10px 10px;
  width: 100%;
}


.headingBox dt.blueviolet{
color:#5D66AE;
border:1px solid #5D66AE;
background-color: #fafbfd;
background-image: -webkit-gradient(linear, 0 0, 100% 100%,
            color-stop(.25, #e7e8f3), color-stop(.25, transparent),
            color-stop(.5, transparent), color-stop(.5, #e7e8f3),
            color-stop(.75, #e7e8f3), color-stop(.75, transparent),
            to(transparent));
background-image: -webkit-linear-gradient(-45deg, #e7e8f3 25%, transparent 25%,
          transparent 50%, #e7e8f3 50%, #e7e8f3 75%,
          transparent 75%, transparent);
background-image: -moz-linear-gradient(-45deg, #e7e8f3 25%, transparent 25%,
          transparent 50%, #e7e8f3 50%, #e7e8f3 75%,
          transparent 75%, transparent);
background-image: -ms-linear-gradient(-45deg, #e7e8f3 25%, transparent 25%,
          transparent 50%, #e7e8f3 50%, #e7e8f3 75%,
          transparent 75%, transparent);
background-image: -o-linear-gradient(-45deg, #e7e8f3 25%, transparent 25%,
          transparent 50%, #e7e8f3 50%, #e7e8f3 75%,
          transparent 75%, transparent);
background-image: linear-gradient(-45deg, #e7e8f3 25%, transparent 25%,
          transparent 50%, #e7e8f3 50%, #e7e8f3 75%,
          transparent 75%, transparent);
}

.headingBox dd.blueviolet{border:1px solid #5D66AE; margin-top:-1px;}

.headingBox dd.blueviolet span{color:#5E66AD;}





/*----Khaki for route4----*/

.textKhaki{color:#C59600}/*--main color--*/
.textKhaki2{color:#F7F0D9}/*--main color 薄い--*/
.borderKhaki{border:#C59600 solid 1px;}/*--main color--*/
.bgKhaki{ background-color:#F7F0D9;}
.bgKhaki2{ background-color:#C59600;}
.interviewListBox ul.khaki li{border:#C59600 solid 1px;}

.stripKhaki {
-webkit-background-size: 10px 10px;
-moz-background-size: 10px 10px;
background-size: 10px 10px;
background-color: #fefdfa;
background-image: -webkit-gradient(linear, 0 0, 100% 100%,
            color-stop(.25, #f7f0d9), color-stop(.25, transparent),
            color-stop(.5, transparent), color-stop(.5, #f7f0d9),
            color-stop(.75, #f7f0d9), color-stop(.75, transparent),
            to(transparent));
background-image: -webkit-linear-gradient(-45deg, #f7f0d9 25%, transparent 25%,
          transparent 50%, #f7f0d9 50%, #f7f0d9 75%,
          transparent 75%, transparent);
background-image: -moz-linear-gradient(-45deg, #f7f0d9 25%, transparent 25%,
          transparent 50%, #f7f0d9 50%, #f7f0d9 75%,
          transparent 75%, transparent);
background-image: -ms-linear-gradient(-45deg, #f7f0d9 25%, transparent 25%,
          transparent 50%, #f7f0d9 50%, #f7f0d9 75%,
          transparent 75%, transparent);
background-image: -o-linear-gradient(-45deg, #f7f0d9 25%, transparent 25%,
          transparent 50%, #f7f0d9 50%, #f7f0d9 75%,
          transparent 75%, transparent);
background-image: linear-gradient(-45deg, #f7f0d9 25%, transparent 25%,
          transparent 50%, #f7f0d9 50%, #f7f0d9 75%,
          transparent 75%, transparent);
width: 100%;
}

.headingBox dt.khaki{
color:#c59600;
border:1px solid #c59600;
background-color: #fefdfa;
background-image: -webkit-gradient(linear, 0 0, 100% 100%,
            color-stop(.25, #f7f0d9), color-stop(.25, transparent),
            color-stop(.5, transparent), color-stop(.5, #f7f0d9),
            color-stop(.75, #f7f0d9), color-stop(.75, transparent),
            to(transparent));
background-image: -webkit-linear-gradient(-45deg, #f7f0d9 25%, transparent 25%,
          transparent 50%, #f7f0d9 50%, #f7f0d9 75%,
          transparent 75%, transparent);
background-image: -moz-linear-gradient(-45deg, #f7f0d9 25%, transparent 25%,
          transparent 50%, #f7f0d9 50%, #f7f0d9 75%,
          transparent 75%, transparent);
background-image: -ms-linear-gradient(-45deg, #f7f0d9 25%, transparent 25%,
          transparent 50%, #f7f0d9 50%, #f7f0d9 75%,
          transparent 75%, transparent);
background-image: -o-linear-gradient(-45deg, #f7f0d9 25%, transparent 25%,
          transparent 50%, #f7f0d9 50%, #f7f0d9 75%,
          transparent 75%, transparent);
background-image: linear-gradient(-45deg, #f7f0d9 25%, transparent 25%,
          transparent 50%, #f7f0d9 50%, #f7f0d9 75%,
          transparent 75%, transparent);
}

.headingBox dd.khaki{border:1px solid #C59600; margin-top:-1px;}

.headingBox dd.khaki span{color:#C59600;}




