@charset "utf-8";

/*========================================================================
 All setting
========================================================================*/

body {
background-color: #FFFFFF;
font-family: 'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','メイリオ','Meiryo','ＭＳ Ｐゴシック','sans-serif';
font-size: 14px;
color: #333333;
text-align: center;
margin: 0;
padding: 0;
}
a:link {
color: #222222;
text-decoration: none;
}
a:visited {
color: #222222;
text-decoration: none;
}
a:active {
color: #999999;
text-decoration: none;
}
a:hover {
color: #999999;
text-decoration: none;
transition: 0.3s;
}
a:hover img {
opacity: 0.7;
transition: 0.3s;
}
h1, h2, h3, h4, h5, p {
font-weight: normal;
margin: 0;
padding: 0;
}
ul {
list-style: none;
margin: 0;
padding: 0;
}
strong {
color: #FF0000;
font-weight: bold;
}
#container_all {
clear: both;
z-index: 100;
background-color: #FFFFFF;
width: 100%;
min-width: 1050px;
text-align: center;
margin: 0 auto;
}
#container {
clear: both;
z-index: 100;
background-color: #FFFFFF;
width: 1050px;
text-align: center;
margin: 0 auto;
}
#container-fixed {
clear: both;
position: fixed;
z-index: 1000;
background-color:rgba(255,255,255,0.8);
width: 100%;
min-width: 1050px;
text-align: left;
}
img {
border: 0;
}
section {
clear:both;
}
.no {
margin: 0;
padding: 0;
border: 0;
}

@media screen and (max-width: 768px) {
	
	#container_all {
	width: 100%;
	margin: 0 auto;
}
	
	#container {
	width: 100%;
		text-align: left;
		margin: 0 auto;
		clear: both;
	}


}

@media screen and (max-width: 640px) {
	#container_all {
	width: 100%;
	margin: 0 auto;
}
	
	#container {		
		width: 100%;
		text-align: left;
		margin: 0 auto;
	}


}
	
	

/*========================================================================
 ヘッダー
========================================================================*/



.h2 {
font-size: 12px;
color: #FFFFFF;
display: block;
width: 100%;
height: 20px;
float: left;
}
.h2 a:link {
color: #FFFFFF;
text-decoration: none;
}
.h2 a:visited {
color: #FFFFFF;
text-decoration: none;
}
.h2 a:active {
color: #CCCCCC;
text-decoration: none;
}
.h2 a:hover {
color: #CCCCCC;
text-decoration: none;
transition: 0.3s;
}
.h2 .left {
float: left;
padding-left: 133px;
}
.h2 h1 {
font-size: 12px;
margin: 1px 0 0 0;
}
.h2 .right {
float: right;
text-align: right;
}
.h2 ul {
margin-top: 1px;
}
.h2 ul li {
float: right;
margin-left: 10px;
padding: 0 0 0 10px;
border-left: #FFFFFF 1px solid;
}
.h2 ul li.ri {
padding: 0 10px;
border-right: #FFFFFF 1px solid;
}
.h3 {
width: 100%;
height: 54px;
float: left;
}
.h3 .left {
background-image: url(../img/search_bg.png);
background-repeat: no-repeat;
background-position: 150px 14px;
float: left;
text-align: center;
padding-left: 133px;
}
.h3 .left .category {
float: left;
}
.h3 .left .text {
float: left;
}
.h3 .left .bo {
float: left;
}
.h3 .middle {
float: left;
margin: 14px 0 0 0;
padding-left: 10px;
}
.h3 .middle img {
width: 125px;
height: 25px;
}
.h3 .right {
float: right;
margin: 18px 0 0 0;
}
.h3 ul {
list-style-position: inside;
font-size: 12px;
}
.h3 ul li {
float: right;
margin-right: 10px;
}
.h3 ul li.mypage {
list-style-image: url(../img/po_mypage.png)
}
.h3 ul li.login {
list-style-image: url(../img/po_login.png)
}
.h3 ul a:link {
color: #3fa9f5;
text-decoration: none;
}
.h3 ul a:visited {
color: #3fa9f5;
text-decoration: none;
}
.h3 ul a:active {
color: #b2c7f5;
text-decoration: none;
}
.h3 ul a:hover {
color: #b2c7f5;
text-decoration: none;
transition: 0.3s;
}


@media screen and (max-width: 768px) {
	.h2 {
		width: 100%;
		font-size: 12px;
		display: block;
		width: 100%;
		height: auto;
		 text-align: left;
}

.h3 .right {
		float: left;
		margin: 18px 0 0 0;
}
.h3 ul {
		list-style-position: inside;
		font-size: 12px;
}
.h3 ul li {
		float:left;
		margin-left: 10px;
}


.h3 .left {
		background-image: url(../img/search_bg.png);
		background-repeat: no-repeat;
		background-position: 5px 10px;
      	text-align: left;
		padding-: 0px;
		display: block;
}

.h3  .category {
		display: block;
		float: left;
		width: 20%;

}

.h3 .left .text {
		float: left;
		width: 20%;
		margin:0;
}
.h3 .left .bo {
		float: left;
}


.h3 .middle {
		float: left;
		margin: 10px 0 0 0;
		ext-align: center;
}

.h3 .middle img {
		width: 60%;
		height: auto;
}



}

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

/*----------------------------------
ヘッダー
---------------------------------- */
.header_wrap {
	width: 100%;
	background-image: url(../common/page_top.gif), url(../common/line.gif);
	background-repeat: repeat-x, repeat-x;
	background-position: top, bottom;
	border-bottom: 1px #333 solid;
}

.header {
	position: relative;
	width: 1020px;
	margin: 0 auto;
}

.logo img {width: 167px; height: 80px; margin: 15px auto 25px; padding: 0 5px 0 0; text-align: center;}

/* カート　-------- */
.cart {
	display: block;
	background: #999;
	font-size: 12px;
	padding: 5px;
	color: #fff;
}


.header_cart {
	position: absolute;
	top: 30px;
	left: 0;
}
.header .cart:hover {background: #666;}
.cart a:link {color: #fff;}
.cart a:visited {color: #fff;}
.cart a:hover {color: #fff; text-decoration: none;}

/* 言語選択　-------- */
.language {
	position: absolute;
	top: 5px;
	left: 0;
	font-size: 12px;
}

.language li {
	float: left;
	padding-top: 3px;
	padding-bottom: 3px;
	margin-right: 15px;
	white-space: nowrap;
}

.language .cr a:link {color: #fff;}
.language .cr a:visited {color: #fff;}
.language .cr a:hover {color: #ee808a; text-decoration: none;}
.language a:hover {color: #ee808a; text-decoration: none;}

@media screen and (min-width: 640px) {
.language .cr {
	padding-right: 12px;
	padding-left: 12px;
	background: #000;
}
}

/* 会員登録・ログイン　-------- */
.header_member {
	position: absolute;
	top: 20px;
	right: 0;
	font-size: 12px;
}

.header_member i {
	font-size: 16px;
	margin-right: 5px;
}
.header_member li {float: left; white-space: nowrap;}
.txtmenu_pad {margin-right: 15px;}

.sp_menu {width: 58%; font-size: 18px; padding: 8px 0;	background: #ee808a;}

/* グローバルナビ　-------- */
.navi {
	width: 100%;
	margin: 0 auto 16px;
	
}
.navi li {
	float: left;
	font-size: 16px;
	width: 150px;
	height: 22px;
	padding: 10px 0  5px  0;
	border-right: 1px #ccc solid;
	margin-bottom: 10px;
}

.navi li a:link {display: block;}
.navi li a:hover {
	color: #ee808a;
	text-decoration: none;
}

@media screen and (min-width: 640px) {
.navi .brd {border-left: 1px #999 solid;}
}

/* スマホ用ボタン　非表示　-------- */
@media screen and (min-width: 640px) {
	#menu {display: block !important;}
	.menubtn {display: none}
}

/*----------------------------------
ヘッダー（タブレット）
---------------------------------- */
@media screen and (min-width: 640px) and (max-width: 1019px) {
	
.header {
	position: relative;
	width: 95%;
	margin: 0 auto;
}
	
.navi {width: 100%; max-width: 856px;}
.navi li {width: 19.7%; max-width: 170px;}
	
}

/*----------------------------------
ヘッダー（スマホ）
---------------------------------- */
@media screen and (max-width: 640px) {

#menu {display: none;}
.menubtn {
	position: absolute;
	z-index: 1;
	padding: 6px 12px;
	border: solid 2px #bbb;
	border-radius: 5px;
	background-color: #000;
	color: #fff;
	cursor: pointer;
}

#navibtn {top: 35px; left: 4%;}
#cartbtn {top: 35px; right: 4%;}
.header_cart a:hover {color: #ee808a; text-decoration: none;}

.header {width: 100%;}
.logo img {width:50%; height: auto; margin: 0 auto; padding: 85px 0 0 0;}
.header_cart {width: 100%; position: absolute; top: 0; left: 0;}
.sp_menu {width: 100%; padding: 0;border-right: 1px #999 solid;	background: #ee808a;}
	
/* 言語選択　-------- */
.language { display: none;}


/* グローバルナビ　-------- */
.navi {
	width: 100%;
	margin: 0;
	background: #fff;
	font-size: 14px;
}
.navi li {
	float: none;
	width: 100%;
	height: 27px;
	padding: 15px 0 5px 0;
	border-right: 0px;
	border-bottom: 1px #999 dotted;
}
.navi li:hover {background: #f6f6f6;}

/* 会員登録・ログイン　-------- */
.header_member {
	position: relative;
	width: 100%;
	top: 0;
	font-size: 15px;
	color: #333;
}

.header_member i {
	display: block;
	font-size: 20px;
	margin: 0 0 5px 0;
}
.header_member li {width: 33%; padding: 10px 0;}
.header_member li:hover {background: #6d6d6d;}
.txtmenu_pad {margin-right: 0px;}
.header_member .brd_r {border-right: 1px #999 solid;	background: #6d6d6d;}
.header_member a:link {color: #fff;}
.header_member a:visited {color: #fff;}
.header_member a:hover {color: #ee808a;}
}



/*----------------------------------
レスポンシブル　画像表示
---------------------------------- */
.pc {display: inline-block !important; }
.sp {display: none !important; }
.tb {display: inline-block !important; }
 
@media screen and (max-width: 640px) {
    .pc {display: none !important; }
    .sp {display: inline-block !important; }
	.tb {display: inline-block !important; }
}

@media screen and (min-width: 640px) and (max-width: 1019px) {
    .tb {display: none !important; }
}



/*========================================================================
 検索バー
========================================================================*/

.search {
font-size: 11px;
margin: 5px 0 0 0;
padding: 0;
}
.search select {
font-size: 11px;
margin: 4px 0 0 0;
padding: 0;
text-align:left;
border:none;
appearance: none;
box-sizing: content-box;
}
.search .search_text {
width: 250px;
margin: 4px 10px 0 0;
border:none;
}
.search input::-webkit-input-placeholder,
.search select::-webkit-input-placeholder
.search input::-moz-placeholder,
.search select::-moz-placeholder {
color:#BCC1C3;
}
.search_btn {
width: 50px;
height: 25px;
}

@media screen and (max-width: 768px) {
	.search {
	clear: both;
	display: block;
	}
	
	.search select {
		font-size: 11px;
		margin: 0;
		padding: 0;
		text-align:left;
		border:none;
		appearance: none;
		box-sizing: content-box;
}

.search .search_text {
		width:  30%;
		margin: 0;
		border:none;
}



}


/*========================================================================
 メインメニュー
========================================================================*/

/*========================================================================
 TOP画像
========================================================================*/

.top_img {
		background-image: url(../img/top_img_bg.png);
		background-repeat: no-repeat;
		background-position: center top;
		width: 100%;
		height: 120px;
		text-align: center;
		float: left;
}
.top_img p {
		font-size: 16px;
		margin-top: 10px;
		line-height: 1.5em;
}
.top_img p .red {
		font-size: 26px;
		color: #FF0000;
		font-weight: bold;
}
.top_img p .blue {
		font-size: 22px;
		color: #29abe2;
		font-weight: bold;
}
.top_img p .black {
		font-size: 22px;
		font-weight: bold;
}

/*========================================================================
 パンくずリスト画像
========================================================================*/

.breadcrumb {
		width: 1050px;
		font-size: 12px;
		text-align: center;
		float: left;
		margin: 0 20px;
		padding-top: 20px;
		border-top: #999 1px dotted;
}
.breadcrumb ul li {
		background-image: url(../img/po_bc.png);
		background-repeat: no-repeat;
		background-position: 0 5px;
		float:left;
		margin:-10px 10px 20px 0;
		padding-left: 12px;
}
.breadcrumb ul li.fast {
		background-image: none;
		padding: 0;
}
/*========================================================================
 メインコンテンツ（TOPページ）
========================================================================*/

main {
width: 100%;
text-align: left;
float: left;
margin-bottom: 30px;
}

.ma_t1 {
background: #eeeeee;
float: left;
margin: 10px 0 0 0;
padding: 20px 0 20px;
}

main h2 {
font-size: 18px;
font-weight: bold;
text-align: left;
margin: 0 0 0 2.02%;
padding: 3px 0 0 10px;
border-left: #3fa9f5 5px solid;
}
main h2 small {
font-size: 12px;
color: #333333;
font-weight: normal;
}
.ma_t1 ul li {
width: 32.38%;
float: left;
margin-right: 10px;
}
.ma_t1 ul li img {
width: 87.87%;
height: 87.87%;
padding: 4%;
}

.ma_t3 {

height: 200px;
float: left;
padding: 40px 0;
margin: 0 20px 0 0;
}
.ma_t3 img {

height: 200px;
}
.ma_t2 {
width: 500px;
height: 200px;
float: left;
text-align: left;
padding: 40px 0;
}
.ma_t2 div {
float: left;
padding: 0 2.02%;
}
.ma_t2 dl dt {
clear: both;
width: 90px;
float: left;
margin: 0 0 10px 0;
}
.ma_t2 dl dd {
width: 410px;
margin: 0 0 10px 0;
padding: 0 0 5px 90px;
border-bottom: 1px #E5E5E5 dotted;
}

@media screen and (min-width: 641px) and (max-width: 789px) {
 main {
	width: 100%;
	height: auto; 
	left: 0; 
	top: 0; 
	margin: 0px; 
	border: 0px;
 }

.ma_t1 {
		width: 100%;
		float: left;
		margin: 0 auto;
	}
	
	
.ma_t1 ul li img {
			width: 95%;
			height: auto;
			
		}
		
	.ma_t1 ul li {
			width: 100%;
			float: left;
		}
		
	.ma_t2 {
		width: 100%;
		height: auto;
		float: left;
		margin: 0 auto;
	}		

	.ma_t3 img {
		width: 100%;
		height: auto;
	}
	
}


@media screen and (max-width: 640px) {

.ma_t1 {
		width: 100%;
		height: auto;
		float: left;
		text-align: left;
		margin: 0 auto;
	}
	
.ma_t1 ul li {
			width: 100%;
			float: left;
		}
		
.ma_t1 ul li img {
			width: 100%;
			max-width: 320px;
			height: auto;
			float: left;
		}
		

.ma_t2 {
		width: 100%;
		height: auto;
		float: left;
		margin: 0 auto;
	}
		
	.ma_t2 div {
		float: left;
		margin: 0 ;
		padding: 0 0 5px 10px;
	}
	
	
		main h2 {
			font-size: 16px;
			font-weight: bold;
			text-align: left;
			margin: 0 0 0 2.02%;
			padding: 3px 0 0 10px;
			border-left: #3fa9f5 5px solid;
		}
		
		main h2 small {
			font-size: 12px;
			color: #333333;
			font-weight: normal;
			text-align: left;
		}


	.ma_t2 dl dt {
		clear: both;
		float: left;
		margin: 0;
	}
	
	.ma_t2 dl dd {
		clear: both;
		float: left;
		padding: 5px;
		text-indent: -10px;
	}


	
	.ma_t3 img {
		width: 100%;
		height: auto;
		margin-left: 10px;
	}




}


/*========================================================================
 メインコンテンツ（運営会社・特定商取引法表記ページ）
========================================================================*/

main table {
		margin: 20px 20px 40px 20px;
		border-top: 1px #E5E5E5 solid;
}
main table th {
		background-color: #d8edfd;
		font-weight: normal;
		width: 150px;
		text-align: center;
		padding: 20px;
		border-bottom: 1px #E5E5E5 solid;
}
main table td {
		width: 860px;
		padding: 20px;
		border-bottom: 1px #E5E5E5 solid;
}

@media all and (max-width: 768px){
	main table {
	margin: 5px 5px 10px 5px;
	border-top: 1px #E5E5E5 solid;
	}
	main table th {
	background-color: #d8edfd;
	font-weight: normal;
	width: 40%;
	text-align: center;
	padding: 5px;
	border-bottom: 1px #E5E5E5 solid;
	}
	main table td {
	padding: 10px;
	border-bottom: 1px #E5E5E5 solid;
	}

}
	
	
/*========================================================================
 メインコンテンツ（個人情報の取り扱いページ）
========================================================================*/

.privacy h3 {
		font-size: 16px;
		font-weight: normal;
		margin: 20px 20px -10px 20px;
		padding: 6px 0 4px 5px;
		border-top: #3fa9f5 1px solid;
		border-bottom: #3fa9f5 1px dotted;
}
.privacy p {
margin: 20px 20px 0 20px;
}
.privacy p.right {
text-align: right;
margin: 40px 20px 0 20px;
}
.privacy ul {
list-style-type: decimal;
margin: 10px 20px 10px 55px;
}
.privacy ul li {
}


@media screen and (max-width: 768px) {
	
	.privacy h3 {
		font-size: 14px;
		
	}
	.privacy p {
		margin: 10px 10px 0 10px;
		text-align: left;
		clear: both;
	}
	.privacy p.right {
		text-align: left;
		margin: 20px 10px 0 10px;
	}
	.privacy ul {
		margin: 5px 10px 5px 25px;
		text-align: left;
		clear: both;
	}
	.privacy ul li {
	}

}
	
/*========================================================================
 メインコンテンツ（お問い合わせページ）
========================================================================*/

@media screen and (max-width: 768px) {
	
	.support h3 {
		font-size: 14px;
		
	}
	.support p {
		margin: 10px 10px 0 10px;
		text-align: left;
		clear: both;
	}
	
	.support p .end {
		text-align: left;
		margin-bottom: 20px;
	}
	.support p img {
	width: 100%;
}
	
	#Form{
		text-align: left;
	}
		
	#Form .contact-form .form-textarea textarea {
	width:100%;
	height: auto;
	border-radius:6px;
	border:none;
}

	#Form .contact-form {
	width:100%;
}
	#Form .contact-form {
	width:100%;
}
	#Form .p_center {
		text-align: left;
		clear: both;
}
	#Form .contact-form-btn{
		text-align: left;
}
	
	
	 #Form	table {
	  border-collapse: collapse;
	}
	 #Form	table td, table th {
	  display: block;
	  padding: 10px;
	}
	 #Form	table th {
	  background-color: #e1f2fa;
	}

}

.support h3 {
		font-size: 16px;
		font-weight: normal;
		margin: 20px 20px -10px 20px;
		padding: 6px 0 4px 5px;
		border-top: #3fa9f5 1px solid;
		border-bottom: #3fa9f5 1px dotted;
}
.support p {
		margin: 20px 20px 0 20px;
}
.support p.end {
		margin-bottom: 40px;
}
.support p img {
		width: 100%;
}
.contact-form {
		width:100%;
}
.contact-form .form-input {
		width: 820px;
		height:25px;
		border-radius:5px;
		border:solid 1px #E6E9EA;
		text-align:left;
		position:relative;
}
.contact-form .form-textarea {
		width: 820px;
		height:150px;
		border-radius:5px;
		border:solid 1px #E6E9EA;
		text-align:left;
		position:relative;
}
.contact-form .form-input input {
		width:100%;
		height:100%;
		border-radius:6px;
		border:none;
}
.contact-form .form-textarea textarea {
		width:100%;
		height:100%;
		border-radius:6px;
		border:none;
}
.contact-form .form-input input::-webkit-input-placeholder,
.contact-form .form-input select::-webkit-input-placeholder,
.contact-form .form-textarea textarea::-webkit-input-placeholder,
.contact-form .form-input input:-moz-placeholder,
.contact-form .form-input select:-moz-placeholder,
.contact-form .form-textarea textarea:-moz-placeholder,
.contact-form .form-input input::-moz-placeholder,
.contact-form .form-input select::-moz-placeholder,
.contact-form .form-textarea textarea::-moz-placeholder,
.contact-form .form-input input:-ms-input-placeholder,
.contact-form .form-input select:-ms-input-placeholder,
.contact-form .form-textarea textarea:-ms-input-placeholder {
color:#BCC1C3;
}
.contact-form-btn {
text-align:center;
}
.contact-form-btn p {
text-align: left;
}
.form-btn {
padding:10px 0;
border-radius:3px;
width:46%;
font-size:13px;
}
.contact-btn {
color:#FFFFFF;
font-size:16px;
border:solid 2px #2CA5DF;
border-radius:30px;
display:inline-block;
text-transform:uppercase;
background-color:#2CA5DF;
}
.contact-sbtn {
margin-top:10px;
padding:10px 0;
border-radius:3px;
width:46%;
font-size:16px;
color:#FFFFFF;
border:solid 2px #2CA5DF;
border-radius:30px;
display:inline-block;
text-transform:uppercase;
background-color:#2CA5DF;
}
.contact-btn:hover, .contact-btn:focus, .contact-sbtn:hover, .contact-sbtn:focus {
color:#FFFFFF;
background-color:#95C3EF;
border-color:#95C3EF;
}
p.p_center {
text-align: center;
margin: 0 20px 40px 20px;
}

/*========================================================================
 メインコンテンツ（購入ガイドページ）
========================================================================*/

.guide h3 {
font-size: 16px;
font-weight: normal;
margin: 20px 20px -10px 20px;
padding: 6px 0 4px 5px;
border-top: #3fa9f5 1px solid;
border-bottom: #3fa9f5 1px dotted;
}
.guide p {
margin: 20px 20px 0 20px;
}
.guide p.end {
margin-bottom: 30px;
}
.guide ul {
list-style-type: decimal;
margin: 10px 20px 10px 55px;
}
.guide ul li {
}

@media screen and (max-width: 768px) {
.guide h3 {
		font-size: 14px;
		padding: 0 0 0 5px;
}
	.guide p {
		clear: both;
		 text-align: left;
}

	.guide p img{
		width: 50%;
		clear: both;
		 text-align: left;
}


	.guide p.end {
		margin-bottom: 20px;
		clear: both;
		 text-align: left;
	}
	.guide ul {
	}
	.guide ul li {
}


.guide　table th {
		  display: block;
		  float: left;
		  width: 30%;
	}
.guide	table tb {
		  display: block;
		  float: left;
		  width: 70%;
}　
}

/*========================================================================
 メインコンテンツ（推奨環境・リンク・著作権ページ）
========================================================================*/

.about h3 {
font-size: 16px;
font-weight: normal;
margin: 20px 20px 20px 20px;
padding: 6px 0 4px 5px;
border-top: #3fa9f5 1px solid;
border-bottom: #3fa9f5 1px dotted;
}
.about p {
margin: 20px 20px 0 20px;
}
.about div {
width: 525px;
float: left;
margin: 0 0 30px 0;
}
.about dl dt {
clear: both;
width: 48px;
float: left;
margin: 0 0 15px 90px;
}
.about dl dd {
float: left;
margin: 15px 0 15px 15px;
}
ul.a_ul1, ul.a_ul2 {
list-style: disc;
}
ul.a_ul1 {
margin: 20px 20px 30px 40px;
}
ul.a_ul2 {
list-style-position: inside;
margin: 10px 0 0 0;
}
ul.a_ul2 li {
width:315px;
float: left;
margin: 0 0 0 35px;
}
ul.a_ul2 li.end {
margin-bottom: 40px;
}

/*========================================================================
 メインコンテンツ（会員登録申請ページ）
========================================================================*/

.member-form {
width:100%;
}
.member-form table {
margin: 20px 20px 40px 20px;
border-top: 1px #E5E5E5 solid;
}
.member-form table th {
background-color: #d8edfd;
font-weight: normal;
width: 240px;
text-align: center;
padding: 20px;
border-bottom: 1px #E5E5E5 solid;
}
.member-form table td {
width: 770px;
line-height: 1.5em;
padding: 20px 20px 10px 20px;
border-bottom: 1px #E5E5E5 solid;
}
.member-form .form-input {
height:25px;
border:solid 1px #E6E9EA;
text-align:left;
position:relative;
margin-bottom: 10px;
padding: 0 5px;
}
.company, .president, .name {
width: 300px;
}
.post {
width: 90px;
}
.municipality {
width: 150px;
}
.address, .mail, .url {
width: 500px;
}
.destination {
width: 730px;
}
.member-form .form-textarea {
width: 730px;
height:150px;
border:solid 1px #E6E9EA;
text-align:left;
position:relative;
}
.member-form .form-input input {
width:100%;
height:100%;
border:none;
}
.member-form .form-textarea textarea {
width:100%;
height:100%;
border:none;
}
.member-form .form-input input::-webkit-input-placeholder,
.member-form .form-input select::-webkit-input-placeholder,
.member-form .form-textarea textarea::-webkit-input-placeholder,
.member-form .form-input input:-moz-placeholder,
.member-form .form-input select:-moz-placeholder,
.member-form .form-textarea textarea:-moz-placeholder,
.member-form .form-input input::-moz-placeholder,
.member-form .form-input select::-moz-placeholder,
.member-form .form-textarea textarea::-moz-placeholder,
.member-form .form-input input:-ms-input-placeholder,
.member-form .form-input select:-ms-input-placeholder,
.member-form .form-textarea textarea:-ms-input-placeholder {
color:#BCC1C3;
}
.member-form-btn {
text-align:center;
}
.member-form-btn p {
text-align: left;
}
.form-btn {
padding:10px 0;
border-radius:3px;
width:46%;
font-size:13px;
}
.member-btn {
color:#FFFFFF;
font-size:16px;
border:solid 2px #2CA5DF;
border-radius:30px;
display:inline-block;
text-transform:uppercase;
background-color:#2CA5DF;
}
.member-sbtn {
margin-top:10px;
padding:10px 0;
border-radius:3px;
width:46%;
font-size:16px;
color:#FFFFFF;
border:solid 2px #2CA5DF;
border-radius:30px;
display:inline-block;
text-transform:uppercase;
background-color:#2CA5DF;
}
.member-btn:hover, .member-btn:focus, .member-sbtn:hover, .member-sbtn:focus {
color:#FFFFFF;
background-color:#95C3EF;
border-color:#95C3EF;
}

/*========================================================================
 メインコンテンツ（カートページ）
========================================================================*/

main.eccube {
width: 1050px;
text-align: left;
margin: 0;
padding: 118px 0 50px 0;
}

/*========================================================================
 フッター
========================================================================*/

footer {
width: 100%;
text-align: center;
float: left;
margin: 0;
}
.fo_blue {
background-color: #adcada;
width: 100%;
text-align: left;
float: left;
margin: 0 auto;
padding: 20px 0;
}
.fo_blue div {
width: 50%;
float: left;
}
footer h4 {
font-size: 16px;
font-weight: bold;
margin: 0 0 0 2.02%;
padding: 0 0 0 5px;
border-left: #666666 5px solid; 
}
footer h4 small {
font-size: 12px;
color: #333333;
font-weight: normal;
}
.fo_blue h5 {
clear: both;
font-size: 14px;
margin: 20px 2.02% 0 4.04%;
padding: 0 0 2px 0;
border-bottom: #666666 1px dotted;
}
footer p {
clear: both;
font-size: 12px;
margin: 10px 2.02% 0 4.04%;
}
.fo_blue ul {
list-style: disc;
list-style-position: inside;
margin: 10px 4.04% 0;
}
.fo_blue ul li {
font-size: 12px;
float: left;
margin: 0 10px 5px;
}
.fo_blue ul li.none {
float: none;
}
.fo_blue ul li.last {
margin: 0 10px 10px;
}
footer dl {
font-size: 12px;
margin: 10px 36% 0 6.06%;
}
footer dl dt {
clear: both;
width: 70px;
float: left;
margin: 0 0 6px 0;
padding: 0 0 2px 5px;
}
footer dl dd {
margin: 0 0 6px 0;
padding: 0 0 2px 70px;
border-bottom: #666666 1px dotted;
}
footer .calendar_box {
margin: 0 6.06% 0 4.04%;
}
.fo_green {
background-color: #8faeae;
width: 100%;
text-align: left;
float: left;
margin: 0 auto;
padding: 20px 0;
}
.fo_green div {
width: 50%;
float: left;
}
.fo_green h5 {
clear: both;
font-size: 14px;
margin: 20px 3.03% 0 6.06%;
padding: 0 0 2px 0;
border-bottom: #666666 1px dotted;
}
.fo_green ul {
list-style: disc;
list-style-position: inside;
margin: 10px 4.04% 0;
}
.fo_green ul li {
font-size: 12px;
margin: 0 10px 5px;
}
.fo_green ul li.none {
float: none;
}
.fo_green ul li.last {
margin: 0 10px 10px;
}
.fo_black {
background-color: #000000;
width: 100%;
float: left;
margin: 0 auto;
padding: 5px 0;
}
.fo_black copy {
font-size: 12px;
color: #CCCCCC;
text-align: center;
}
.fo_black a:link {
color: #CCCCCC;
text-decoration: none;
}
.fo_black a:visited {
color: #CCCCCC;
text-decoration: none;
}
.fo_black a:active {
color: #CCCCCC;
text-decoration: none;
}
.fo_black a:hover {
color: #CCCCCC;
}

@media screen and (min-width: 640px) and (max-width: 1020px) {

footer {
		width: 100%;

		text-align: left;
		float: left;
		margin: 0;
	}
	.fo_blue01{
		clear: both;
		width: 95%;

		text-align: left;
		float: left;
		margin: 0;
}
	

		.fo_green01{
		clear: both;
		width: 95%;
		text-align: left;
		float: left;
		margin: 0;
}

}
@media screen and (max-width: 640px) {
	footer {

		text-align: left;
		float: left;
		margin: 0;
	}


	footer h4 {
		font-size: 14px;
		padding: 0 0 0 5px;
}
	
	footer p {
		clear: both;
		float: left;

	}
	

	.fo_blue ul {
		list-style: disc;
		list-style-position: inside;
}

		.fo_blue01{
		width: 100%;
		clear: both;
		text-align: left;
		float: left;
		margin: 0;
}
	.fo_blue div {
	width: 100%;
	float: left;
}

	.fo_green div {
		width: 100%;
		float: left;
}
	.fo_green01{
		width: 100%;
		clear: both;
		text-align: left;
		float: left;
		margin: 0;
}
	

footer img{
		width: 100%;
		max-width: 360px;
		text-align: left;
	}
	
	footer p .fo_blue ul li {
		float: none;
		width: 100%;
}

	.fo_black{
			text-align: left;
			margin:0;
	}
	.fo_black copy {
	font-size: 12px;
	color: #CCCCCC;
	text-align: center;
	padding: 10px;
}



}


/*========================================================================
 ページTOPボタン
========================================================================*/

#pt {
position: fixed;
right: 25px;
bottom: 25px;
}
#pt p {
background-color: rgba(153,153,153,0.7);
font-size: 20px;
padding: 10px 12px 8px;
border-radius: 5px; 
}
#pt a:link {
color: #333333;
text-decoration: none;
}
#pt a:visited {
color: #333333;
text-decoration: none;
}
#pt a:active {
color: #999999;
text-decoration: none;
}
#pt a:hover {
color: #999999;
}


/*========================================================================
 商品詳細ページ
========================================================================*/

.goods_detail_left {
width: 45%;
float: left;
padding-left: 8px;
padding-right: 8px;
}
.goods_detail_left .item_photo_area {
width: 50%;
}
.goods_detail_right {
width: 50%;
float: left;
padding-left: 8px;
padding-right: 8px;
}
.goods_detail_right .item_detail_area {
width: 100%;
}
.goods_detail_right .non_member {
background-color: rgba(255,0,4,0.2);
width: 100%;
text-align: center;
margin: 0 0 20px 0;
padding: 10px;
border: #FF0000 2px solid;
}
.goods_detail_right .non_member p.big {
font-size: 40px;
color: #FF0000;
font-weight: bold;
}
.goods_detail_right .non_member p.member_btn {
margin: 10px 0 10px 0;
}
.goods_detail_right .non_member p.member_btn img {
width: 125px;
height: 25px;
margin-top: 10px;
}
.goods_detail_right .freearea h3 {
font-size: 20px;
font-weight: normal;
margin: 20px 0;
padding: 6px 0 4px 8px;
border-left: #3fa9f5 5px solid;
}
.goods_detail_right .freearea .goods_detail {
width: 100%;
margin-top: 30px;
}
.goods_detail_right .freearea .goods_detail p {
clear: both;
font-size: 14px;
line-height: 1.3em;
margin: 0;
padding: 0;
}
.goods_detail_right .freearea .goods_detail table {
width: 100%;
margin: 0;
padding: 0;
border-top: 1px #E5E5E5 solid;
}
.goods_detail_right .freearea .goods_detail table tr td.gd1 {
background-color: #d8edfd;
font-weight: normal;
width: 26%;
text-align: center;
padding: 40px 40px 0 40px;
border-bottom: 1px #E5E5E5 solid;
}
.goods_detail_right .freearea .goods_detail table tr td.gd2 {
width: 64%;
padding: 40px 40px 0 40px;
border-bottom: 1px #E5E5E5 solid;
}

@media screen and (max-width: 640px) {
	
	.goods_detail_left {
			width: 80%;
			float: left;
			padding-left: 8px;
			clear: both;
			text-align:left;
		}
		.goods_detail_left .item_photo_area {
			clear: both;
			text-align:left;
			width: 80%;
			
		}
		
		.goods_detail_left .item_photo_area img {
			clear: both;
			text-align:left;
			width: 80%;
			
		}
		
		.goods_detail_right {
			float: left;
			padding-left: 8px;
		}
		.goods_detail_right .item_detail_area {
			clear: both;
			text-align:left;
			
		}
		.goods_detail_right .non_member {
			background-color: rgba(255,0,4,0.2);
			width: 60%;
			text-align: center;
			margin: 0 0 20px 0;
			padding: 10px;
			border: #FF0000 2px solid;
		}
		.goods_detail_right .non_member p.big {
			font-size: 16px;
			color: #FF0000;
			font-weight: bold;
			clear: both;
			text-align:left;
		}
		.goods_detail_right .non_member p.member_btn {
			width: 80%;
			text-align: center;
			
		}
		.goods_detail_right .non_member p.member_btn img {
			max-width: 60%;
			height: auto;
			margin-top: 10px;
			clear: both;
			text-align:left;
		}
		.goods_detail_right .freearea h3 {
			font-size: 16px;
			font-weight: normal;
			margin: 10px 0;
			border-left: #3fa9f5 5px solid;
			clear: both;
			text-align:left;
		}
		
		.goods_detail_right .freearea .goods_detail {
			margin-top: 10px;
			clear: both;
			text-align:left;
		}
		.goods_detail_right .freearea .goods_detail p {
			clear: both;
			text-align:left;
			font-size: 13px;
			text-align:left;
		}
		.goods_detail_right .freearea .goods_detail table {
			width: 100%;
			max-width: 80%;
			margin: 0;
			border-top: 1px #E5E5E5 solid;
			font-size: 13px;
		}
		.goods_detail_right .freearea .goods_detail table tr td.gd1 {
			width: 20%;
			text-align: left;
			padding: 10px;
			border-bottom: 1px #E5E5E5 solid;
		}
		.goods_detail_right .freearea .goods_detail table tr td.gd2 {
			padding: 10px;
			border-bottom: 1px #E5E5E5 solid;
			clear: both;
			text-align:left;
}

}

/*========================================================================
 営業日カレンダー
========================================================================*/

span#red {
font-size:11px;
color: #C24564;
}
span#blue {
font-size:11px;
color: #0083AE;
}
table.calendar {
padding: 0;
margin: 10px auto;
width:300px;
background-color:#FFFFFF;
}
table.calendar tr.headline td{
font-size: 10px;
}
table.calendar th {
text-align: center;
font-size: 12px;
color:#333333;
background-color:#E9E9E9;
}
table.calendar th span {
font-weight:lighter;
cursor: pointer;
font-size: 10px;
padding-top:0px;
vertical-align: top;
}
table.calendar td {
border-bottom: solid 1px #CCCCCC;
text-align: center;
height: 20px;
vertical-align: middle;
line-height: normal;
font-size: 11px;
color: #333333;
padding:0px;
}
table.calendar td.click {
cursor: pointer;
background-color:#FFFFFF;
}
table.calendar td.Today {
font-weight: bold;
text-decoration:underline;
}
table.calendar td.Sat {
color: #C95990;
background-color:#F5E2E2; 
}
table.calendar td.SatToday {
color: #C95990;
background-color:#F5E2E2; 
font-weight: bold;
text-decoration:underline;
}
table.calendar td.Sun {
color: #C95990;
background-color:#F5E2E2;
}
table.calendar td.SunToday {
color: #C95990;
background-color:#F5E2E2;
font-weight: bold;
text-decoration:underline;
}
table.calendar td.otherToday {
color: #0083AE;
background-color:#E8F7FF;
font-weight: bold;
text-decoration:underline;
}
table.calendar td.holiday {
color: #C95990;
background-color:#F5E2E2;
}
table.calendar td.other {
color: #0083AE;
background-color:#E8F7FF;
}
table.calendar td.otherday {
color: #0083AE;
background-color:#E8F7FF;
}
table.calendar td.otherToday {
color: #0083AE;
background-color:#E8F7FF;
font-weight: bold;
text-decoration:underline;
}
table.calendar td.other {
color: #FF6600;
background-color:#FFEDCC;
}
table.calendar td.xday {
font-weight: bolder;
color: #009999;
font-size: 14px;
}
table.calendar td.birthday {
font-weight: bolder;
color: #990000;
font-size: 14px;
float:left;
}