@charset "utf-8";
/* CSS Document */
/*****
main.cssと同じ記述もあります
*/

*{box-sizing: border-box;margin: 0;padding: 0;font-family: "Noto Sans JP";font-weight: normal;}
ul{list-style: none;}
#css {width:98%;margin:0 1%;}
.hidden_pc{display: none !important;margin: 0;padding: 0;font-size: 0;}
a {text-decoration: none;}
body{max-width: 1920px;margin: auto;}
.clearfix::after {content: ""; display: block; clear: both;}
/* ヘッダー */
header{background-color: rgba(255,255,255,0.90);display: block;margin: 0;padding: 0;position: fixed;top: 0;width: 100%;overflow: hidden;z-index: 99999;text-align: center;}
header ul{max-width: 1080px;width:100%;margin: 10px auto;color: #595858;overflow: hidden;}
header li{display: inline-block;vertical-align: middle;}
header h1{font-size: 0.8em;font-family: "Noto Sans JP";font-weight: normal;margin: 0 20px 0 90px;}
header h1 a{color:#595858; text-decoration: none;} 
header a.headermailmag{padding: 10px 15px;color: #FFFFFF;background: #788BD4;text-decoration: none;transition: background-color 1s, border-radius 1s;}
header a.headermailmag:hover{
 background: linear-gradient(to bottom right, #788BD4, #F5C0FF);
 background: -moz-linear-gradient(top left, #788BD4, #F5C0FF); 
 background: -webkit-linear-gradient(top left, #788BD4, #F5C0FF); 
 border-radius: 10px;
 transition: background-color 1s, border-radius 2s;
 }
.headertel {color: #788BD4; line-height: 1;}
.headertel p{font-size: 20px; font-weight: bold;}
.headertel span {font-size: 12px;}
/* 大枠 */
div.container{ position: relative;}
/* メインエリア */
main{display: block;width: 1080px;margin: 160px auto;overflow: hidden;}
div.left{float: left; width: 596px; margin-bottom: 65px;}
div.right{float: right; width: 540px; margin-bottom: 65px;}
.space{margin-bottom: 20px;}
div.clearfix{ clear: both;}
div.inbox{width: 100%;margin: auto;padding-top: 40px;position: relative;}
/* タイトルバー */
div.titlebar{
 position: relative;
 padding: 10px 16px;
 margin: 0 0 10px;
 border-radius: 4px;
 background: linear-gradient(to bottom right, rgba(136,173,255,1.0), rgba(227,239,255,1.0));
 background: -moz-linear-gradient(top left, rgba(136,173,255,1.0), rgba(227,239,255,1.0)); 
 background: -webkit-linear-gradient(top left, rgba(136,173,255,1.0), rgba(227,239,255,1.0)); 
 font-size: 1.8em;
 font-family: 'Alegreya Sans', sans-serif;
 color: #ffffff;
 }
div.titlebar i{font-size: 0.6em;font-style: normal;}
/* RECRUIT Nav */
.float_Recruit {
 position: fixed;
 top: 50%;
 right: 5%;
 z-index: 888;
 animation:float_Recruit 3s infinite linear alternate;
 }
@-webkit-keyframes float_Recruit {
 0% {-webkit-transform:translate(0, 0) rotate(-5deg);}
 50% {-webkit-transform:translate(0, -5px) rotate(0deg);}
 100% {-webkit-transform:translate(0, 0)rotate(5deg);}
 }
@keyframes float_Recruit {
 0% {transform:translate(0, 0) rotate(-5deg);}
 50% {transform:translate(0, -5px) rotate(0deg);}
 100% {transform:translate(0, 0)rotate(5deg);}
 }
/* フッター */
footer{background: url("../images/top/footer_wall.jpg") no-repeat top;width:100%;}
footer img{display: block;margin: 0 auto 20px;}
footer ul{margin: 0 auto 40px;text-align: center;}
footer li{display: inline-table;width: 150px;height: 50px;line-height: 50px;background: #82A7FF;border-radius: 20px;vertical-align: middle;text-align: center;margin: 0 10px;}
footer li a{color: #FFFFFF;text-decoration: none;font-size: 1.4em;font-weight: bold;}
footer h2{font-size: 0.8em;font-weight: normal;color: #788BD4;text-align: center;}
footer h2 a {color: #788BD4;}
.footerLogo {width:100px;}

/* ここから下層用記述*/
/*  ---------------------------- TOPに戻る ----------------------------  */
#goto_top {position: fixed; right: 1%; bottom: 1%;}
#goto_top a {width: 60px; height: 60px; border-radius: 50%; background: #788bd4; display: block; color: #fff; text-align: center; line-height: 80px; text-decoration: none;}

div.package{text-align: center;}
div.package img:first-child {width: 100%; height: auto;}

/* ---------------------------- form ---------------------------- */
.form_area {width: 700px; margin: 0 auto 0 auto; padding: 0;}
.form_area p {font-size: 18px; text-align: left; margin: 0 auto 0 auto; padding: 0;}
.name_section {width: 210px; margin: 0 50px 0 0; padding: 0; float: left;}
.name_box {font-size: 16px; color: #000; width: 210px; height: 36px; margin: 0; padding-left: 10px; border: solid 1px #555; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px;}
select {-webkit-appearance: none!important;　-moz-appearance: none!important; appearance: none!important; border: none; outline: none; background: transparent;}
.select_section {width: 210px; margin-right:50px; padding: 0; float: left;}
.select_section select {
  width: 210px;
 -webkit-appearance: button;
    -moz-appearance: button;
    appearance: button;
    text-indent: 1em;
    background:#fff url(../images/select_arrow.png) no-repeat;
    background-size:12px 10px;
    background-position: right 10px center;
    height: 38px;
    line-height: 38px;
    font-size: 15px;
    vertical-align: middle;
    border:1px solid #555;
    margin-bottom:5px;
 -webkit-border-radius: 3px;
 -moz-border-radius: 3px;
}
@-moz-document url-prefix() { /* for firefox */
    .select_section select {
        /*background:none;*/
        background-color: #FFF;
    }
}

.home_section {width: 90px; margin: 0 50px 0 0; padding: 0; text-align: center; float: left;}
.newface_section {width: 40px; margin: 0; padding: 0; text-align: center; float: left;}
label {cursor: pointer;}
.checkbox-input{display: none;}
.checkbox-parts{padding-left: 20px; position:relative; margin-right: 20px;}
.checkbox-parts::before{content: ""; display: block; position: absolute; top: 0; left: 0; width: 20px; height: 20px; border: 1px solid #999; border-radius: 4px;}
.checkbox-input:checked + .checkbox-parts{color: #d01137;}
.checkbox-input:checked + .checkbox-parts::after{content: ""; display: block; position: absolute; top: -5px; left: 5px; width: 12px; height: 20px; transform: rotate(40deg); border-bottom: 3px solid #d01137; border-right: 3px solid #d01137;}
.submit {width: 90px; height: 38px; margin: 20px auto 20px auto; padding: 0;}
.serch_submit {width: 90px; height: 38px; margin: 0 auto 0 auto; padding: 0; font-size: 18px; border: solid 1px #555; background: #fff; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px;}
.variable_banner {text-align:center;}

.search_under {width: 95%; margin: 20px auto 50px auto; padding: 0; display: block;}
.cast_base {width: 1008px; max-width: 100%; margin: 0 auto 40px auto; padding: 0;}
.cast_base a {color: #000;}
.cast_base .cast {width: 180px; height: 340px; margin: 0 36px 40px 36px; padding: 0; float: left; position: relative;}
.cast_base .cast .today {width: 180px; height: 32px; margin: 0; padding: 0;}
.cast_base .cast .today p {width: 180px; font-size: 18px; line-height: 32px; text-align: center; vertical-align: middle; color: #fff; background: #88ADFF; margin: 0; padding: 0;}
.cast_base .cast .photo {width: 180px; height: 240px; margin: 0 0 5px 0; padding: 0;}
.cast_base .cast .photo img {width: 100%; height: auto;}
.cast_base .cast .detail {width: 180px; margin: 0; padding: 0; position: relative;}
.cast_base .cast .detail p {font-size: 18px; line-height: 18px; text-align: left; margin: 0; padding: 2px 0;}
.cast_base .cast .detail .name {color: #88ADFF; font-weight: bold;}
.cast_base .cast .detail .data {font-size: 14px!important; line-height: 16px;}
.cast_base .cast .detail .beginner{width:40px; height:40px; margin: 0; padding: 0; background:url(../images/icon_newface.png);background-size: contain;text-indent:100%; white-space:nowrap; overflow:hidden; display:block; vertical-align: middle; position: absolute; right: 2%; top: 0;}
.cast_link {width: 936px; margin: 40px auto 30px auto; padding: 0; text-align: right;}
.prev a {color:#fff; font-weight:bold;display: block;}
.next a {color:#fff; font-weight:bold;display: block;}

.next {display: inline-block; background: #788bd4;width: 80px;height: 80px;border-radius: 50%;text-align: 80px;line-height: 80px;}
.prev {display: inline-block; background: #92b2ff;width: 80px;height: 80px;border-radius: 50%;text-align: 80px;line-height: 80px; margin-right: 10px;}


/******* javascript関連　*/
/*drawer setting 下層用位置固定*/
nav{margin-top: 73px;}
.drawer{display: flex;flex-direction: row;align-items: center;justify-content: space-between;position: relative;height: 70px;padding: 0 1em;}
.navbar_toggle{z-index:999;}
.navbar_toggle_icon {position: relative;display: block;height: 2px;width: 30px;background: #5c6b80;-webkit-transition: ease .5s;transition: ease .5s;}
.navbar_toggle_icon:nth-child(1) {top: 0;}
.navbar_toggle_icon:nth-child(2) {margin: 8px 0;}
.navbar_toggle_icon:nth-child(3) {top: 0;}
.navbar_toggle.open .navbar_toggle_icon:nth-child(1) {top: 10px;-webkit-transform: rotate(45deg);transform: rotate(45deg);}
.navbar_toggle.open .navbar_toggle_icon:nth-child(2) {-webkit-transform: translateY(-50%);transform: translateY(-50%);opacity: 0;}
.navbar_toggle.open .navbar_toggle_icon:nth-child(3) {top: -10px;-webkit-transform: rotate(-45deg);transform: rotate(-45deg);}
.menu{-webkit-transform: translateX(-100%);transform: translateX(-100%);-webkit-transition:ease .5s;transition:ease .5s;z-index:999;}
.menu ul li{padding: 2em;border-bottom: 1px solid #CCC;}
.menu ul li a{color: #FFFFFF;text-decoration: none;}
 .menu ul li a.active{color: #3F6EB3;}
.menu.open {-webkit-transform:translateX(0);transform:translateX(0);overflow-y: auto;-webkit-overflow-scrolling: touch;}
nav{
 width: 100%;
 height: 75px;
 display: flex;
 flex-direction: row;
 background: -moz-linear-gradient(top, rgba(138,174,221,0.83), rgba(236,224,181,0.83));
 background: -webkit-linear-gradient(top, rgba(138,174,221,0.83), rgba(236,224,181,0.83));
 background: linear-gradient(to bottom, rgba(138,174,221,0.83), rgba(236,224,181,0.83));
 z-index:777;
 top: 0;
 position: fixed;
 }
.navbar_toggle{display: none;}
.menu{width: 100%;-webkit-transform: translateX(0);transform: translateX(0);}
.menu ul{height: 75px;display: flex;flex-wrap: wrap;justify-content: center;align-items: center;}
.menu ul li{padding: 0 1em;border-bottom: none;border-left: 1px solid #FFFFFF;border-right: 1px solid #FFFFFF;}
.menu ul li+ li {border-left: 0;border-right: 1px solid #FFFFFF;}

.footer_menu li {background: transparent; width: inherit;}
.footer_menu li a {font-size: 1em; color: #82A7FF;}

.breadcrumb {  margin: 0;  padding: 0;  list-style: none;}
.breadcrumb li {  display: inline;/*横に並ぶように*/  list-style: none;  font-weight: bold;/*太字*/}
.breadcrumb li:after {/* >を表示*/  content: '>';  padding: 0 0.2em;  color: #555;}
.breadcrumb li:last-child:after {  content: '';}
.breadcrumb li a {  text-decoration: none;  color: #52b5ee;/*色*/}
.breadcrumb li a:hover {  text-decoration: underline;}