@charset "UTF-8";


/** ---------------------------------------
html
--------------------------------------- */
html{font-size:16px;}
	
/** ---------------------------------------
body
--------------------------------------- */
body{
	margin: 0; 
	padding: 0;
	min-width: 1300px;
	line-height: 1.8; 
	letter-spacing: 0.1rem; 
	color: #384359;
	font-size: 14px;
	font-family: Noto Sans JP, "ヒラギノ角ゴシック", "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN W3", メイリオ, sans-serif;
	background: #F0F1F4;
}

a{color:#384359;}

/** ---------------------------------------
wapper
--------------------------------------- */
.wrapper{
	display: block;
	max-width: 1000px;
	margin: 0 auto;
	padding: 0 1rem;
}
	
.wrapper_background_white{
margin-bottom: 1rem;
background: #fff;
}



/** ---------------------------------------
input
--------------------------------------- */
form{margin: 0; padding: 0;}
input,textarea,select,button{font-family: inherit;}
input{box-sizing: border-box; border: 1px solid #ddd; font-size: 14px; border-radius:10px; -webkit-border-radius:10px; -moz-border-radius:10px;}
input[type=text]{padding: 0.6rem 1rem; margin: 0.3rem 0; width: 100%;}
input[type=password]{padding: 0.6rem 1rem; width: 100%;}
input[type=tel]{padding: 0.6rem; width: 100%;}
input[type=email]{padding: 0.6rem; width: 100%;}
input[type=checkbox]{margin: 0.6rem;  -ms-transform: scale(1.5, 1.5); -webkit-transform: scale(1.5, 1.5); transform: scale(1.5, 1.5);}
input[type=submit]{padding: 0.8rem 6rem; font-weight: bold; color: #fff; box-sizing: border-box; text-align: center; background: #10aeaa; border: none; border-radius:10px; -webkit-border-radius:10px; -moz-border-radius:10px;}
textarea{padding: 0.6rem; font-weight: normal; box-sizing: border-box; width: 100%; height: 180px; font-size: 14px; border: 1px solid #ddd;  border-radius:10px; -webkit-border-radius:10px; -moz-border-radius:10px;}
textarea:focus {outline: none;}

/** ---------------------------------------
input_shop_sns
--------------------------------------- */

article.input_shop_sns{
display: block;
margin: 0;
padding: 2rem 0;
}

article.input_setting{
margin: 0;
padding-bottom: 0.6rem;
}


article.input_setting ul{
display: flex;
flex-wrap: nowrap;
justify-content: space-between;
align-items: center;
letter-spacing: 0.05rem;
}



article.input_setting ul li{
padding: 0.3rem;
}


article.input_setting ul li:last-child{
margin-left: auto;
}


article.input_setting ul li.input_setting_title{
width:200px;
line-height: 0;


}

article.input_setting ul li.input_setting_title img{
width:60px;
line-height: 0;

}

article.input_setting ul li.input_setting_form{
width:60%;
}

article.input_setting ul li.input_setting_form .input_setting_form_box{
padding: 1rem 0;
border-bottom: 1px solid #ddd;
}

article.input_setting ul li.input_setting_form .input_setting_form_box p{
font-weight: bold;
}

article.input_setting ul li.input_setting_add{
}





/** ---------------------------------------
contaner
--------------------------------------- */


.contaner{
display: flex;
flex-wrap: nowrap;
justify-content: space-between;
align-items: flex-start;
width: 100%;
box-sizing: border-box;
}



.contaner_main{
width:calc(100% - 265px);
background: #fff;
}



.contaner_main .wrapper{
padding: 0 2rem;
}


.contaner_main .contaner_main_title{
background: #D9DEE6;
}

.contaner_main .contaner_main_title h1{
padding: 2rem 0;
font-size: 20px;
font-weight: bold;
}


.contaner_main .contaner_main_box{
padding: 2rem 0;
}


.contaner_side{
width: 240px;
}


.contaner_side .side_setting nav{
margin: 0;
padding: 0;
}

.contaner_side .side_setting nav ul{
margin: 0;
padding: 0;
}

.contaner_side .side_setting nav ul li{
margin: 0;
padding: 0;
border-bottom: 1px solid #ddd;
}

.contaner_side .side_setting nav ul li:last-child{
border-bottom: none;
}

.contaner_side .side_setting nav ul li a{
display: block;
text-decoration: none;
margin: 0;
padding: 1rem;
box-sizing: border-box;
}

.contaner_side .side_setting nav ul li a:hover{
font-weight: bold;
}


.contaner_side .side_sort_cast{
margin: 0;
padding: 1rem;
}

.contaner_side .side_sort_cast p{
font-weight: bold;
padding-bottom: 1rem;
}

.contaner_side .side_sort_cast nav.sort{
margin: 0;
padding: 0;
}

.contaner_side .side_sort_cast nav.sort ul{
display: flex;
flex-wrap: wrap;
justify-content: space-between;
margin: 0;
padding-bottom: 1rem;
}

.contaner_side .side_sort_cast nav.sort ul li{
width: 30%;
margin-bottom: 0.3rem;
padding: 0;
text-align: center;
border: 1px solid #ddd;
background: #fff;
}

.contaner_side .side_sort_cast nav.sort ul li.check{
background: #13ADAA;
}

.contaner_side .side_sort_cast nav.sort ul li a{
display: block;
margin: 0;
padding: 0.3rem;
text-decoration: none;
}




.contaner_side .side_sort_cast nav.sort ul li.check a{
display: block;
margin: 0;
padding: 0.3rem;
font-weight: bold;
color: #fff;
text-decoration: none;
}





.contaner_side .side_sort_cast .reset{
padding: 1rem 0;
margin: 0;
text-align: center;
}

.contaner_side .side_sort_cast .reset a{
display: block;
margin: 0;
padding: 0.3rem;
text-decoration: none;
border: 1px solid #ddd;
background: #fff;
}

.contaner_side .side_sort_cast .reset a:hover{
background: #13ADAA;
font-weight: bold;
color: #fff;
}



.contaner_side .side_sort_menu{
margin: 0;
padding: 1rem;
}


.contaner_side .side_sort_menu p{
font-weight: bold;
padding-bottom: 1rem;
}

.contaner_side .side_sort_menu nav.sort{
margin: 0;
padding: 0;
}


.contaner_side .side_sort_menu nav.sort ul{
margin: 0;
padding-bottom: 1rem;
}

.contaner_side .side_sort_menu nav.sort ul li{
display: block;
margin-bottom: 0.3rem;
padding: 0 	1rem;
border: 1px solid #ddd;
background: #fff;
}

.contaner_side .side_sort_menu nav.sort ul li.check{
background: #13ADAA;
}

.contaner_side .side_sort_menu nav.sort ul li a{
display: block;
margin: 0;
padding: 0.3rem;
text-decoration: none;
}



.contaner_side .side_sort_webshop{
margin: 0;
padding: 1rem;
}

.contaner_side .side_sort_webshop p{
font-weight: bold;
padding-bottom: 1rem;
}

.contaner_side .side_sort_webshop nav.sort{
margin: 0;
padding: 0;
}


.contaner_side .side_sort_webshop nav.sort ul{
margin: 0;
padding-bottom: 1rem;
}

.contaner_side .side_sort_webshop nav.sort ul li{
display: block;
margin-bottom: 0.3rem;
padding: 0 1rem;
border: 1px solid #ddd;
}

.contaner_side .side_sort_webshop nav.sort ul li.check{
background: #13ADAA;
}

.contaner_side .side_sort_webshop nav.sort ul li a{
display: block;
margin: 0;
padding: 0.3rem;
text-decoration: none;
}


/** ---------------------------------------
input_shop_menu
--------------------------------------- */

article.input_shop_menu{
display: block;
margin: 0;
padding: 0;
}


/** ---------------------------------------
input_shop_menu menu_list
--------------------------------------- */


article.menu_list{
margin: 0;
padding: 1rem 0;
}


article.menu_list section.input{
display: flex;
flex-wrap: nowrap;
justify-content: space-between;
align-items: center;
text-decoration: none;
border-bottom: 1px solid #ddd;
padding: 0.6rem 0;
}

article.menu_list section.input.hidden{
background: #eee;
}


article.menu_list section.input .tag{
width: 150px;
padding: 0 0.6rem;
}



article.menu_list section.input .name{
margin: 0;
padding: 0;
width:calc(100% - 400px);

}

article.menu_list section.input .name p{
margin: 0;
padding: 0;
font-weight: bold;
}

article.menu_list section.input .name a{
display: block;
text-decoration: none;
}

article.menu_list section.input .entry{
margin: 0;
padding: 0;
width: 150px;
}


article.menu_list section.input .entry p{
margin: 0;
padding-right: 1rem;
font-size: 12px;
color: #999;
text-align: right;
}

article.menu_list section.input .pickup{
margin: 0;
padding: 0;
width: 50px;
}

article.menu_list section.input .display{
margin: 0;
padding: 0;
text-align: right;
width: 100px;
}

/** ---------------------------------------
input_shop_menu menu_form
--------------------------------------- */

article.menu_form{
display: block;
width: 100%;
margin-bottom: 1rem;
padding: 2rem;
background: #fff;
box-sizing: border-box;
}


article.menu_form section.input{
margin: 0;
padding-bottom: 0.6rem;
}




article.menu_form section.input ul{
margin: 0;
padding-bottom: 0;
display: flex;
flex-wrap: nowrap;
justify-content: flex-start;
align-items: center;
letter-spacing: 0.05rem;
}

article.menu_form section.input ul:last-child{
border-bottom: 1px solid #ddd;
padding-bottom: 1rem;
}


article.menu_form section.input ul li{
padding: 0.3rem;

}

article.menu_form section.input ul li.item{
width:300px;
line-height: 0;

}


article.menu_form section.input ul li.item p{
font-weight: bold;

}


article.menu_form section.input ul li.text{
width:calc(100% - 300px);

}

article.menu_form section.submit{
margin: 0;
padding: 1rem 0;
text-align: center;
}


/** ---------------------------------------
input_shop_banner
--------------------------------------- */

article.input_shop_banner{
display: block;
margin: 0;
padding: 0;
}



/** ---------------------------------------
input_shop_banner banner_list
--------------------------------------- */


article.banner_list{
margin: 0;
padding: 1rem 0;
}


article.banner_list section.input{
display: flex;
flex-wrap: nowrap;
justify-content: space-between;
align-items: center;
text-decoration: none;
border-bottom: 1px solid #ddd;
padding: 0.6rem 0;
}

article.banner_list section.input.hidden{
background: #eee;
}



article.banner_list section.input .tag{
width: 150px;
padding: 0 0.6rem;
}



article.banner_list section.input .title{
margin: 0;
padding: 0;
width:calc(100% - 240px);

}

article.banner_list section.input .title p{
margin: 0;
padding: 0;
font-weight: bold;
}

article.banner_list section.input .title a{
display: block;
text-decoration: none;
}


article.banner_list section.input .display{
margin: 0;
padding: 0;
width: 90px;

}


/** ---------------------------------------
input_shop_banner banner_form
--------------------------------------- */

article.banner_form{
display: block;
width: 100%;
margin-bottom: 1rem;
padding: 2rem;
background: #fff;
box-sizing: border-box;
}


article.banner_form section.input{
margin: 0;
padding-bottom: 0.6rem;
}




article.banner_form section.input ul{
margin: 0;
padding-bottom: 0;
display: flex;
flex-wrap: nowrap;
justify-content: flex-start;
align-items: center;
letter-spacing: 0.05rem;
}

article.banner_form section.input ul:last-child{
border-bottom: 1px solid #ddd;
padding-bottom: 1rem;
}


article.banner_form section.input ul li{
padding: 0.3rem;

}

article.banner_form section.input ul li.item{
width:300px;
line-height: 0;

}


article.banner_form section.input ul li.item p{
font-weight: bold;

}


article.banner_form section.input ul li.text{
width:calc(100% - 300px);

}

article.banner_form section.submit{
margin: 0;
padding: 1rem 0;
text-align: center;
}




/** ---------------------------------------
input_shop_cast
--------------------------------------- */

article.input_shop_cast{
display: block;
margin: 0;
padding: 0;
}


/** ---------------------------------------
input_shop_cast cast_list
--------------------------------------- */


article.cast_list{
margin: 0;
padding: 1rem 0;
}


article.cast_list section.input{
display: flex;
flex-wrap: nowrap;
justify-content: space-between;
align-items: center;
text-decoration: none;
border-bottom: 1px solid #ddd;
padding: 0.6rem 0;
}

article.cast_list section.input.hidden{
background: #eee;
}





article.cast_list section.input .image{
margin: 0;
padding: 0;
width: 80px;
text-align: center;
}

article.cast_list section.input .image img{
width: 60px;
}

article.cast_list section.input .tag{
width: 100px;
}



article.cast_list section.input .name{
margin: 0;
padding: 0;
width:calc(100% - 480px);

}

article.cast_list section.input .name p{
margin: 0;
padding: 0;
font-weight: bold;
}

article.cast_list section.input .name a{
display: block;
text-decoration: none;
}

article.cast_list section.input .entry{
margin: 0;
padding: 0;
width: 190px;


}

article.cast_list section.input .entry p{
margin: 0;
padding-right: 1rem;
font-size: 12px;
color: #999;
text-align: right;
}

article.cast_list section.input .display{
margin: 0;
padding: 0;
width: 90px;

}


/** ---------------------------------------
input_shop_cast cast_form
--------------------------------------- */

article.cast_form{
display: block;
width: 100%;
margin-bottom: 1rem;
padding: 2rem;
background: #fff;
box-sizing: border-box;
}


article.cast_form section.input{
margin: 0;
padding-bottom: 0.6rem;
}




article.cast_form section.input ul{
margin: 0;
padding-bottom: 0;
display: flex;
flex-wrap: nowrap;
justify-content: flex-start;
align-items: center;
letter-spacing: 0.05rem;
}

article.cast_form section.input ul:last-child{
border-bottom: 1px solid #ddd;
padding-bottom: 1rem;
}


article.cast_form section.input ul li{
padding: 0.3rem;

}

article.cast_form section.input ul li.item{
width:300px;
line-height: 0;

}


article.cast_form section.input ul li.item p{
font-weight: bold;

}


article.cast_form section.input ul li.text{
width:calc(100% - 300px);

}

article.cast_form section.submit{
margin: 0;
padding: 1rem 0;
text-align: center;
}


/** ---------------------------------------
input_shop_setting
--------------------------------------- */

article.input_shop_setting{
display: block;
margin: 0;
padding: 0;
}



article.input_shop_setting section.input{
margin: 0;
padding-bottom: 0.6rem;
}



article.input_shop_setting section.input ul{
display: flex;
flex-wrap: nowrap;
justify-content: flex-start;
align-items: center;
letter-spacing: 0.05rem;
}

article.input_shop_setting section.input ul:last-child{
border-bottom: 1px solid #ddd;
padding-bottom: 1rem;
}

article.input_shop_setting section.input ul li{
padding: 0.3rem;
}




article.input_shop_setting section.input ul li.item{
width:180px;
}

article.input_shop_setting section.input ul li.item p{
font-weight: bold;
}

article.input_shop_setting section.input ul li.text{
width:calc(100% - 180px);
}
article.input_shop_setting section.input ul li.text span.select_text{
padding: 0 0.5rem;
font-size: 14px;
}

article.input_shop_setting section.input ul li.text p.size{
padding: 1rem 0;
}

article.input_shop_setting section.input ul li.text p.caution{
padding: 0.5rem 0;
}

article.input_shop_setting section.input ul li.text a{
text-decoration: none;
color: #2ca9e1;
}

article.input_shop_setting section.input ul li.text img.icon{
width: 60px;
height: 60px;
margin: 0 1rem;
vertical-align: bottom;
}


article.input_shop_setting section.input ul li.text.logo{
display: block;
text-align: center;

}

article.input_shop_setting section.input ul li.text img.logo{
width: 200px;
height: auto;
margin-bottom: 1rem;
vertical-align: bottom;
}



article.input_shop_setting section.input ul li.text img.ico{
width: 60px;
height: 60px;
margin-bottom: 1rem;
vertical-align: bottom;
}


article.input_shop_setting section.input ul li.text img.og{
width: 380px;
height: 200px;
margin-bottom: 1rem;
vertical-align: bottom;
}


article.input_shop_setting section.input ul li.text img.thumbnail{
width: 150px;
height: 150px;
margin-bottom: 1rem;
vertical-align: bottom;
}




/** ---------------------------------------
input_shop_cast
--------------------------------------- */

article.input_shop_cast{
display: block;
margin: 0;
padding: 0;
}




header{
position: fixed;
z-index: 999;
width: 100%;
}


/** ---------------------------------------
header_menu
--------------------------------------- */

article.header_menu{
display: block;
margin: 0;
padding: 1rem 0;
border-bottom: 1px solid #ddd;
background: #fff;
}

article.header_menu nav ul{
width: 1260px;
margin: 0 auto;
display: flex;
flex-wrap: nowrap;
justify-content: flex-start;
align-items: center;
}

article.header_menu nav ul li{
padding-right: 5rem;
text-align: center;
line-height: 1.5;
}



article.header_menu nav ul li:last-child{
padding: 0;
margin-left: auto;
text-align: center;
line-height: 1.5;
}


article.header_menu nav ul li img{
width: 20px;
}

article.header_menu nav ul li img.logo{
width: 60px;
padding-right: 3rem;
}

article.header_menu nav ul li img.icon{
width: 40px;
}

article.header_menu nav ul li span{
display: block;
font-size: 11px;
}

article.header_menu nav ul li a{
color: #333;
text-decoration: none;
}


article.header_menu_sps{
padding-top: 4rem;
}
/** ---------------------------------------
page_title
--------------------------------------- */
article.page_title{
padding: 2rem 0;
}

article.page_title ul{
margin: 0;
padding: 0;
display: flex;
flex-wrap: nowrap;
justify-content: space-between;
align-items: flex-end;
}

article.page_title ul li{
margin: 0;
padding: 0 1rem;
}

article.page_title h1{
font-weight: bold;
font-size: 18px;
}

article.page_title a{
font-weight: bold;
text-decoration: none;
padding: 0.8rem 3rem;
color: #fff;
background: #10aeaa;
}


/** ---------------------------------------
page_title_menu
--------------------------------------- */

article.page_title_menu{
padding-bottom: 2rem;
}
article.page_title_menu nav{
display: flex;
flex-wrap: nowrap;
justify-content: space-between;
}

article.page_title_menu a{
margin: 0 0.6rem;
padding: 0.6rem 2rem;
background: #fff;
border: 1px solid #ddd;
text-decoration: none;
}



/** ---------------------------------------
input_shop_news
--------------------------------------- */

article.input_shop_news{
display: block;
margin: 0;
padding: 0;
line-height: 1.6;
}


/** ---------------------------------------
input_shop_news news_list
--------------------------------------- */

article.news_list{
display: block;
width: 100%;
margin: 0;
padding: 2rem;
background: #fff;
}


article.news_list section{
margin: 0;
padding: 0.6rem 0;
display: flex;
flex-wrap: nowrap;
justify-content: space-between;
align-items: center;
border-bottom: 1px solid #ddd;

}


article.news_list section.hidden{
background: #eee;

}


article.news_list section .image{
width: 80px;
margin: 0;
padding: 0;
text-align: center;

}

article.news_list section .image img{
width: 60px;
margin: 0;
padding: 0;

}


article.news_list section .date_title{
margin: 0;
padding: 0 1rem;
width:calc(100% - 240px);
}

article.news_list section .date_title span.date{
display: block;
font-size: 12px;
}

article.news_list section .date_title span.title{
display: block;
font-size: 13px;
font-weight: bold;
padding: 0.6rem 0;
}

article.news_list section .date_title a{
display: block;
padding: 0 0.6rem;
text-decoration: none;
color: #333;
}
article.news_list section .display{
margin: 0;
padding: 0;
width: 120px;

}

article.news_list section .delete{
margin: 0;
padding: 0;
width: 40px;
text-align: center;
}



/** ---------------------------------------
input_shop_news news_form
--------------------------------------- */

article.news_form{
display: block;
width: 100%;
margin-bottom: 1rem;
padding: 2rem;
background: #fff;
box-sizing: border-box;
}


article.news_form section.input{
margin: 0;
padding-bottom: 0.6rem;
}




article.news_form section.input ul{
margin: 0;
padding-bottom: 0;
display: flex;
flex-wrap: nowrap;
justify-content: flex-start;
align-items: center;
letter-spacing: 0.05rem;
}

article.news_form section.input ul:last-child{
border-bottom: 1px solid #ddd;
padding-bottom: 1rem;
}


article.news_form section.input ul li{
padding: 0.3rem;

}

article.news_form section.input ul li.item{
width:300px;
line-height: 1.6;

}


article.news_form section.input ul li.item p{
font-weight: bold;

}


article.news_form section.input ul li.text{
width:calc(100% - 300px);

}


article.news_form section.submit{
margin: 0;
padding: 1rem 0;
text-align: center;
}






/** ---------------------------------------
date_select
--------------------------------------- */



.date_select{
display: flex;
flex-wrap: nowrap;
justify-content: flex-start;
align-items: center;

}

.date_select span{
padding: 0 0.6rem;
}

.date_select select.date{
display: inline-block; 
margin: 0.5rem 0; 
padding: 0.6rem; 
font-size: 14px;
width: 80px;
border: 1px solid #aaa; 
border-radius:5px; 
-webkit-border-radius:5px; 
-moz-border-radius:5px; 
font-size: 100%;
}


.date_select select.date_200{
display: inline-block; 
margin: 0.5rem 0; 
padding: 0.6rem; 
font-size: 14px;
width: 200px;
border: 1px solid #aaa; 
border-radius:5px; 
-webkit-border-radius:5px; 
-moz-border-radius:5px; 
font-size: 100%;
}




/** ---------------------------------------
input_image
--------------------------------------- */

.input_image{
margin: 0;
padding: 2rem 0;
text-align: center;
border: 3px dotted #ddd;
}

.input_image p{
padding-bottom: 2rem;
}

.input_image img{
width: 150px;
}





/** ---------------------------------------
input_shop_webshop
--------------------------------------- */

article.input_shop_webshop{
display: block;
margin: 0;
padding: 0;
line-height: 1.6;
}


/** ---------------------------------------
input_shop_webshop webshop_list
--------------------------------------- */

article.webshop_list{
display: block;
width: 100%;
margin: 0;
padding: 2rem;
background: #fff;
}


article.webshop_list section{
margin: 0;
padding: 0.6rem 0;
display: flex;
flex-wrap: nowrap;
justify-content: space-between;
align-items: center;
border-bottom: 1px solid #ddd;

}


article.webshop_list section.hidden{
background: #eee;

}


article.webshop_list section .image{
width: 80px;
margin: 0;
padding: 0;
text-align: center;

}

article.webshop_list section .image img{
width: 60px;
margin: 0;
padding: 0;

}


article.webshop_list section .tag{
width: 160px;
margin: 0;
padding: 0;
text-align: center;

}


article.webshop_list section .date_title{
margin: 0;
padding: 0 1rem;
width:calc(100% - 530px);
}



article.webshop_list section .date_title span.title{
display: block;
font-size: 13px;
font-weight: bold;
padding: 0.6rem 0;
}

article.webshop_list section .date_title a.title{
display: block;
padding: 0 0.6rem;
text-decoration: none;
color: #333;
font-weight: bold;
}

article.webshop_list section .date_title a.date{
padding: 0 0.6rem;
text-decoration: none;
font-size: 12px;
letter-spacing: 0;
color: #ddd;
}

article.webshop_list section .price{
margin: 0;
padding-right: 1rem;
width: 120px;
font-size: 13px;
text-align: right;
}

article.webshop_list section .display{
margin: 0;
padding: 0;
width: 120px;

}

article.webshop_list section .delete{
margin: 0;
padding: 0;
width: 40px;
text-align: center;
}




/** ---------------------------------------
input_shop_webshop webshop_form
--------------------------------------- */

article.webshop_form{
display: block;
width: 100%;
margin-bottom: 1rem;
padding: 2rem;
background: #fff;
box-sizing: border-box;
}


article.webshop_form section.input{
margin: 0;
padding-bottom: 0.6rem;
}




article.webshop_form section.input ul{
margin: 0;
padding-bottom: 0;
display: flex;
flex-wrap: nowrap;
justify-content: flex-start;
align-items: center;
letter-spacing: 0.05rem;
}

article.webshop_form section.input ul:last-child{
border-bottom: 1px solid #ddd;
padding-bottom: 1rem;
}


article.webshop_form section.input ul li{
padding: 0.3rem;

}

article.webshop_form section.input ul li.item{
width:300px;
line-height: 0;

}


article.webshop_form section.input ul li.item p{
font-weight: bold;

}


article.webshop_form section.input ul li.text{
width:calc(100% - 300px);

}


article.webshop_form section.submit{
margin: 0;
padding: 1rem 0;
text-align: center;
}









/** ---------------------------------------
form_submit
--------------------------------------- */

.form_submit{
margin: 0;
padding: 1rem 0;
text-align: center;
}





/** ---------------------------------------
button_icon
--------------------------------------- */

.button_icon{
border: none;
}

.button_icon img{
width: 20px;
}

.button_icon button{
display: none;
}


/** ---------------------------------------
popup
--------------------------------------- */
#popup{
display: none;
}
article.popupbox{
position:absolute;
display: block;
width: 100%;
height: 100%;
z-index: 999;
background:rgba(58,67,87,0.8);
}

article.popupbox .box{
position:absolute;
width: 400px;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
-webkit-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
display: inline;
background: #fff;
padding: 3rem 0;
text-align: center;
}




article.popupbox .box p.title{
margin: 0;
padding-bottom: 1rem;
font-weight: bold;
}

article.popupbox .box p.title_sub{
margin: 0;
padding-bottom: 2rem;
font-size: 12px;
color: #ddd;
}

article.popupbox .box ul{
display: flex;
flex-wrap: nowrap;
justify-content: space-between;
}



article.popupbox .box ul li{
width: 50%;
}

article.popupbox .box ul li button{
padding: 1rem;
width: 150px;
color: #fff;
border: none;
font-size: 16px;
font: bold;
}

article.popupbox .box ul li button.cancel{
background: #c3c8d1;
}

article.popupbox .box ul li button.delete{
background: #e88581;
}



/** ---------------------------------------
login
--------------------------------------- */


article.login{
margin: 0;
padding: 6rem 0;

}
article.login .box{
margin: 0 auto;
  width: 500px;


}



article.login section.title{
margin: 0;
padding-bottom: 3rem;
text-align: center;

}
article.login section.title img{
width: 100px;
margin: 0;
padding: 0;

}


article.login section.login_input_box{
padding: 2rem 3rem;
background: #fff;
}


article.login section.login_input_box ul li{
padding-bottom: 1rem;
}

article.login section.login_input_box ul li:last-child{
padding-bottom: 0rem;
}




article.login section.login_input_box ul li.err p{
color: #f87e7e;
height: 16px;
font-size: 13px;
letter-spacing: 1;
}

article.login section.login_input_box ul li.submit{
padding: 1rem 0;
text-align: center;
}





/** ---------------------------------------
branch
--------------------------------------- */
article.branch{
padding: 6rem 0;
}

article.branch ul{
display: flex;
flex-wrap: wrap;
justify-content: space-around;
align-items: center;


}

article.branch ul li{
text-align: center;
width: 30%;
padding: 1rem 0;
margin: 0;
}


article.branch ul li section{
background: #fff;
}

article.branch ul li section button{
display: block;
padding: 1rem 0;
width: 100%;
border: none;
background: #fff;
}

article.branch ul li section img{
width: 60px;
height: 60px;
}

article.branch ul li section p{
padding-top: 0.6rem;
}


article.branch ul li section.hidden{
background: transparent;
}




/** ---------------------------------------
branch_work
--------------------------------------- */
article.branch_work{
padding: 6rem 0;
}

article.branch_work ul{
display: flex;
flex-wrap: wrap;
justify-content: space-around;
align-items: center;


}


article.branch_work ul li{
text-align: center;
width: 30%;
padding: 1rem 0;
margin: 0;
font-weight: bold;
}

article.branch_work ul li.preparation{
color: #999;
}


article.branch_work ul li a{
display: block;

padding: 2rem 0;
text-decoration: none;
background: #fff;
}


article.branch_work ul li a:hover{
background: #f1f1f1;
-webkit-transition: all .5s; transition: all .5s;
}




/** ---------------------------------------
footer
--------------------------------------- */
footer{
padding-top: 6rem;
}




/** ---------------------------------------
btn_switch
--------------------------------------- */
.btn_switch{position: relative; line-height: 25px; letter-spacing: 0; text-align: center; font-size: 14px; top: 0; left: 0; padding: 0; width: 100px;}
.btn_switch input[type="checkbox"] {display: none; }
.btn_switch label {display: block; box-sizing: border-box; height: 30px; border: 1px solid #999; border-radius: 20px;}
.btn_switch input[type="checkbox"]:checked +label {border-color: #3994a3;}
.btn_switch label span:after{content: "非公開"; padding: 0 0 0 12px; color: #999;}
.btn_switch input[type="checkbox"]:checked + label span:after{content: "公開"; padding: 0 12px 0 0; color: #3994a3;}
.btn_switch #swimg {position: absolute; width: 25px; height: 25px; background: #999; top: 2px; left: 2px; border-radius: 20px; transition: .2s;}
.btn_switch input[type="checkbox"]:checked ~ #swimg {transform: translateX(70px); background: #3994a3;}








/** ---------------------------------------
btn_switch_mini
--------------------------------------- */
.btn_switch_mini{position: relative; line-height: 23px; letter-spacing: 0; text-align: center; font-size: 12px; top: 0; left: 0; padding: 0; width: 80px;}
.btn_switch_mini input[type="checkbox"] {display: none; }
.btn_switch_mini label {display: block; box-sizing: border-box; height: 25px; border: 1px solid #999; border-radius: 20px;}
.btn_switch_mini input[type="checkbox"]:checked +label {border-color: #3994a3;}
.btn_switch_mini label span:after{content: "非公開"; padding: 0 0 0 10px; color: #999;}
.btn_switch_mini input[type="checkbox"]:checked + label span:after{content: "公開"; padding: 0 12px 0 0; color: #3994a3;}
.btn_switch_mini #swimg {position: absolute; width: 16px; height: 16px; background: #999; top: 4px; left: 3px; border-radius: 20px; transition: .2s;}
.btn_switch_mini input[type="checkbox"]:checked ~ #swimg {transform: translateX(58px); background: #3994a3;}



/** ---------------------------------------
ck-editor
--------------------------------------- */

.ck-editor h1{font-weight: bold; font-size: 22px;}
.ck-editor h2{font-weight: bold; font-size: 16px;}
.ck-editor h3{font-weight: bold; font-size: 14px;}
.ck-editor storong{font-weight: bold;}
.ck-editor p{margin: 0; padding-bottom: 1rem;}
.ck-editor__editable_inline {min-height: 300px;}




/** ---------------------------------------
arrow
--------------------------------------- */

.arrow_right{
  width: 100%;
  position: relative;
  display: block;
  vertical-align: middle;
  text-decoration: none;
  font-size: 14px;
}

.arrow_right::after{
  position: absolute;
  top: 0;
  bottom: 0;
  right: 20px;
  margin: auto;
  content: "";
  vertical-align: middle;
  width: 8px;   /* arrow size */
  height: 8px;  /* arrow size */
  border-top: 2px solid #ddd;  /* thickness, color */
  border-right: 2px solid #ddd;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
}



/** ---------------------------------------
swap
--------------------------------------- */


.menu_swap{
display: flex;
flex-wrap: nowrap;
justify-content: flex-start;
align-items: flex-end;
padding: 0;
margin: 0;
padding-bottom: 0.6rem;
border-bottom: 1px solid #ddd;
}

.menu_swap a{
margin-right: 1rem;
}

.menu_swap a.icon{
display: inline-block;
line-height: 0;
padding: 0.6rem;
border: 1px solid #ddd;
}

.menu_swap a.text{
display: block;
padding: 1rem;
line-height: 0;
border: 1px solid #ddd;
text-decoration: none;
color: #aaa;
}

.menu_swap a.caution{
font-size: 12px;
}

.menu_swap img{
width: 20px;
height: 20px;

}





.menu_webshop{
display: flex;
flex-wrap: nowrap;
justify-content: flex-start;
align-items: flex-end;
padding: 0;
margin: 0;
padding-bottom: 0.6rem;
border-bottom: 1px solid #ddd;
}

.menu_webshop a{
margin-right: 1rem;
}

.menu_webshop a.icon{
display: inline-block;
line-height: 0;
padding: 0.6rem;
border: 1px solid #ddd;
}

.menu_webshop a.text{
display: block;
padding: 1rem;
line-height: 0;
border: 1px solid #ddd;
text-decoration: none;
color: #aaa;
}

.menu_webshop a.caution{
font-size: 12px;
}

.menu_webshop img{
width: 20px;
height: 20px;

}




.swap_list{
display: block;
width: 100%;
margin: 0;
padding: 2rem;
background: #fff;
}

.swap_list section{
margin: 0;
padding: 1rem;
display: flex;
flex-wrap: nowrap;
justify-content: space-between;
align-items: center;
border-bottom: 1px solid #ddd;
background: #fff;
}


.swap_list section.hidden{
background: #eee;
}


.swap_list section .swap_no{
font-size: 12px;
color: #666;
width: 30px;
}


.swap_list section .image{
font-size: 12px;
color: #ddd;
width: 80px;
}

.swap_list section .image img{
width: 60px;

}



.swap_list section .tag{
width: 150px;
}

.swap_list section .name{
font-size: 14px;
width:calc(100% - 680px);
}



.swap_list section .entry{
font-size: 12px;
color: #666;
width: 180px;
text-align: right;
}


.swap_list section .birthday{
font-size: 12px;
color: #666;
width: 140px;
text-align: right;
}


.swap_list section .price{
width: 100px;
text-align: right;
}

.swap_list section .display{
width: 60px;
text-align: right;
}

.swap_list section .display p{
text-align: center;
margin: 0;
padding: 0.3rem 0.6rem;
font-size: 12px;
background: #333;
color: #fff;
font-size: 12px;
}


.swap_list section .pickup{
width: 120px;
text-align: right;
}



/** ---------------------------------------
span.tag
--------------------------------------- */

span.tag_cast{
margin: 0;
padding: 0.3rem 0.6rem;
font-size: 12px;
}

span.tag_cast.beginner{
background: #039945;
color: #fff;
}

span.tag_cast.leader{
background: #751828;
color: #fff;
}

span.tag_cast.middle{
background: #0076c8;
color: #fff;
}

span.tag_cast.retiree{
background: #333;
color: #fff;
}


span.tag_food{
margin: 0;
padding: 0.3rem 0.6rem;
font-size: 12px;
}

span.tag_food.season{
background: #039945;
color: #fff;
}

span.tag_food.food{
background: #755312;
color: #fff;
}

span.tag_food.drink{
background: #465a7b;
color: #fff;
}

span.tag_food.attraction{
background: #751212;
color: #fff;
}


span.tag_webshop{
margin: 0;
padding: 0.3rem 0.6rem;
font-size: 12px;
}

span.tag_webshop.limited{
background: #3a0000;
color: #fff;
}

span.tag_webshop.event{
background: #185909;
color: #fff;
}

span.tag_webshop.gods{
background: #a60b7c;
color: #fff;
}

span.tag_webshop.cheki{
background: #4f4b05;
color: #fff;
}

span.tag_webshop.cake{
background: #465a7b;
color: #fff;
}

span.tag_webshop.flower{
background: #996119;
color: #fff;
}

span.tag_webshop.unselected{
background: #aaa;
color: #fff;
}


span.tag_banner{
margin: 0;
padding: 0.3rem 0.6rem;
font-size: 12px;
}

span.tag_banner.cover{
background: #039945;
color: #fff;
}

span.tag_banner.middle{
background: #755312;
color: #fff;
}

span.tag_banner.bottom{
background: #465a7b;
color: #fff;
}

span.tag_banner.footer{
background: #751212;
color: #fff;
}




.tag_reg{
margin: 0;
padding: 0;
}


.tag_reg input{
width: 200px;
}

.tag_reg input[type=radio] {
display: none;
}

.tag_reg input[type="radio"]:checked + label {
background: #31A9EE;/* マウス選択時の背景色を指定する */
color: #ffffff; /* マウス選択時のフォント色を指定する */
}

.tag_reg label {
display: inline-block;
margin: 0.3rem;
padding: 0.3rem 1rem;
border: 1px solid #ddd;
}


.tag_reg p{
margin: 0;
padding: 1rem 0;
}





.tag_news{
margin: 0;
padding: 0;
}


.tag_news input{
width: 200px;
}

.tag_news input[type=radio] {
display: none;
}

.tag_news input[type="radio"]:checked + label {
background: #31A9EE;/* マウス選択時の背景色を指定する */
color: #ffffff; /* マウス選択時のフォント色を指定する */
}

.tag_news label {
display: inline-block;
margin: 0.3rem;
padding: 0.3rem 1rem;
border: 1px solid #ddd;
}


.tag_news p{
margin: 0;
padding: 1rem 0;
}





/** ---------------------------------------
updata
--------------------------------------- */
article.updata {
  animation: fade-in 1s, fade-out 1s 2s;
   animation-fill-mode: forwards;
   background: #cee8ea;
   color: #333;
   text-align: center;
   padding: 0.6rem 0;
   font-weight: bold;
}

@keyframes fade-in {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

@keyframes fade-out {
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
  }
}




/** ---------------------------------------
menu_dowon
--------------------------------------- */

#menu_down {
  position: relative;
  display: inline-block;
  padding: 0;
  cursor: pointer;
}



#menu_down_box {
  z-index: 1000;
  background: #fff;
  position: absolute;
  right: 0;
  top: 3rem;
  width: 250px;
  padding: 0;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.3s ease, visibility 0.3s ease;
  box-shadow: 0 0 6px #dddd;
}

#menu_down_box.open {
  opacity: 1;
  visibility: visible;
}


/** ---------------------------------------
menu_header_select
--------------------------------------- */

.menu_header_select p.m_top{
display: block;
text-align: center;
padding: 2rem 0;
}

.menu_header_select a:hover{
font-weight: bold;
}


.menu_header_select a.shop_move{
	font-weight: bold;
	text-decoration: none;
	padding: 0.8rem 3rem;
	color: #fff;
	background: #10aeaa;
}

.menu_header_select p.m_bottom{
padding: 1rem;
border-top: 1px solid #eee;
}

.menu_header_select p.m_bottom a.logout{
display: block;
text-align: left;
background: url("../img_test/icon_menu/logout.webp") no-repeat right;
background-size:15px;
}


.menu_header_select p.m_bottom a.select{
display: block;
text-align: left;
background: url("../img_test/icon_menu/store.webp") no-repeat right;
background-size:15px;
}


.menu_header_select_box{
margin: 0;
padding: 0;
border-top: 1px solid #eee;
}

.menu_header_select_box a{
display: block;
text-align: left;
padding: 1rem;
}



/** ---------------------------------------
input_sns_twitter
--------------------------------------- */

article.input_sns_twitter{
display: block;
margin: 0;
padding: 0;
line-height: 1.6;
}



 /** ---------------------------------------
input_sns_twitter twitter_list
--------------------------------------- */

article.twitter_list{
display: block;
width: 100%;
margin: 0;
padding: 2rem;
background: #fff;
}

article.twitter_list h1{
font-weight: bold;
font-size: 14px;
padding-bottom: 1rem;
}


article.twitter_list section{
margin: 0;
padding: 0.6rem 0;
display: flex;
flex-wrap: nowrap;
justify-content: space-between;
align-items: center;
border-bottom: 1px solid #ddd;

}



article.twitter_list section .text a{
display: block;
text-decoration: none;
color: #333;
}

article.twitter_list section .text span{
display: block;
}

article.twitter_list section .text span.week,span.date{
display: block;
font-size: 12px;
}