@charset "utf-8";
/* ===================================================================
CSS information

 file name  :common.css
 style info :ヘッダフッタ共通

=================================================================== */
html,
body {
	height: 100%; /* #containerのmin-heightに対して必要なもの */
	margin: 0;
	padding: 0;
}
body{
	font-size:14px;
	line-height:1.7em;
	color:#000;
}
input{font-family:meiryo;}
a{transition: all 0.1s linear;}
a:hover{transition: all 0.1s linear;text-decoration:underline;color:#000;}

h1,h2,h3,h4,h5,h6{font-weight:700;}

/*----------------------------------------------------
	#wrapper
----------------------------------------------------*/
#wrapper {
	width: 100%;
	min-height: 100%;
	_height: 100%;/* IE6用ハック */
	margin:0 auto;
}

.inner_band{
	width:1280px;
	margin:0 auto;
}

/* -----------------------------------------------------------
		ヘッダー
----------------------------------------------------------- */

.header_ttl{
	margin:0 0 5px;
}
#header-box{
	padding:20px 0 10px;
	overflow:hidden;
	margin:0 0 0;
	position:relative;
	z-index: 50;
	background:#fff;
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
}

#header-box.fixed {
	width: 1280px;
	position: fixed;
	top: 0px;
	background-color: #ffffff;
	box-shadow: 0px 9px 3px -3px rgba(0,0,0,0.6);
	-webkit-box-shadow: 0px 9px 3px -3px rgba(0,0,0,0.6);
	-moz-box-shadow: 0px 9px 3px -3px rgba(0,0,0,0.6);
}
#header_left{
	float:left;
	padding:0 0 0 30px;
}
#header_left .logo {
	width: 231px;
	float:left;
	margin-right:10px;
}
#header_left .headinfo {
	float:left;
}

#header_right{
	float:right;
}
.sp_toggle{
	display:none;
}
ul#header_navi{
	overflow:hidden;
	float:right;
}
ul#header_navi li{
	float:left;
	margin:0 0 0 10px;
}
ul#header_navi li a{
	display:block;
	width:70px;
	color:#000;
}
ul#header_navi li a:hover{
	text-decoration:none;
}
ul#header_navi li .name{
	display:block;
	font-size:0.8em;
	font-weight:700;
	text-align:center;
	margin:0 0 2px;
}
ul#header_navi li .name.mini{
	font-size:0.6em;
}
ul#header_navi li .btn{
	display:block;
	width:53px;
	height:53px;
	background:#edede6;
	transition: all 0.2s linear;
	position:relative;
	margin:0 auto;
	border-radius:100%;
}
ul#header_navi li .btn img{
	width:100%;
}
ul#header_navi li .btn:hover{
	background:#edede6;
}
ul#header_navi li .btn .num{
	background:#c03061;
	color:#fff;
	position:absolute;
	right:2px;
	bottom:2px;
	line-height:1em;
	border-radius:100%;
	padding: 6px 1px 0;
	width:21px;
	height:21px;
	text-align:center;
	font-size:0.7em;
	display:block;
}
#header_right_text {
	float: right;
}

.login_user{
	float:right;
	padding:30px 10px 0 0;
	line-height:1.4em;
}
.login_user p{
	font-weight:700;
}


/*----------------------------------------------------
	#contents
----------------------------------------------------*/

#contents {
	width:1280px;
	margin:0 auto;
	clear:both;
	overflow:hidden;
	position:relative;
/*	background:url(../images/common/side_bg.png) 0 0 repeat-y;*/
}
#contents.fixed {
	padding-top: 150px;
}
#main{
	width:940px;
	float:right;
}
#main_contents{
	/* min-height: 850px; 
	height: auto !important;
	height: 800px;*/
	padding:0 0 20px;
	overflow: hidden;
}

/* カート */
/*サイドのグレーの背景を消す*/
#contents.cart {
	background:none;
}
#contents.cart #main {
	width:100%;
}

#main_contents .single_main .in2cart_table {
	margin: 0 0 20px 0;
}


/* -----------------------------------------------------------
		サイドメニュー
----------------------------------------------------------- */

#side{
	width:270px;
	float:left;
	padding:0;
}
/*----------------------------------------------------
	お問い合わせメニュー
----------------------------------------------------*/

#side .search{
	margin:0 0 20px;
}
.sd_contact{
	margin:0 0 30px;
}
.sd_contact .bnr{
	line-height:0;
	margin:0 0 -10px;
}
.sd_contact .navi{
	padding:0px 22px;
	background:#ebebe4;
	border-radius:  10px;
}
.sd_contact .navi li{
	border-bottom:2px solid #fff;
}
.sd_contact .navi li a{
	color:#000;
	font-weight:700;
	font-size:1.1em;
	padding:10px 0 10px 90px;
	display:block;
	height:58px;
	line-height:2.5;
}
.sd_contact .navi li:nth-child(1){background:url(/wp-content/uploads/ico_baloon.png) 35px center no-repeat;}
.sd_contact .navi li:nth-child(2){background:url(/wp-content/uploads/ico_layer.png) 35px center no-repeat;}
.sd_contact .navi li:nth-child(3){background:url(/wp-content/uploads/ico_price.png) 35px center no-repeat;border:none;}

/*----------------------------------------------------
	サイドメニュー
----------------------------------------------------*/
#navi-main{
	margin:0 0 50px;
}
.redttl{
	font-weight:700;
	font-size:1.5em;
	color:#d20012;
	border-bottom:1px solid #000;
	padding:0 0 10px;
	margin:0 0 5px;
}
.side-box{
	margin:0 0 20px;
}
ul#menu-gnavi > li,
#side ul.menu > li{
	position:relative;
}
ul#menu-gnavi > li:before,
#side ul.menu > li:before {
	content:"\f0c8";
	font-family: "Font Awesome 5 Free";
	margin:0 5px 0 0 ;
	font-size:0.8em;
	position:absolute;
	top:10px;
	font-weight: bold;
}
ul#menu-gnavi > li a,
#side ul.menu > li a {
	font-size:1.1em;
	font-weight:700;
	color:#000;
	padding:10px 0 15px 15px;
	display:block;
	position:relative;
}

/* 2個目の■ */
ul#menu-gnavi > li > a:before,
#side ul.menu > li > a:before {
	content:"\f0c8";
	font-family: "Font Awesome 5 Free";
	margin:0 5px 0 0 ;
	font-size:0.7em;
	position:absolute;
	top:10px;
	left:0;
	font-weight: bold;
}
ul#menu-gnavi > li > a:nth-child(1):before,
#side ul.menu > li > a:nth-child(1):before {
	content:"";
}

/* 入れ子リンク */
ul#menu-gnavi > li > ul > li a,
#side ul.menu > li > ul > li a{
	padding:0 0 0.5em 1em;
	font-weight:400;
}
ul#menu-gnavi > li > ul > li:before,
#side ul.menu > li > ul > li:before{
	font-family: "Font Awesome 5 Free";
	content: "\f105";
	color:#d20012;
	padding:0 10px 0 15px;
	float:left;
	font-weight: bold;
}
ul#menu-gnavi > li ul{
	margin-top:-5px ;
}
ul#menu-gnavi > li > ul:last-child{
	margin-bottom: 10px;
}

.white_bg{
	background:#fff;
}




/*----------------------------------------------------
	ｓｎｓ
----------------------------------------------------*/


.sns_area{
	padding:15px 10px;
	overflow:hidden;
	margin:0 0 15px;
}
.sns_area ul li{
	width:47px;
	height:47px;
	float:left;
	text-align:center;
	margin:0 10px 0 0;
}
.sns_area ul li a{
	width:47px;
	height:47px;
	color:#fff;
	display:block;
	border-radius:100%;
	font-size:2em;
	line-height:1.7em;
}
.sns_area ul li a:hover{
	opacity:0.7;
}
.sns_area ul li.tw a{
	background:#69c2ee;
}
.sns_area ul li.fb a{
	background:#49459a;
}

/*----------------------------------------------------
	カレンダー
----------------------------------------------------*/

.calendar_ttl{
	color:#fff;
	background:#000;
	padding:5px;
	margin:0 0 10px ;
	text-align:center;
}
.title_date{
	display:block;
	texst-align:center;
	border-left:1px solid #ccc;
	border-top:1px solid #ccc;
	border-right:1px solid #ccc;
	background:#fff;
	padding:5px 10px;
	color:#595757;
	font-weight:700;
	text-align:center;
	font-size:1.3em;
}
table.in2cart_calendar{
	background:#fff;
	margin:0 0 15px;
	color:#595757;
}
table.in2cart_calendar th,
table.in2cart_calendar td{
	border:1px solid #ccc;
	text-align:center;
	padding:0px;
}
th.sunday{color:#e7141a;}
td.sunday{background:#ffd3d1;}

th.saturday{color:#592cff;}
td.saturday{background:#ffd3d1;}

.holiday{background:#ffd3d1 !important;}
.today{background:#96d4ff; !important;}

.calendar_readme{
	margin:0 0 15px;
}
.calendar_readme ul{
	overflow:hidden;
}
.calendar_readme ul li{
	float:left;
	margin:0 5px 0 0;
	line-height:1.3em;
	font-weight:700;
}
.calendar_readme ul li span{
	width:40px!important;
	height:25px!important;
	margin:0 5px 0 0;
	border:1px solid #ccc;
}
.calendar_readme ul li:nth-child(2n){
	padding:5px 20px 0 0;
}

/* -----------------------------------------------------------
	#footer
		フッター
----------------------------------------------------------- */

#footer {
	background:#dbdbdb;
	font-size:12px;
	padding:30px 35px;
	clear:both;
}
#footer .footer_top{
	overflow:hidden;
	width:890px;
	float:right;
}
#footer .footer_top a{
	color:#000;
}
.footer_item_box_list {
	overflow: hidden;
	margin: 0 0 20px 0;
}

/* 株式会社グラビティ */

.company_info{
	width:300px;
	float:left;
	font-size:1.2em;
	line-height:1.5;
}
.company_info p{
	font-weight:700;
}
.company_info .company_name{
	font-size:1.8em;
}
.company_info .address{
	margin:5px 0 10px;
}
.company_info .tel{
	margin:10px 0 10px;
}
.company_info .time{
	margin:10px 0 10px;
}
.company_info .sns{
	background:#fff;
	padding:5px 15px;
	width:180px;
	color:#a8acac;
	text-align:center;
}
.company_info .sns ul li{
	margin:0 0 5px;
	line-height:1;
}
.company_info .sns ul li a{
	background:#a8acac;
	color:#fff;
	font-weight:700;
	display:block;
	border-radius:8px;
	padding:8px 15px 8px 30px;
	position:relative;
}
.company_info .sns ul li a:hover{
	text-decoration:none;
}
.company_info .sns ul li a i{
	font-size:1.5em;
	position:absolute;
	top:5px;
	left:15px;
	margin:0 10px 0 0;
}





/* 商品一覧 */

.group_name{
	font-weight:700;
	margin:0 0 10px;
}
.group_name a{
	font-weight:700;
}

.item_box_list.footer{
	margin:0 0 10px;
}
.item_box_list.footer .title{
	margin:0 0 15px;
}
.ft_prd_list{
	width:170px;
	float:left;
	margin:0 10px 20px 0;
	display: flex;
    flex-wrap:wrap;
	line-height:1.5;
	font-size:0.9em;
}
.ft_prd_list ul{
	width:100%;
}
.ft_prd_list ul li{
	border-bottom:1px solid #000;
	padding:6px 0 6px 12px;
	position:relative;
}
.ft_prd_list ul li:before{
	content:"・";
	width:10px;
	height:5px;
	position:absolute;
	left:0;
	top:7px;
}

/* footer_btm */

#menu-fnavi{
	margin:0 0 10px;
	overflow:hidden;
}
#menu-fnavi li{
	float:left;
	margin:0 15px 0 0;
	text-align: left;
	position: relative;
}
#menu-fnavi li:before{
	content:"\f0c8";
	font-family: "Font Awesome 5 Free";
	margin:0 5px 0 0 ;
	font-size:0.7em;
	font-weight: bold;
	position: absolute;
}
#menu-fnavi li a{
	color:#000;
	font-weight: bold;
	padding: 0 0 0 10px;
}
#menu-fnavi li .sub-menu {
	width: 920px;
	overflow: hidden;
}
#menu-fnavi li .sub-menu li::before {
    content: "\f105";
	font-family: "Font Awesome 5 Free";
    padding-left: 5px;
}
#menu-fnavi li .sub-menu li a {
	font-weight: normal;
}
.copyright{
	clear:both;
	text-align:center;
	padding:50px 0 0;
}
.copyright small{
	font-size:1.4em;
	font-weight:700;
}
.copyright a{
	font-weight:700;
	color:#000;
}


/* カート用フッタ */

#footer-box{
	background:#333;
	padding:20px;
	font-size:0.8em;
	color:#fff;
	margin:20px 0 0;
	text-align:center;
}
#footer-box .copyright a {
	color: #ffffff;
}

/* pagetop　*/

.pagetop{
    position: fixed;
    bottom: 30px;
    right: 30px;
    z-index: 999;
}
.pagetop a{
    text-align: center;
    background: #333;
    display: block;
	width:50px;
	height:50px;
	padding:12px 0 0;
}


/*----------------------------------------------------
    3DS、モーダル
----------------------------------------------------*/
.modaal_body {
    padding: 10px;
    word-break: break-all;
    min-height: 200px;
    height: 100%;
    text-align: left;
}
.modaal_body .modal-html {
    min-height: 100px;
}
.modaal {
    display: none;
}
.modaal-content-container div.modaal-title {
    padding: 10px;
    text-align: center;
    background-color: #333333;
    color: #ffffff;
    font-size: 1.3rem;
    margin: 10px;
}

/* 閉じるボタン */
.modaal-content-container > .close {
    display: block;
    position: absolute;
    top: 20px;
    right: 20px;
    color: #ffffff;
    width: 30px;
    height: 30px;
    text-align: center;
    border-radius: 100%;
    z-index: 10;
}
.modaal-content-container > .close i {
    font-size: 1.5rem;
    position: relative;
    top: 3px;
}
.modaal-content-container > .close:hover {
    background-color: #ff1717;
}

/* STEP3 */
.step3-credit-help-text {
	display: block;
	margin: 10px 0 30px 0;
}