@charset "utf-8";


header.list_header{
width: 100%;
margin: 0px auto 20px auto;
background: #fff;
padding: 0px 3% 0px 3%;
}

div.container{
/*background: #f5f3f0*/
}

/*--------------------breadcrumb--------------------*/

ol {
width: 100%;
padding: 10px 0 10px 0;
border-bottom: solid 1px #efefef;
margin-bottom: 20px;
font-size: 10px!important;
}

ol li{
display:inline-block;
vertical-align: middle;
}

ol li:after{
content: '»';
font-size: 10px;
margin: 0px 3px 0px 3px;
color:#000
}

ol li:last-child:after{
content: '';
display: none;
}

ol li a {
text-decoration: none;
color: #666;

}

h1.list{
font-size:14px;
text-align: center;
color:#ff6e9b;
margin-bottom: 10px
}

h4.list{
font-size:12px;
color: #888;
line-height: 1.4;
}

/*--------------------list_detail-------------------*/

div.list_page_detail_mobile{
width: 94%;
background: #fff;
margin: 0px auto 15px auto;
border-radius: 10px;
overflow: hidden;
box-shadow: 0 1px 1.5px rgba(0,0,0,.15);
}

li.list_page_detail_mobile_title{
width: 64px;
padding: 8px 0px 8px 0px;
background: #ff6e9b;
text-align: center;
border-bottom: solid 1px #fff
}

img.list_page_detail_mobile_title{
width: 22px;
margin: 0px auto 5px auto;
}

p.list_page_detail_mobile_title{
font-size:11px;
color:#fff
}

li.list_page_detail_mobile{
border-bottom: solid 1px #ccc;
padding-left: 10px;
padding-right: 10px
}

a.list_page_detail_mobile{
display: block;
width: 100%;
position: relative
}

a.thinly{
color: #b0b0b5;
}

a.list_page_detail_mobile:after{
content: "選択→";
position: absolute;
color:#ff6e9b;
right: 10px
}

label.list_page_detail_mobile{
width: 85%;
height: 40px;
border:solid 1px #ccc;
border-right: none;
border-top-left-radius: 20px;
border-bottom-left-radius: 20px;
display: inline-block;
overflow: hidden;
vertical-align: middle
}

label.list_page_detail_mobile_submit{
width: 15%;
height: 40px;
border:solid 1px #ccc;
border-left: none;
border-top-right-radius: 20px;
border-bottom-right-radius: 20px;
display: inline-block;
vertical-align: middle;
overflow: hidden
}

label.list_page_detail_mobile_submit input[type="submit"]{
width: 100%;
height: 40px;
color: transparent;
background: #fff url(../img/icon/search_gray.png) no-repeat center;
background-size: 20px;
border-top-right-radius: 20px;
border-bottom-right-radius: 20px;
border:none;
}

div.list_page_detail{
display: none;
}

/*--------------------list_page_detail_right-------------------*/

div.list_page_detail_right{
width: 300px
}

div.search_results{
width: 100%;
padding: 10px;
border: 1px solid #f9d498;
background: #fff2d8;
border-radius: 6px;
margin-bottom: 10px
}

article.search_results{
background: #fff;
padding: 10px;
margin-bottom: 10px
}

h3.search_results{
color:#666;
font-size:13px;
}

h3.search_results:first-of-type{
margin-bottom: 10px
}

img.search_results_icon{
width: 24px;
display: inline-block;
vertical-align: middle;
margin-right: 5px
}

p.search_results{
font-size:26px;
color: #ff6e9b;
text-align: right;
}

p.search_results small{
color:#666;
font-size:13px;
margin-left: 5px
}

a.search_results{
font-size:13px;
display: block;
padding: 12px;
color: #444;
border: 1px solid #ccc;
background: #fff;
border-radius: 4px;
text-align: center
}

article.search_results_mail{
border:solid 1px #ccc;
padding: 10px;
border-radius: 6px;
}

section.list_grid_right{
border:solid 1px #ccc;
padding: 5px;
border-radius: 6px;
margin-bottom: 10px;
background: #fff
}

h2.list_grid_right_keep{
padding: 10px 0px 10px 0px;
background: #ffefd9;
text-align: center;
font-size:14px;
margin-bottom: 15px
}

h2.list_grid_right_keep span{
display: inline-block;
margin: 0px 5px 0px 5px;
font-size:26px;
color:#ff6e9b;
}

h2.list_grid_right{
padding: 10px 0px 10px 0px;
background: #f2f2f2;
text-align: center;
font-size:14px;
margin-bottom: 15px
}

article.list_grid_right{
width: 94%;
margin: 0px auto;
}

h3.list_grid_right_keep{
font-size:13px;
color:#666;
margin-bottom: 10px
}

h4.list_grid_right_keep{
font-size:12px;
color:#999;
line-height: 1.4
}

a.list_grid_right{
width: 94%;
margin: 0px auto;
display: block;
border-bottom: solid 1px #ccc;
padding: 10px 0px 10px 0px;
position: relative
}

a.list_grid_right:after{
content: "";
width: 12px;
height: 12px;
display: block;
position: absolute;
top:50%;
transform: translateY(-50%);
right: 0px;
background: url(../img/icon/arrow_gray.png) no-repeat center;
background-size: 12px;
}

h3.list_grid_right{
font-size:13px;
color:#666;
margin-bottom: 10px
}

h3.list_grid_right span{
display: inline-block;
margin: 0px 5px 0px 5px;
color:#ff6e9b;
}

h4.list_grid_right{
color:#ff6e9b;
font-size:13px;
text-decoration: underline;
}

ul.list_grid_right{
margin-top: 10px;
}

li.list_grid_right_image{
width:20%
}

li.list_grid_right{
padding-left: 10px;
}

p.list_grid_right{
font-size:11px;
color:#666
}

/*--------------------list_article--------------------*/

div.grid_left {
background: transparent;
}

article.list_article{
width: 94%;
margin: 0px auto 15px auto;
background: #fff;
padding: 15px;
color:#444;
border-radius: 10px;
position: relative;
overflow: hidden
}

div.list_article_icon{
display: flex;
align-items: center;
justify-content: flex-start;
margin-bottom: 10px;
flex-wrap:wrap
}

div.list_article_icon p{
padding: 0 5px;
font-size: 10px;
line-height: 1.5;
border: 1px solid #e8e8e2;
border-radius: 10px;
margin-bottom: 5px;
}

p.new_recruit{
color: #fff;
font-size: 11px;
border-color: #ffc832!important;
background-color: #ffc832;
}

img.list_article_icon{
display: none;
}

ul.list_article_detail{
margin-bottom: 10px;
}

li.list_article_detail_image{
width: 20%;
vertical-align: top;
}

li.list_article_detail_title{
width: 80%;
padding-left: 15px;
vertical-align: top;
}

h4.list_article_detail{
font-size:12px;
color:#ff6e9b;;
margin-bottom: 10px
}

h3.list_article_detail{
font-size:16px;
color:#000;
line-height: 1.4;
margin-bottom: 5px
}

p.list_article_detail{
font-size:12px;
color:#222;
font-weight: 400
}

li.list_article_detail_link{
display: none;
}

a.list_article_detail_link{
display: block;
width: 140px;
text-align: center;
margin: 0px auto;
font-size:13px;
position: relative;
padding: 5px 15px 5px 5px;
color: #4ba82f;
border: 1px solid #ccc;
box-shadow: 0 -1px 0 #ccc inset;
background: #fff;
font-weight: 700;
border-radius: 6px;
background: url(../img/icon/arrow_green.png) no-repeat center right 10px;
background-size: 12px
}

ul.list_article_memo{
padding: 10px 0px 10px 0px;
border-bottom: dotted 1px #ccc;
font-size:13px;
}

li.list_article_memo_left{
width: 15%
}

div.list_article_benefits{
display: flex;
align-items: center;
justify-content: flex-start;
border-bottom: dotted 1px #ccc;
padding: 10px 0px 10px 0px;
flex-wrap:wrap;
margin-bottom: 10px
}

p.list_article_benefits{
margin-right: 5px;
padding: 2px;
border: 1px solid #e8e8e2;
border-radius: 4px;
font-size:10px;
font-weight: 400;
margin-bottom: 5px
}

div.barometer{
display: flex;
align-items: center;
margin-bottom: 10px
}

p.barometer{
font-size:12px;
color:#999;
margin-right: 5px;

background-size: 14px;

}

ul.barometer{
width: 46%;
background: #fff;
border:solid 1px #ccc;
border-radius: 2px
}

ul.barometer li{
height: 20px;
background: #efefef;
border:solid 1px #fff
}

li.orange{
background: #ffbb69!important
}

p.aim{
display: block;
position: relative;
padding: 2px 10px 2px 10px;
color: #fff;
font-size: 11px;
line-height: 1.2;
background: #aaa;
border-radius: 4px;
margin-left: 10px;
margin-right: 10px
}

p.aim:before{
content: "";
position: absolute;
top: 50%;
left: -6px;
margin-top: -5px;
border-top: solid 5px transparent;
border-right: solid 8px #aaa;
border-bottom: solid 5px transparent;
}

p.number_of_people{
display: none;
}

div.list_article_footer{
display: flex;
align-items: center;
justify-content: space-between
}

a.list_article_keep{
width: 49%;
color: #543535;
font-size: 15px;
padding: 10px;
border: 1px solid #ccc;
box-shadow: 0 -1px 0 #ccc inset;
text-shadow: 1px 1px 0 #fff;
font-weight: 700;
text-align: center;
background: linear-gradient(to bottom,#fff 0,#f1f1f1 100%);
border-radius: 6px;
}

a.list_article_keep:before{
content: "";
width: 16px;
height: 16px;
background: url(../img/icon/star.png) no-repeat center;
background-size:16px;
display: inline-block;
margin-right: 5px;
position: relative;
top:2px
}

a.list_article_tel{
display: none;
}

a.list_article_translation{
width: 48%;
font-size: 15px;
padding: 9px;
color: #fff;
box-shadow: 0 -1px 0 #ff6e9b inset;
text-shadow: 0 1px 2px rgba(0,0,0,.3);
font-weight: 700;
border-radius: 6px;
background: #ff6e9b;
text-align: center;
}

a.list_article_translation:before{
content: "";
width: 24px;
height: 24px;
display: inline-block;
vertical-align: middle;
margin-right: 5px;
background: url(../img/icon/mobile.png) no-repeat center;
background-size: 100%;
}

/*--------------------job page--------------------*/

div.job_container{
background: #fff;
margin-top: 105px
}

section.job_header{
padding: 20px 0px 20px 0px;
border-bottom: solid 1px #dcdcdc;
margin-bottom: 30px
}

h1.job_header{
color: #ff6e9b;
font-size:13px;
margin-bottom: 10px
}

h3.job_header{
font-size:16px;
line-height: 1.4;
margin-bottom: 15px
}

ul.job_header_slide {
width: 60vw;
margin: 0px auto
}

h4.job_header{
text-align: center;
font-size:12px;
margin-bottom: 15px
}

div.job_header_movie{
width: 90%;
margin: 0px auto;
display: flex;
align-items: center;
justify-content: space-between;
margin-bottom: 15px
}

h5.job_header_movie{
font-size:14px
}

a.job_header_movie{
color:#ff6e9b;
text-decoration: underline;
font-size:14px
}

a.job_header_offer{
width: 94%;
text-align: center;
border-radius: 6px;
margin: 0px auto 10px auto;
font-size:16px;
display: block;
padding: 15px 0px 15px 10px;
color: #fff;
background: #ff6e9b url("../img/icon/mobile.png") no-repeat center left 55px;
background-size: 35px
}

div.job_header_offer{
width: 94%;
margin: 0px auto;
display: flex;
align-items: center;
justify-content: space-between
}

a.job_header_offer_tel{
width: 49%;
color: #61c850;
border: solid 1px #61c850;
background: #fff;
border-radius: 6px;
text-align: center;
height: 54px;
padding-top: 6px
}

h4.job_header_offer_tel{
font-size:18px;
}

h4.job_header_offer_tel:before{
content: "";
width: 22px;
height: 22px;
background: url(../img/icon/icon0053.png) no-repeat;
background-size: 100%;
display: inline-block;
margin-right: 5px;
vertical-align: middle
}

p.job_header_offer_tel{
font-size:12px;
}

a.job_header_offer_keep{
width: 49%;
color: #13131e;
border: solid 1px #bcbcb3;
border-radius: 6px;
text-align: center;
height: 54px;
font-size:16px;
line-height: 50px;
text-indent: 14px;
background: url(../img/icon/star.png) no-repeat center left 25px;
background-size: 22px;
box-shadow: 0px 1px 1px #bcbcb3
}


ul.job{
margin-bottom: 15px;
display: flex;
}

ul.job_space,ul.job_space li{
display: block;
}

ul.job_space{
margin-bottom: 30px;
border-bottom: solid 1px #dcdcdc
}

li.job_left{
display: block;
padding: 0px 3% 0px 3%
}

li.job_right{
display: none;
}

li.job_space_title{
margin-bottom: 15px
}

p.job_space_title_image{
width: 24px;
height: 24px;
display: inline-block;
border-radius: 12px;
vertical-align: middle;
margin-right: 5px;
position: relative
}

p.job_space_title_image img{
width: 22px;
position: absolute;
top:50%;
left: 50%;
transform: translate(-50%,-50%)
}

h3.job_space_title{
font-size:15px;
color:#ff6e9b;
display: inline-block;
vertical-align: middle
}

h4.job_space{
font-size:14px;
}

h4.gray{
color:#888
}

h5.job_space{
padding-top: 15px;
font-size:13px;
font-weight: 400;
line-height: 1.4
}

li.job_space{
padding-bottom: 30px;
font-size:13px;
}

div.job_barometer{
margin: 0px auto 15px auto;
border: 1px solid #ccc;
padding: 10px;
border-radius: 4px;
}

section.job_space{
width: 94%;
margin: 0px auto;
}

h3.job_space{
font-size: 18px;
margin-bottom: 15px;
}

div.job_space{
border: 1px solid #ccc;
overflow: hidden;
border-radius: 4px;
margin-bottom: 15px;
padding: 15px
}

h3.job_space:before{
content: "";
width: 7px;
height: 18px;
display: inline-block;
background: #ff6e9b;
margin-right: 5px;
vertical-align: middle;
}

/*--------------------job movie--------------------*/

section.job_space_movie{
width: 94%;
margin: 0px auto;
border: 1px solid #ff6e9b;
border-radius: 4px;
margin-bottom: 15px
}

h3.job_space_movie{
padding: 8px 10px;
color: #fff;
font-size: 16px;
background: #ff6e9b url(../img/icon/job_page_movie.png) no-repeat center left 10px;
text-indent: 25px;
background-size: 22px;
margin-bottom: 15px
}

ul.job_space_movie{
width: 100%;
margin: 0px auto;
display: block;
}

ul.job_space_movie li{
display: block;
}

video.job_space_movie{
width: 84%;
margin: 0px auto;
display: block;
max-height: 200px;
}

li.job_space_movie_right{
padding: 15px
}

h3.job_space_movie_right{
    font-size:18px;
    line-height: 1.4;
    border-bottom: solid 1px #ccc;
    padding-bottom: 10px;
    margin-bottom: 10px;
    max-height: 80px;
    overflow-y: auto;
}

h4.job_space_movie_right{
    font-size:14px;
    line-height: 1.5;
    font-weight: 400;
    max-height: 150px;
    overflow-y: auto;
}

div.job_image{
margin-bottom: 15px
}

p.job_image{
margin-bottom: 10px;
padding: 2px;
border: 1px solid #ccc;
}

h3.job_image{
text-align: center;
font-size:11px;
margin-bottom: 10px
}

div.job_image_thumbnail{
display: flex;
align-items: flex-start;
justify-content: space-between
}

img.job_image_thumbnail{
width: 33%;
padding: 2px;
border: 1px solid #fff;
}

img.job_image_thumbnail_select{
border: 1px solid #ccc;
}

article.job_image{
border:solid 1px #ff6e9b;
padding: 40px 10px 10px 10px;
position: relative;
border-radius: 4px;
}

h3.job_image_costume{
width: 100%;
position: absolute;
top:0px;
left: 0px;
background: #ff6e9b;
color:#fff;
font-size:14px;
padding: 7px 0px 7px 10px
}

.is_blur {
    filter: blur(5px);
}

/* 表示切替ボタン */
a.view-mode-btn { text-decoration:none; color:#333; }
a.view-mode-btn.active { background-color:#ff6e9b; color:#fff; border-color:#ff6e9b; }
ul.button.view_mode_buttons { display:flex; flex-wrap:wrap; gap:6px; padding:8px 10px; }
ul.button.view_mode_buttons .list_detail_area { width:calc(50% - 3px) !important; margin:0; }

/* 衣装グリッド 2列 */
div.costume_grid { width:94%; margin:0 auto; display:flex; flex-wrap:wrap; gap:10px; }
div.costume_card { width:calc(50% - 5px); border-radius:8px; overflow:hidden;
    background:#fff; box-shadow:0 1px 2px rgba(0,0,0,.1); }
div.costume_card a { display:block; text-decoration:none; color:inherit; }
div.costume_card_image { width:100%; aspect-ratio:3/4; overflow:hidden; background:#f5f5f5; }
div.costume_card_image img { width:100%; height:100%; object-fit:cover; }
div.costume_card_info { padding:8px; }
h3.costume_card_name { font-size:11px; color:#ff6e9b; margin-bottom:3px;
    overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
p.costume_card_area { font-size:10px; color:#888; margin-bottom:3px; }
p.costume_card_style { font-size:10px; color:#555; line-height:1.3;
    display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }

/* ===== エリア選択UI - モバイル ===== */
.area-inline-section {
    padding: 8px 10px;
}

.area-gps-btn {
    width: 100%;
    justify-content: center;
    margin-bottom: 10px;
}

.area-popular-scroll {
    margin-bottom: 4px;
}

.area-expand-trigger {
    width: 100%;
    text-align: center;
    box-sizing: border-box;
}

.area-switch-btn {
    display: block;
    text-align: center;
    margin-top: 8px;
    border: 2px solid #ff6e9b;
    border-radius: 5px;
    padding: 8px 10px;
    color: #ff6e9b;
    font-weight: bold;
    background: #fff;
    font-size: 13px;
    text-decoration: none;
}

.area-tab-panel { display: none !important; }
.area-expand-trigger-pc { display: none !important; }
.area-sidebar-panel { display: none !important; }