@charset "UTF-8";

.lede { margin: 70px 0 30px; font-size: 1.43em; font-weight: 500; text-align: center; letter-spacing: 0.05em;}
@media only screen and (max-width: 640px) { .lede { margin: 20px 0; } }

/*---------------------
 * select
---------------------*/
.sp_select_text,
.sp_select_button { display: none; }
#select { margin-bottom: 70px; }
#select .wrap { position: relative; padding: 50px 49px; background-color: #f5f5f5; border: 1px solid #cc0000; letter-spacing: 0.05em;}
#select .wrap:before { position: absolute; bottom: -42px; left: 50%; content: ""; display: block; width: 0; height: 0; margin-left: -55px; border-top: 64px solid #cc0000; border-right: 55px solid transparent; border-left: 55px solid transparent; }
#select .wrap .inner { position: relative; }
#select .wrap .inner + .inner { margin-top: 40px; }
#select .wrap .inner .set_list { min-height: 60px; }
#select .wrap .inner .set_list input,
#select .wrap .inner .set_list label{ cursor: pointer; }
#select .wrap .inner .loader { padding: 30px 0; }
#select .wrap .inner .label { position: relative; margin-bottom: 15px; text-align: center; }
#select .wrap .inner .label:before { position: absolute; top: 50%; left: 0; display: block; content: ""; width: 100%; height: 1px; background-color: #ccc; }
#select .wrap .inner .label span { position: relative; padding: 0 10px; background-color: #f5f5f5; color: #cc0000; font-size: 128.572%; font-weight: 600; }
#select .wrap .inner .ex { position: absolute; right: 0; margin-top: -0.5em; }
#select .wrap .inner ul.list li { position: relative; display: inline-block; margin: 15px 20px 0 0; padding-right: 20px; border-right: 1px solid #d9d9d9; letter-spacing: 0.05em; }
#select .wrap .inner ul.list li:first-child { display: block; margin: 0 calc(100% - 5em) 0 0; padding-right: 0; border-right: none; }
#select .wrap .inner ul.list li:last-child { margin-right: 0; padding-right: 0; border-right: none; }
#select .wrap .inner ul.list li input[type="radio"] { position: absolute; top: 1px; opacity: 0; z-index: 1; -webkit-appearance: none; -moz-appearance: none; appearance: none; width: 18px; height: 18px; -webkit-border-radius: 9px; border-radius: 9px; vertical-align: middle; }
#select .wrap .inner ul.list li input[type="radio"] + em { position: relative; top: -1px; display: inline-block; width: 18px; height: 18px; margin-right: 5px; background-color: #fff; border: 1px solid #b2b2b2; -webkit-border-radius: 9px; border-radius: 9px; vertical-align: middle; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }
#select .wrap .inner ul.list li input[type="radio"] + em:before { position: absolute; top: 50%; left: 50%; display: none; content: ""; width: 8px; height: 8px; margin: -4px 0 0 -4px; background-color: #cc0000; -webkit-border-radius: 4px; border-radius: 4px; }
#select .wrap .inner ul.list li input[type="radio"]:checked + em:before { display: inline-block; }
#select .wrap .inner select.list { display: none; }
#select .wrap .select_note { margin-top: 30px; text-align: center; }

@media only screen and (max-width: 640px) {
  .sp_select_text { display: block; margin-bottom: 20px; }
  #select { margin-bottom: 60px; }
  .sp_int #select { margin-bottom: 25px; }
  #select .wrap { padding: 30px 19px 35px; }
  #select .wrap:before { display: block; bottom: -32px; margin-left: -40px; border-top: 45px solid #cc0000; border-right: 40px solid transparent; border-left: 40px solid transparent; }
  .active #select .wrap:before { display: block; }
  .sp_int #select .wrap:before { display: none; }
  #select .wrap .inner + .inner { margin-top: 25px; }
  #select .wrap .inner .set_list { min-height: 50px; }
  #select .wrap .inner .label { margin-bottom: 10px; }
  #select .wrap .inner .label span { font-size: 114.286%; }
  #select .wrap .inner .ex { position: static;margin-top: 20px; }
  #select .wrap .inner ul.list { display: none; }
  #select .wrap .inner select.list { -webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;display: block; width: 100%; -webkit-appearance: none; -moz-appearance: none; appearance: none; padding: 10px 35px 10px 15px; background: url(/saiyo/graduates/shared/img/arr_select_@2x.png) #fff no-repeat right center; background-size: 29px auto; border: 1px solid #d9d9d9; -webkit-border-radius: 0; border-radius: 0; font-size: 114.286%; font-weight: 500; }
  #select .wrap .inner select.list::-ms-expand { display: none; }
  #select .wrap .select_note { display: none; }
  #select .wrap .sp_select_button { display: block; width: 100%; margin-top: 20px; padding-top: 20px; border-top: 1px solid #ccc; }
  #select .wrap .sp_select_button button { -webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;display: block; width: 100%; -webkit-appearance: none; -moz-appearance: none; appearance: none; padding: 10px; background-color: #cc0000; border: none; color: #fff; font-size: 100%; font-weight: 500; }
  #select .wrap .sp_select_button button span { display: inline-block; padding-left: 25px; background: url(/saiyo/graduates/shared/img/icon_search_@2x.png) no-repeat 0 center; background-size: 16px auto; }
}

/*---------------------
 * results
---------------------*/
#results { height: 300px; margin-bottom: 0; overflow: hidden; }
.active #results { height: auto; margin-bottom: 40px; padding-bottom: 10px; border-bottom: 1px solid #cc0000; }
#results .no_item { opacity: 0; padding: 30px 0 50px; text-align: center; font-size: 128.572%; font-weight: 500; }
#results .result { opacity: 0; }
#results .result + .result { margin-top: 20px; }
#results .result .result_label { position: relative; margin-bottom: 25px; text-align: center; letter-spacing: 0.11em;}
#results .result .result_label:before { position: absolute; top: 50%; left: 0; display: block; content: ""; width: 100%; height: 1px; background-color: #cc0000; }
#results .result .result_label span { position: relative; padding: 0 10px; background-color: #fff; color: #cc0000; font-size: 228.572%; font-weight: 500; }
#results .result .container.clearfix {display: flex;flex-wrap: wrap;}
#results .result .item {width: 23%; margin: 0 0 40px 2%; background-color: #f5f5f5; border: 1px solid #d9d9d9; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }
#results .result .item.meltec.active {order: -1;}
#results .result .item  a { text-decoration: none; color: #333; }
#results .result .item .thumb img { max-width: 100%; vertical-align: bottom; }
#results .result .item .wrap { padding: 10px 14px 20px; border-top: 1px solid #d9d9d9; }
#results .result .item .wrap .name { display: table; width: 100%; }
#results .result .item .wrap .name span { display: table-cell; height: 3em; color: #005e8c; text-align: center; vertical-align: middle; font-size: 114.286%; font-weight: 600; }
#results .result .item .wrap .list { margin-top: 10px; }
#results .result .item .wrap .list + .list { margin-top: 17px; }
#results .result .item .wrap .list dt { color: #cc0000; font-weight: 500; }
#results .result .item .wrap .list dd { margin-top: 5px; padding-top: 5px; border-top: 1px solid #d9d9d9; }
#results .result .item .wrap .list dd .note {color: #cc0000; display: block;}
#results .result .item .wrap .list dd .note {margin-top: 5px;position: relative;padding-left: 1.2em;font-size: 0.85714285714286em;}
#results .result .item .wrap .list dd .note span {position: absolute;left: 0;}
#results .result .item .wrap .name_blank img{margin-left: 5px;}
@media only screen and (min-width: 641px) {
#results .result .container.clearfix {margin-left: -2.04%;}
}
@media only screen and (max-width: 640px) {
  #results { height: 300px; }
  .active #results { height: auto; margin-bottom: 25px; padding-bottom: 25px; border-bottom-width: 2px; }
  .sp_int #results { height: 0; margin-bottom: 0; padding-bottom: 0; border-bottom: none; }
  #results .no_item { padding: 20px 0 40px; font-size: 114.29%; }
  #results .result + .result { margin-top: 60px; }
  #results .result .container + .container { margin-top: 20px; }
  #results .result .result_label { margin-bottom: 15px; }
  #results .result .result_label:before { height: 2px; }
  #results .result .result_label span { font-size: 200%; }
  #results .result .item {width: 100%; margin: 20px 0 0; }
  #results .result .item:first-child { margin-top: 0; }
  #results .result .item .wrap { padding: 18px 19px 20px; }
  #results .result .item .wrap .name span { height: auto; }
  #results .result .item.meltec.active {margin:0 0 20px;}
}

/*-------------------------
 * バナー
--------------------------*/
#banner_wrap .wrap { margin: 0 0 3em; border: 1px solid #ccc; padding: 1em; letter-spacing: 0.05em;}
#banner_wrap .banner { float: left; width: 32%; max-width: 314px; margin-right: 3%; }
#banner_wrap .banner img { max-width: 100%; }

@media only screen and (max-width: 640px) {
  #banner_wrap { margin: 0 0 15px; }
  #banner_wrap .wrap { margin: 0; }
	#banner_wrap .banner { float: none; width: 100%; max-width: inherit; margin: 0 0 1.5em; }
}