﻿@charset "utf-8";

/*ベース
-----------------------*/
body {
	font-size:85%;
}
#wrapper {
	border-bottom:5px solid #e60012;
	position:relative;

}
#container {
	width:100%;
	margin:0 auto;
}

#float {
    width:100%;
    border: solid 0px;
}

.blockA {
    width:50%;
    background-color: #ff0000;
    float: left;
}

.blockB {
    width:50%;
    background-color: #00ff00;
    float: left;
}


.box5, .box6, .box7 {
  float: left;
  width: 33.3333%; // 3分割
}


.boxA {
  border: none;
  &:after {
    content: "";
    display: block;
    clear: both;
  }
}


img {
	width:100%;
}
img.normal {
	width:auto;
}

.inline {
	text-align: center;
}


/*フォーム関連*/
input[type=text] {
	padding:5px 2%;
	border:1px solid #cccccc;
	border-radius:3px;
}
input[type=text]:disabled {
	background-color:#ebebe4;
}
input[type=submit]:disabled {
	opacity:0.5;
}
textarea {
	padding:5px 2%;
	border:1px solid #cccccc;
	border-radius:3px;
}
label.cb_img {
	background-image:url(../img/checkbox_off.png);
	background-repeat:no-repeat;
}
label.cb_img.check {
	background-image:url(../img/checkbox_on.png);
	background-repeat:no-repeat;
}
label.cb_img input[type=checkbox] {
	opacity:0;
}
label.rd_img {
	background-image:url(../img/radio_off.png);
	background-repeat:no-repeat;	
}
label.rd_img.check {
	background-image:url(../img/radio_on.png);
	background-repeat:no-repeat;
}
label.rd_img input[type=radio] {
	opacity:0;
}
.tipped {
	color:#cccccc;
}

/*ボタン*/
.btn,
a.btn,
input[type=submit].btn {
	color:#ffffff;
	font-family:'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','メイリオ',Meiryo,Verdana,osaka,'ＭＳ Ｐゴシック','MS PGothic',sans-serif ;
	font-size:127%;
	font-weight:bold;
	text-shadow:1px 1px 1px #af101c;
	text-align:center;
	background-color:#e60012;
	box-shadow:#b6b5b5 2px 2px;
	border:none;
	display:inline-block;
	text-decoration:none;
}
.btn_green,
input[type=button].btn_green {
	background-color:#49c5a3;
	color:#ffffff;
	box-shadow:#07926c 2px 2px;
	border:none;
	display:inline-block;
	padding:2px 5px 0 5px;
	line-height:150%;
}
.btn_gray,
a.btn_gray,
input[type=submit].btn_gray {
	color:#ffffff;
	font-family:'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','メイリオ',Meiryo,Verdana,osaka,'ＭＳ Ｐゴシック','MS PGothic',sans-serif ;
	font-weight:bold;
	text-align:center;
	background-color:#7d7d7d;
	box-shadow:#c3c2c2 2px 2px;
	border:none;
	display:inline-block;
	text-decoration:none;
}
.arrow01,
a.arrow01 {
	background:url(../img/bg_btn_arrow01.png) no-repeat 95% center #e60012;
	background-size:auto 1.5em;
	padding:12px 0;
}
.arrow02,
a.arrow02 {
	background:url(../img/bg_btn_arrow02.png) no-repeat 95% center #e60012;
	background-size:auto 1.2em;
	padding:12px 0;
}
.arrow03,
a.arrow03 {
	background:url(../img/bg_btn_arrow03.png) no-repeat 5% center;
	background-size:auto 1.5em;
	padding:12px 0;
	font-size:127%;
}
.btn_img01 {
	background:url(../img/bg_btn_arrow01.png) no-repeat 96% center, url(../img/bg_btn_img01.png) no-repeat 5% center #e60012;
	background-size:auto 1.5em;
	padding:12px 0;	
}
.btn_img02,
a.btn_img02 {
	background:url(../img/bg_btn_arrow01.png) no-repeat 96% center, url(../img/bg_btn_img02.png) no-repeat 4% center #e60012;
	background-size:auto 1.5em;
	padding:12px 0;
}
.btn_img03,
a.btn_img03 {
	background:url(../img/bg_btn_arrow01.png) no-repeat 96% center, url(../img/bg_btn_img03.png) no-repeat 4% center #e60012;
	background-size:auto 1.5em;
	padding:15px 0;
}
.btn_card01,
a.btn_card01 {
	background:url(../img/bg_btn_img04.png) no-repeat 5% center #e60012;
	background-size:auto 2em;
	padding:25px 0;
}
.btn_card02,
a.btn_card02 {
	background:url(../img/bg_btn_img05.png) no-repeat 5% center #e60012;
	background-size:auto 2em;
	padding:25px 0;
}
.btn_pdf,
a.btn_pdf {
	background:url(../img/bg_btn_arrow01.png) no-repeat 96% center, url(../img/bg_btn_img06.png) no-repeat 3% center #e60012;
	background-size:auto 2em;
	padding:10px 0;
}
.btn_area {
	text-align:center;
}
/*ポップアップ*/
.popup_area {
	background-color:rgba(0,1,1,0.5);
	position:absolute;
	top:0;
	height:100%;
	width:100%;
	display:none;
}
.popup_area .popup {
	background-color:#f4f3f0;
	padding:20px 0;
	width:70%;
	position:absolute;
	top:50%;
	left:15%;
}
.popup_area .popup p {
	text-align:center;
}
.popup_area .btn_area {
	margin:20px 0 0;
}
.popup_area .btn_area .btn {
	box-shadow:none;
	padding:10px;
}
.popup_area .btn_ok {
	background-color:#e60012;
	color:#ffffff;
	padding:10px;
	width:8em;
	text-align:center;
	margin:20px auto 0;
	cursor:pointer;
}

/*パーツ*/
.w100p { width:100%; box-sizing:border-box; }
.w70p { width:70%; box-sizing:border-box; }

.mt10 { margin-top:10px !important; }
.mt15 { margin-top:15px !important; }
.mt20 { margin-top:20px !important; }
.mt30 { margin-top:30px !important; }
.mt120 { margin-top:120px !important; }
.mb40 { margin-bottom:40px !important; }
.pb0 { padding-bottom:0 !important; }

.text { line-height:180%; }
.t-center { text-align:center; }
.t-bold { font-weight:bold; }
.font-s { font-size:96%; }
.font-ss { font-size:82%; }


/* 01 top
-----------------------*/
#top #container {
	width:auto;
	background:url(../img/01_top_bg.jpg) no-repeat center bottom;
	background-size:100% auto;
}
#top .main_btn,
#top .normal_btn {
	overflow:hidden;
	margin:0 3%;
	padding:0 0 8px 0;
}
#top .main_btn li {
	float:left;
	width:49%;
	margin-right:2%;
}
#top .normal_btn li {
	float:left;
	width:32%;
	margin-right:2%;
}
#top .main_btn li:last-child,
#top .normal_btn li:last-child {
	margin:0;
}

/* 02 会員登録・06 変更・26 求人広告
-----------------------*/
#form #container {
	padding:20px 0 40px;
}
#form .box_gray {
	background-color:#eeeeee;
	padding:15px 2%;
}
#form .formbox {
	border:1px solid #cccccc;
}
#form.input .formbox .category {
	padding:10px 2%;
	text-align:center;
}
#form.confirm .formbox .category {
	padding:20px 2%;
	font-weight:bold;
}
#form.confirm .existing {
	font-weight:bold;
}
#form.input .existing {
	text-align:center;
}
#form .formbox dt {
	background-color:#7d7d7d;
	border-bottom:1px solid #e5e5e5;
	color:#ffffff;
	padding:7px 2%;
}
#form .formbox dt span {
	font-size:82%;
}
#form .formbox dt .need {
	background-color:#ffffff;
	color:#e60012;
	border-radius:3px;
	padding:2px 4px;
}
#form .formbox dd {
	padding:10px 2%;
	background-color:#ffffff;
}
#form .formbox select {
	padding:5px 1%;
	border:1px solid #cccccc;
	border-radius:3px;	
}
#form .formbox input.w01{
	width:100%;
	 box-sizing:border-box;
}
#form .formbox input.w02{
	width:40%;
	 box-sizing:border-box;
}
#form .formbox input.w03{
	width:30%;
	 box-sizing:border-box;
}
#form .formbox textarea.w01{
	width:100%;
	box-sizing:border-box;
	height:4em;
}

#form label.cb_img {
	display:inline-block;
	background-position:left center;
	background-size: auto 1.3em;
	text-align:center;
}
#form label.cb_img.check {
	background-position:left center;
	background-size: auto 1.3em;	
}
#form label.item {
	padding:2px 2em 9px 0;
}
#form .formbox label.rd_img {
	padding:0 2em 0 0;
	display:inline-block;
	line-height:150%;
	background-position:left center;
	background-size: auto 1.3em;
}
#form .formbox label.rd_img.check {
	background-position:left center;
	background-size: auto 1.3em;	
}
#form .formbox .zip {
	font-size:91%;
	display:block;
	width:50%;
	margin:7px 0 0 0;
}
#form .btn_area {
	margin:20px auto 0;
}
#form .txt_lavel {
	line-height:150%;
}
#form.job_confirm .table01 {
	width:100%;
	border:2px solid #cccccc;
	border-top:5px solid #e70012;
	border-collapse:collapse;
}
#form.job_confirm .table01 th {
	background-color:#f4f3ef;
	border-bottom:1px solid #ffffff;
	vertical-align:middle;
	text-align:center;
	padding:8px 12px;
	word-break:keep-all;
}
#form.job_confirm .table01 td {
	border-bottom:1px solid #f4f3ef;
	padding:8px;
	line-height:140%;
}
#form.job_confirm .table01 th.ad_ttl {
	text-align:left;
	font-size:118%;
	font-weight:bold;
	padding:10px 15px;
	line-height:130%;
	background-color:#ffffff;
}
#form.job_confirm .table01 th.ad_ttl span {
	color:#e60012;
	font-weight:bold;
}




/* 03 マイストア
-----------------------*/
#mystore #container {
	padding:20px 0 40px;
}
#mystore .arealist {
	border:1px solid #cccccc;
}
#mystore .arealist dt {
	color:#ffffff;
	background:url(../img/btn_acc_open.png) no-repeat 97% center #e60012;
	background-size: auto 1em;
	padding:15px 8px;
	border-bottom:1px solid #cccccc;
}
#mystore .arealist dt.active {
	background:url(../img/btn_acc_close.png) no-repeat 97% center #e60012;
	background-size: auto 1em;
}
#mystore .arealist dd {
	display:none;
}
#mystore .arealist .shoplist li {
	border-bottom:1px solid #cccccc;
	overflow:hidden;
}
#mystore .arealist .shoplist label.cb_img {
	padding:15px 8px;
	display:block;
	background-position:97% center;
	background-size: auto 1.7em;
}
#mystore .arealist .shoplist label.cb_img.check {
	background-position:97% center;
	background-size: auto 1.7em;	
}
#mystore .arealist .shoplist input[type=checkbox] {
	float:right;
}
#mystore .btn_area {
	margin:20px auto 0;
}


/* 07 パスワード再設定
-----------------------*/
#pw #container {
	padding:20px 0 40px;
}
#pw .form_area dt {
	color:#e60012;
	font-size:109%;
	padding-bottom:10px;
	margin:20px 0 0 0;
}
#pw .btn_area {
	margin:65px auto 0;
}


/* 09 マイストア情報
-----------------------*/
#storeinfo #container {
	padding:20px 0 40px;
}
#storeinfo .storeinfo {
	border:1px solid #cccccc;
	border-top:5px solid #e60012;
}
#storeinfo .storeinfo h2 {
	padding:8px 10px;
	font-size:118%;
	font-weight:bold;
}
#storeinfo .storeinfo h2 span {
	font-size:84%;
	font-weight:normal;
}
#storeinfo .storeinfo table {
	width:100%;
}
#storeinfo .storeinfo table th{
	background-color:#f4f3f0;
	border-top:1px solid #f4f3f0;
	border-bottom:1px solid #ffffff;
	text-align:center;
	padding:10px 15px;
	vertical-align:middle;
	word-break:keep-all;
}
#storeinfo .storeinfo table td{
	border-top:1px solid #f4f3f0;
	border-bottom:1px solid #f4f3f0;
	padding:10px 15px;
	line-height:150%;
}
#storeinfo .storeinfo .ico_list {
	overflow:hidden;
	margin-bottom:-11px;
}
#storeinfo .storeinfo .ico_list:last-child {
	padding-bottom:0;
}
#storeinfo .storeinfo .ico_list li {
	float:left;
	width:19%;
	margin:0 2% 11px 0;
}
#storeinfo .storeinfo .map {
	padding:8px;
}
#storeinfo .btn_area {
	margin:22px auto 0;
}


/* 12 イベントカレンダー
-----------------------*/
#event #container {
	padding:20px 0 40px;
}
#event #container a {
	color:#e60012;
}
#event h2 {
	font-size:127%;
	font-weight:bold;
	padding:0 0 10px 3em;
	line-height:140%;
	border-bottom:1px solid #c9c9c9;
	box-shadow:0 1px #ebebeb;
}
#event h2.event {
	background:url(../img/12_ico_event.png) no-repeat left top;
	background-size:3em auto;
	margin-bottom:15px;
}
#event .price {
	background:url(../img/12_ico_price.png) no-repeat left 3px;
	background-size:3em auto;
	border-bottom:1px solid #c9c9c9;
	box-shadow:0 1px #ebebeb;
	padding:0 0 10px 3em;
}
#event .price h2 {
	border:none;
	box-shadow:none;
	padding:0 0 10px 0;
}

#event .price .day {
	font-size:90%;
	font-weight:bold;
	display:block;
	line-height:130%;
}
#event .image,
#event .text {
	margin-bottom:12px;
}
#event .item {
	padding:15px 2%;
	border-bottom:1px solid #c9c9c9;
	box-shadow:0 1px #ebebeb;
	overflow:hidden;
}
#event .item .name {
	font-size:109%;
	line-height:130%;
	margin:0 0 5px 0;
}
#event .item .name span {
	font-size:75%;
	display:block;
}
#event .item dl {
	margin-left:35%;
	margin-top:10px;
}
#event .item dl dt {
	font-size:82%;
}
#event .item dl dt span.label {
	border-radius:3px;
	color:#ffffff;
	font-size:105%;
	padding:3px 0.5em;
}
#event .item dl dt span.add {
	font-size:89%;
}
#event .item dd {
	font-size:109%;
	margin-top:8px;
	line-height:140%;
	padding-left:3.5em;
}
#event .item dd span {
	font-size:83%;
}
#event .item dl.old_price {
	background:url(../img/12_arrow.png) no-repeat 5em bottom;
	background-size:auto 19px;
	padding-bottom:25px;
}
#event .item dl.old_price dt span.label {
	background-color:#666666;
}

#event .item dl.new_price {
	color:#e60012;
}
#event .item dl.new_price dt span.label {
	background-color:#e60012;
	color:#ffffff;
}
#event .item .photo {
	width:30%;
	max-height:30%;
	float:left;
	padding:0 3% 0 0; 
}


/* 14 チラシ
-----------------------*/
#flier #container {
	width:100%;
	padding:0 0 60px;
}
#flier h2 {
	background-color:#ebebeb;
	font-size:109%;
	padding:12px 0;
	text-align:center;
}
#flier dl {
	width:100%;
	display:table;
}
#flier dl {
	width:100%;
	border-bottom:1px solid #c9c9c9;
	box-shadow:#ebebeb 0 1px;
	margin-bottom:1px;
}
#flier dt {
	font-size:109%;
	line-height:140%;
	border-left:3px solid #7c000a;
	background:url(../img/14_ico_flier.png) no-repeat 0.7em center;
	background-size: auto 2.5em;
	padding:14px 0 14px 3.5em;
	vertical-align:middle;
	display:table-cell;
}
#flier dd {
	vertical-align:middle;
	padding:14px 0 14px 10px;
	white-space: nowrap;
	display:table-cell;
	width:8em;
}
#flier dd .arrow02 {
	font-size:91%;
	padding:10px 18px 10px 5px;
	text-align:left;
}
#flier figure {
	margin:0;
}
#flier .exp {
	font-size:91%;
	text-align:center;
	padding:50px 0;
}

/* 16 グループ管理
-----------------------*/
#group #container {
	padding:20px 0 40px;
}
#group .groupinfo {
	border:1px solid #cccccc;
	border-top:5px solid #e60012;
}
#group .groupinfo h2 {
	font-size:118%;
	font-weight:bold;
	padding:10px 10px;
	border-bottom:1px solid #c9c9c9;
	box-shadow:0 1px #ebebeb;
}
#group .groupinfo h2 span {
	font-size:84%;
	font-weight:normal;
}
#group .groupinfo table {
	width:100%;
}
#group .groupinfo table th{
	font-size:82%;
	font-weight:bold;
	background-color:#f4f3f0;
	border-top:1px solid #ffffff;
	text-align:center;
	padding:5px 15px;
	vertical-align:middle;
	word-break:keep-all;
}
#group .groupinfo table th:first-child {
	border-right:1px solid #ffffff;	
}
#group .groupinfo table td{
	border-top:1px solid #c9c9c9;
	padding:10px 5px;
	line-height:150%;
}

#group .groupinfo table .parent {
	width:4em;
	text-align:center;
}
#group .groupinfo table .name {
	font-size:109%;
}
#group .groupinfo table .state {
	font-size:109%;
	text-align:center;
	font-weight:bold;
}
#group .groupinfo table .registered .state {
	color:#e60012;
}
#group .groupinfo table .button {
	width:4em;
	text-align:center;	
}
#group .groupinfo table .parent span {
	font-size:82%;
	font-weight:bold;
	border:2px solid #e60012;
	border-radius:5px;
	padding:3px 5px;
	color:#e60012;
}
#group .groupinfo table td .btn {
	font-size:82%;
	padding:5px 10px;
}
#group .groupinfo table td .btn_gray {
	font-size:82%;
	padding:5px 10px;
}
#group .popup_area .btn_area .btn,
#group .popup_area .btn_area input[type=submit].btn  {
	width:36%;
}

#group .form_area dt {
	color:#e60012;
	font-size:109%;
	padding-bottom:10px;
	margin:20px 0 0 0;
}
#group .card_list {
	width:76%;
	margin:0 auto;
}
#group .card_list li {
	margin:20px 0;
	padding:9px;
}
#group .card_list li.select {
	border:1px solid #e60012;
	border-radius:5px;
}
#group .card_list li .btn {
	background-color:#7d7d7d;
	box-shadow:#c3c2c2 2px 2px;
}
#group .card_list li.select .btn {
	background-color:#e60012;
}
#group .btn_area {
	margin:30px auto 0;
}


/* 22 オススメ商品
-----------------------*/
#items #container {
	padding:20px 0 40px;
}
#items .iteminfo {
	border:1px solid #cccccc;
	border-top:5px solid #e60012;
	padding:16px 3% 20px;
}
#items .iteminfo dl dt {
	font-weight:bold;
	margin:15px 0 5px;
}
#items .iteminfo dl dd a {
	color:#e60012;
}
#items .info_area {
	border-bottom:1px solid #c9c9c9;
	box-shadow:#ebebeb 0 1px;
	padding:0 0 1em 0;
}
#items .info_area .copy {
	font-size:109%;
	line-height:130%;
}
#items .info_area .copy span {
	font-size:75%;
}
#items .info_area h2 {
	font-size:136%;
	border-bottom:1px solid #c9c9c9;
	box-shadow:#ebebeb 0 1px;
	margin:15px 0 12px 0;
	line-height:130%;
	padding:0 0 5px 0;
}
#items .info_area dl dd {
	line-height:180%;
	font-size:90%;
}

#items .btn_pdf,
a.btn_pdf {
	font-size:113%;
	margin:15px 0 0 0;
}
#items .btn_pdf span {
	display: block;
	width: 75%;
	text-align: center;
	line-height: 130%;
	font-weight:bold;
	font-size:85%;
	margin: 0 auto;
}
#items .btn_pdf span.en {
	display:block;
	font-size:64%;
	font-weight:bold;
	text-align:center;
	padding-bottom:4px;
}
#items .movie_area {
	position: relative;
	padding-bottom: 56.25%;
	padding-top: 30px;
	height: 0;
	overflow: hidden;
}
#items .movie_area iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

/* 商品写真スライダー */
.wideslider {
	width: 100%;
	height:auto;
	text-align: left;
	position: relative;
	padding:0 0 20px 0;
	margin:0 0 12px 0;
}
.wideslider ul,
.wideslider ul li {
	float: left;
	display: inline;
	overflow: hidden;
}
.wideslider ul li img {
	display: none;
}
.wideslider_base {
	top: 0;
	position: absolute;
	overflow:hidden;
}
.wideslider_wrap {
	top: 0;
	position: absolute;
	overflow: hidden;
}
.slider_prev,
.slider_next {
	overflow: hidden;
	position: absolute;
	z-index: 300;
	cursor: pointer;
}
.wideslider .inner_width .slider_next{
	position:absolute;
	right:0 !important;
	z-index: 300;
	background: url(../img/22_arrow_r.png) no-repeat right center;
	background-size:60% auto;
}
.wideslider .inner_width .slider_prev {
	position:absolute;
	left:0 !important;
	z-index: 300;
	background: url(../img/22_arrow_l.png) no-repeat left center;
	background-size:60% auto;
}
.pagination {
	bottom: 0;
	left: 0;
	width: 100%;
	height: 10px;
	text-align: center;
	position: absolute;
	z-index: 200;
}
.pagination a {
	margin: 0 3px;
	width: 3%;
	height: 1em;
	display: inline-block;
	overflow: hidden;
	background: url(../img/22_page_off.png) no-repeat top center;
	background-size:contain;
}
.pagination a.active {
	background: url(../img/22_page_on.png) no-repeat top center;
	background-size:contain;	
}

/* 24 FAQ
-----------------------*/
#faq #container {
	padding:20px 0 0;
}
#faq h2 {
	margin:0 0 15px 0;
	font-size:109%;
	font-weight:bold;
}
#faq .question {
	margin-bottom:10px;
}
#faq .question dt {
	background: url(../img/24_ico_q.png) no-repeat left top;
	background-size:auto 25px;
	color:#e60012;
	font-weight:bold;
	line-height:154%;
	border-bottom:1px solid #c9c9c9;
	padding:0 0 5px 35px;
	min-height:25px;
}
#faq .question dd {
	background: url(../img/24_ico_a.png) no-repeat left 5px;
	background-size:auto 25px;
	line-height:154%;
	padding:5px 0 20px 35px;
}



