@charset "utf-8";

/*#######################################################

https://withmedica.com/products/01/

#########################################################*/



/*   商品ページ（一覧・詳細）共通
-------------------------------------------------------------- */

body.p-products main {
	background:url(/products/img/bg_product_top.jpg) repeat-x top left;
}
section {
	width:980px;
	margin: 0 auto;
}
h3 {
	margin-bottom:30px;
	padding-bottom:15px;
	border-bottom:2px solid var(--light-blue);
	font-weight:bold;
	font-size:2.2rem;
	color:var(--deep-blue); 
	line-height:130%;
}
.unit.p-01 .text { /* 01 追加栄養補助成分 だけ*/
	font-size:0.8rem !important;
}
@media screen and (max-width: 980px) {
	section {
		width:98% !important;
		margin: 0 1% !important;
	}
	h3 {
		font-size:5vw;
	}
}





/*   ▼商品一覧（タブ１：一覧）
-------------------------------------------------------------- */


#itemlist-tab {
	margin-bottom:60px;
}
#itemlist-tab a,
#itemlist-tab span {
	display:inline-block;
}
#itemlist-navi1 { /* No.01 の角丸 */
	margin-bottom:50px;
}
#itemlist-navi1 a {
	display:inline-block;
	margin: 0 8px 15px;
	padding:14px 30px 12px;
	border:solid 1px #006990;
	border-radius: 25px;
	-webkit-border-radius: 25px;
	-moz-border-radius: 25px;

	font-size:1.3rem;
	line-height:100%;
	color:#006990;
	text-decoration:none;
}
#itemlist-navi1 a:hover {
	background:#006990;
	color:#fff;
}

#itemlist-content1 {
	
	/*
		⇒ common.css  に記述
		
		以下は o.w.
	*/
}


@media screen and (max-width: 1400px) and (min-width: 981px) {
	#itemlist-content1 .unit {
		flex-basis: 31% !important;
	}
}
@media screen and (max-width: 980px) {
	#itemlist-tab {
		margin-bottom:30px;
	}
	#itemlist-tab a,
	#itemlist-tab span {
		width:calc(98% / 3);
	}
	#itemlist-tab img {
		width:100%;
	}
	#itemlist-navi1 a {
		margin: 0 1vw 2vw;
		padding:2vw 4vw 1.7vw;
		border-radius: 5vw;
		-webkit-border-radius: 5vw;
		-moz-border-radius: 5vw;
	
		font-size:3vw;
	}
	#search-item {
		padding-top:30px;
	}
	#itemlist-content1 .unit {
		flex-basis: 48% !important;
	}	
}



	


/*   ▼商品一覧（タブ２：お悩み・目的）
-------------------------------------------------------------- */

#itemlist-search {
	margin-bottom:40px;
}
#itemlist-search * {
	vertical-align:middle;
}
#itemlist-search input[type="text"] {
	display:inline-block;
	width:770px;
	height:90px;
	padding:15px 30px;
	font-size:1.6rem;

	border:solid 2px var(--deep-blue);
	border-radius: 5px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	
	border-top-right-radius:0;
	border-bottom-right-radius:0;
}

@media screen and (max-width: 980px) {
	#itemlist-search input[type="text"] {
		display:inline-block;
		width:73vw;
		height:10vw;
		padding:1vw 3vw;
		font-size:3vw;
	}
	#btn-nayami-search {
		width:22vw;
		height:10vw;
	}
}



#itemlist-content2 {
	padding-bottom:100vw;
}
#itemlist-content2 img {
	display:block;
	margin-bottom:10px;
}
#itemlist-content2 .unit {
	float:left;
	width:470px;
}
#itemlist-content2 .unit:nth-child(1) {
	margin-right:40px;
}
#itemlist-content2 ul {
	padding: 10px 20px;
	margin-bottom:20px;
}
#itemlist-content2 ul li {
	margin-bottom:20px;
	position:relative;
}
#itemlist-content2 ul strong {/* arrow */
	display:inline-block;
    width: 10px;
    height: 10px;
	margin-right:10px;
    border-top: 2px solid #3376C5;
    border-right: 2px solid #3376C5;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
}

#itemlist-content2 ul li a {
	font-size:1.3rem;
	line-height:130%;
	font-weight:bold;
	color:#3376C5;
	text-decoration:underline;
}

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

	#itemlist-content2 .unit {
		float:none;
		width:98%;
		margin:0;
	}
	#itemlist-content2 ul li {
		margin-bottom:2vw;
	}	
	#itemlist-content2 ul li a {
		font-size:3.5vw;
	}
}



.nayami-item {
	display:none; /* init */
	
	width:980px;
	position:absolute;
	top:60px;
	left:-20px;
	z-index:998;
	padding:40px;
	background:#EAF1F9;
	border:solid 2px #3376C5;
	border-radius: 15px;
	-webkit-border-radius: 15px;
	-moz-border-radius: 15px;		
}
.unit.right .nayami-item {left:-530px;}
.nayami-item .in {
	padding:20px;
	background:#fff;
	border-radius: 15px;
	-webkit-border-radius: 15px;
	-moz-border-radius: 15px;	
}
.nayami-item .arrow {
	position:absolute;
	width:30px;
	height:29px;
	top:-29px;
	left:240px;
	z-index:999;
}
.right .nayami-item .arrow { left:650px; }

.nayami-item a.closer {
	position:absolute;
	display:block;
	width:50px;
	height:50px;
	top:45px;
	left:880px;
	z-index:999;
}
.nayami-item .in span {
	display:block;
	margin: 0 15px;
	padding:5px 10px;
}
.nayami-item .in span.catch {
	display:inline-block;
	margin:10px 0 20px 15px;
	padding:8px 10px 5px;
	font-size:1rem;
	line-height:100%;
	font-weight:bold;
	
	border:solid 1px;
	border-radius: 5px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
}
.p-01 span.catch { color:var(--main-color-01); background:var(--bg-color-01); border-color:var(--main-color-01); }
.p-02 span.catch { color:var(--main-color-02); background:var(--bg-color-02); border-color:var(--main-color-02); }
.p-03 span.catch { color:var(--main-color-03); background:var(--bg-color-03); border-color:var(--main-color-03); }
.p-04 span.catch { color:var(--main-color-04); background:var(--bg-color-04); border-color:var(--main-color-04); }
.p-05 span.catch { color:var(--main-color-05); background:var(--bg-color-05); border-color:var(--main-color-05); }
.p-06 span.catch { color:var(--main-color-06); background:var(--bg-color-06); border-color:var(--main-color-06); }
.p-07 span.catch { color:var(--main-color-07); background:var(--bg-color-07); border-color:var(--main-color-07); }

.nayami-item  table {
}
.nayami-item th {
	padding: 0 10px 0 0;
	vertical-align:middle;
	transform: scale(0.8, 1);
	border-right:solid 1px;
	font-size:3rem;
	font-weight:bold;	
	line-height:100%;
}
.p-01 .number { color:var(--sub-color-01); border-color:var(--sub-color-01); }
.p-02 .number { color:var(--sub-color-02); border-color:var(--sub-color-02); }
.p-03 .number { color:var(--sub-color-03); border-color:var(--sub-color-03); }
.p-04 .number { color:var(--sub-color-04); border-color:var(--sub-color-04); }
.p-05 .number { color:var(--sub-color-05); border-color:var(--sub-color-05); }
.p-06 .number { color:var(--sub-color-06); border-color:var(--sub-color-06); }
.p-07 .number { color:var(--sub-color-07); border-color:var(--sub-color-07); }


.nayami-item td {
	padding: 0 10px;
	vertical-align:middle;	
	font-size:1.1rem;
	line-height:140%;
	font-weight:bold;
}

.nayami-item .catch2 {
	font-size:1.3rem;
	line-height:140%;
}
.p-01 .catch2 { color:var(--main-color-01); }
.p-02 .catch2 { color:var(--main-color-02); }
.p-03 .catch2 { color:var(--main-color-03); }
.p-04 .catch2 { color:var(--main-color-04); }
.p-05 .catch2 { color:var(--main-color-05); }
.p-06 .catch2 { color:var(--main-color-06); }
.p-07 .catch2 { color:var(--main-color-07); }


.nayami-item h4 {
	float:left;
	width:55%;
	margin: 15px 0 20px 25px;
	font-size:1.6rem;
	line-height:120%;
	font-weight:bold;
	color:#3376C5;
	text-decoration:underline;
}
.nayami-item span.price {
	float:right;
	width:35%;
	margin:15px 0;
	font-size:1.1rem;
	text-align:right;
	color:#666;
}
.nayami-item span.price em {
	font-size:1.6rem;
	font-weight:bold;
	color:#666;
}
.nayami-item img.item {
	width:35%;
	float:left;
	padding-left:20px;
}
.nayami-item span.mark {
	width:60%;
	float:right;	
	padding:7px 10px 5px;
	background:#ededed;
	font-size:0.9rem;
	border-radius: 15px;
	-webkit-border-radius: 15px;
	-moz-border-radius: 15px;
}
.nayami-item span.text {
	width:60%;
	float:right;
	padding:10px;
	font-size:0.9rem;
}
.nayami-item a {
	display:block;
	width:62%;
	float:right;
}

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

	.nayami-item {
		width:94vw;
		top:10vw;
		left:-3vw;
		padding:3vw;	
	}
	.unit.right .nayami-item {left:-3vw;}
	.nayami-item .in {
		padding:3vw;	
	}
	.nayami-item .arrow {
		left:20vw;
	}
	.right .nayami-item .arrow { left:20vw; }
	.nayami-item a.closer {
		width:50px;
		height:50px;
		top:4vw;
		left:80vw;
	}
	.nayami-item .in span {
		margin: 0 1vw;
		padding:1vw 2vw;
	}
	.nayami-item .in span.number {
		width:auto;
		display:inline-block;
		padding-left:0 !important;
		vertical-align:middle;
		transform: scale(0.8, 1);
		font-size:8vw;
		font-weight:bold;
		line-height:100%;
	}
	.nayami-item .in span.catch {
		display:inline-block;
		vertical-align:middle;
		margin:0 0 10px 0;
		padding:2vw 2vw 1.5vw 2vw;
		font-size:2.5vw;
	}
	.nayami-item th {
		display:none;
	}
	.nayami-item td {
		padding: 0;
		font-size:3vw;
	}
	.nayami-item .catch2 {
		padding-left:0 !important;
		font-size:3vw;
	}
	.nayami-item h4 {
		width:100%;
		margin: 1vw 0 0 0;
		font-size:4vw;
	}
	.nayami-item span.price {
		width:100%;
		margin:40;
		font-size:2vw;
	}
	.nayami-item span.price em {
		font-size:4vw;
	}
	.nayami-item img.item {
		width:45%;
		padding:0px;
	}
	.nayami-item span.mark {
		width:50%;
		font-size:2.5vw;
	}
	.nayami-item span.text {
		width:50%;
		font-size:2.5vw;
		line-height:130%;
	}
	.nayami-item a {
		width:55%;
	}
}






/*   ▼商品一覧（タブ３：成分）
-------------------------------------------------------------- */

#itemlist-navi3 { /* 「ア行」の角丸 */
	margin-bottom:50px;
}
#itemlist-navi3 a {
	display:inline-block;
	margin: 0 4px 15px;
	padding:12px 15px 10px;
	border:solid 1px #006990;
	border-radius: 25px;
	-webkit-border-radius: 25px;
	-moz-border-radius: 25px;

	font-size:1.2rem;
	line-height:100%;
	color:#006990;
	text-decoration:none;
}
#itemlist-navi3 a:hover {
	background:#006990;
	color:#fff;
}
ul#ul-seibun li {
	width:50%;
	float:left;
}

#ul-seibun li:nth-child(even) .nayami-item { left:-490px; }/* 成分リスト右側 */
#ul-seibun li:nth-child(even) .nayami-item .arrow { left:650px; }


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

	#itemlist-navi3 a {
		margin: 0 0.5vw 2vw;
		padding:2vw 4vw 1.7vw;
		border-radius: 5vw;
		-webkit-border-radius: 5vw;
		-moz-border-radius: 5vw;
	
		font-size:3vw;
	}
	#ul-seibun li:nth-child(even) .nayami-item { left:-48vw; }/* 成分リスト右側 */
	#ul-seibun li:nth-child(even) .nayami-item .arrow { left:60vw; }	
}










/*   ▼以下、商品詳細
-------------------------------------------------------------- */



/*   冒頭
-------------------------------------------------------------- */

#bnr-hangaku {
	margin:30px auto;
	padding:30px 0 10px;
	background:#fff;
	border:solid 1px crimson;
}
#bnr-hangaku p {
	text-align:center;
	font-size:2.5rem;
	color:#111;
	font-weight:bold;
	line-height:160%;
	letter-spacing:1px;
}
#bnr-hangaku a {
	display:block;
	width:980px;
	height:271px;
	background:url(/products/img/btn_trial_bg.jpg) no-repeat center 0;
	background-size:96%;
	position:relative;
}
#bnr-hangaku a img {
	display:block;
	position:absolute;
	width:100px;
	top:10px;
	left:800px;
}


section#item-top {
	margin-bottom:80px;
}
section#item-top #p-title {
	margin-bottom:40px;
	padding-top:15px;
	text-align:center;
	font-size:1.4rem;
	color:#5C3500;
	font-weight:bold;
}
section#item-top #p-title span {
	font-size:1.8rem;
	color:#5C3500;
}
section#item-top h1 {
	margin-bottom: 50px;
	padding-bottom:10px;
	border-bottom:solid 1px #5C3500;
	text-align:center;
	font-weight:bold;
	font-size:3.4rem;
    line-height: 1.1em;
	color:#5C3500;	
}
body.p-10 section#item-top h1 {
	font-size:3.3rem;
    line-height: 110%;
}

section#item-top .left {
	float:left;
	width:40%;
	position:relative;
}
section#item-top .left a.to-review {
	display:block;
	margin-bottom:20px;
	padding:6px 0;
	background:#fff;
	border:solid 2px var(--deep-blue);
	text-align:center;
	text-decoration:none;

	border-radius: 10px;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;	
}
section#item-top .left a.to-review,
section#item-top .left a.to-review * {
	vertical-align:middle;
	color:var(--deep-blue);
	font-weight:bold;
}
section#item-top .left a.to-review img {
	display:inline-block;
	margin-right:10px;
}
#package-wrapper {
	background:#fff;
	margin-bottom:20px;
	padding: 75px 0;
	border:solid 3px #ddd;
	border-radius: 5px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
}
#package-wrapper img {
	display:block;
	margin: 0 auto;
}
a#arrow-left {
	display:block;
	position:absolute;
	width:58px;
	height:58px;
	top:220px;
	left:-15px;
}
a#arrow-right {
	display:block;
	position:absolute;
	width:58px;
	height:58px;
	top:220px;
	right:-15px;
}
a#zoom {
	display:block;
	position:absolute;
	width:64px;
	height:64px;
	bottom:150px;
	right:20px;
}
#package-thumb {
}
#package-thumb a {
	width:100px;
	display:inline-block;
	margin-right:10px;
	text-align:center;
	line-height:0;
	
	background:#fff;
	padding: 10px;
	border:solid 3px #ddd;
	border-radius: 5px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;	
}
#package-thumb a:hover {
	border-color:#006699;
}

section#item-top .right {
	float:right;
	width:52%;
	
}
h2 {
	margin-bottom: 20px;
	font-weight:bold;
	font-size:1.8rem;
	line-height:140%;	
}
h2 span {
	font-size:0.8rem;
}
#notice {
	margin-bottom:30px;
	font-size:0.9rem;
	color:#555;
}
dl.content-and-price {
	margin-bottom:15px;
}
dl.content-and-price dt {
	display:inline-block;
	width:130px;
	background:var(--deep-blue);
	margin-right:20px;
	padding:10px 20px 7px;
	font-size:1.3rem;
	font-weight:bold;
	color:#fff;
	text-align:center;
	line-height:100%;
	border-radius: 25px;
	-webkit-border-radius: 25px;
	-moz-border-radius: 25px;		
}
dl.content-and-price dd {
	display:inline-block;
	font-size:1.5rem;
	line-height:180%;
}

dl.kinou-seibun {
	margin-bottom:15px;
}
dl.kinou-seibun dt {
	display:inline-block;
	width:200px;
	background:#E5F0F4;
	margin-right:20px;
	padding:10px 20px 7px;
	font-size:1.1rem;
	font-weight:bold;
	color:var(--deep-blue);
	text-align:center;
	line-height:100%;
	border-radius: 20px;
	-webkit-border-radius: 20px;
	-moz-border-radius: 20px;		
}
dl.kinou-seibun dd {
	display:inline-block;
	font-size:1.3rem;
	margin-right: 10px;
	line-height:180%;
}
dl.kinou-seibun dd::after {
	content:" / ";
}
dl.kinou-seibun dd:last-child::after {
	content:"";
}

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

	section#item-top {
		margin-bottom:5vw !important;
	}
	
	#bnr-hangaku {
		margin:20px auto;
		padding:20px 0 0;
	}
	#bnr-hangaku p {
		font-size:5vw;
	}	
	#bnr-hangaku a {
		width:100%;
		height:58vw;
		margin:5% 0 2%;
		background:url(/products/img/btn_trial_bg_smp.jpg) no-repeat;
		background-size:contain;
	}
	#bnr-hangaku a img {
		width:12.5vw;
		top:19.5vw;
		left:5.3vw;
	}
		
	section#item-top #p-title {
		margin:3vw 0;
		font-size:3vw;
	}
	section#item-top #p-title span {
		font-size:4vw;
	}
	section#item-top h1 {
		border:none;
		margin-bottom: 4vw;
		padding-bottom:2vw;
		font-size:5vw;	
        
	}
	
	section#item-top .left {
		float:none;
		width:90%;
		margin: 0 auto;
	}
	#package-wrapper {
		margin-bottom:2vw;
		padding: 8vw 0;
	}
	a#zoom {
		bottom:120px;
		right:2vw;
	}
	#package-thumb {
		margin-bottom:30px;
	}
	#package-thumb a {
		width:20vw;	
	}
	section#item-top .right {
		float:none;
		width:96%;	
		margin: 0 auto;
	}
	h2 {
		font-size:5vw;
		line-height:150%;	
	}
	h2 span {
		font-size:2.5vw;
	}
	#notice {
		font-size:2.5vw;
		line-height:150%;
	}
	dl.content-and-price {
		margin-bottom:15px;
	}
	dl.content-and-price dt {
		width:20vw;
		margin-right:2vw;
		padding:2vw 2vw 2vw;
		font-size:3vw;	
	}
	dl.content-and-price dd {
		font-size:4vw;
		line-height:140%;
	}
	dl.kinou-seibun {
	}
	dl.kinou-seibun dt {
		width:30vw;
		margin-right:2vw;
		padding:2vw 2vw 2vw;
		font-size:3vw;		
	}
	dl.kinou-seibun dd {
		font-size:3vw;
		line-height:140%;
	}
	dl.kinou-seibun dd::after {
		content:"/";
	}
}




/*   タブ
-------------------------------------------------------------- */

#tab {
	margin-bottom:30px;
}
#tab-top {
	line-height:0;
}
#tab-top a {
	display:inline-block;
	line-height:0;
}
#tab-top a:nth-child(1) {
	width:calc(100% * 406/980);
}
#tab-top a:nth-child(2),
#tab-top a:nth-child(3) {
	width:calc(100% * 287/980);
}
#tab-top.two-tabs a {
	width:50% !important;
}
@media screen and (max-width: 980px) {
	#tab-top a {
		width:calc(100% / 3) !Important;
	}
    #tab-top.two-tabs a {
        width:50% !important;
    }      
	#tab-top a img {
		width:100%;
	}
}

#tab-content-wrapper {
	padding: 0 34px 0 32px;
	background:#FFFBE7;
	border:solid 2px #FFD6A8;
}
#tab-content-1 img,
#tab-content-3 img {
	line-height:0;
	display:block;
}
#tab-content-wrapper .select-qty {
	background:#fff;
}
#tab-content-wrapper .select-qty * {
	vertical-align:top;
}
#tab-content-wrapper .select-qty select {
	display:inline-block;
	width:40%;
	height:70px;
	margin-bottom:10px;
	padding: 13px;
	font-size:1.3rem;
	font-weight:bold;
	background:#fff;
	border: solid 3px var(--light-blue);
	border-radius: 7px;
	-webkit-border-radius: 7px;
	-moz-border-radius: 7px;
}
#tab-content-wrapper .select-qty select.short {
	width:30%;
}
#tab-content-wrapper .select-qty img {
	display:inline-block !important;
}
@media screen and (max-width: 980px) {
	#tab-content-wrapper {
		padding: 2% 2% 0;
	}
	#tab-content-wrapper .select-qty {
		margin-bottom:3%;
	}
	#tab-content-wrapper .select-qty img {
		width:20vw;
	}
	#tab-content-wrapper .select-qty select {
		width:65vw !important;
		height:auto;
		padding: 4vw !important;
		font-size:4vw !important;
	}
}


#tab-content-1 .price-panel {
	position:relative;
	width:912px;
	height:293px;
	background:url(/products/img/img_tab1_5.jpg) no-repeat;
}
#tab-content-3 .price-panel {
	position:relative;
	width:912px;
	height:199px;
	background:url(/products/img/img_tab3_5.jpg) no-repeat;
}
#tab-content-wrapper .price-panel em {/*黒い日本語文字*/
	display:block;
	position:absolute;
	color:#111;
	font-weight:bold;
	font-size:23px;
	font-family:Arial,serif;
}
#tab-content-wrapper .price-panel span {/*赤い価格*/
	display:block;
	position:absolute;
	width:120px;
	text-align:right;
	color:#E33A01;
	font-weight:bold;
	font-size:42px;
	font-family:Arial,serif;
	letter-spacing:-1px;
}
#tab-content-wrapper .price-panel em:nth-child(1) {
	top:71px;
	left:540px;
	font-size:20px;
	font-family: 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', Meiryo, メイリオ, Osaka, 'MS PGothic', arial, helvetica, sans-serif;	
}
#tab-content-wrapper .price-panel em:nth-child(2) {
	top:130px;
	left:112px;
}
#tab-content-wrapper .price-panel em:nth-child(3) {
	top:130px;
	left:572px;
}
#tab-content-wrapper .price-panel em:nth-child(4) {
	top:214px;
	left:112px;
}
#tab-content-wrapper .price-panel em:nth-child(5) {
	top:214px;
	left:572px;
}
#tab-content-wrapper .price-panel span:nth-child(6) {
	top:130px;
	left:200px;
}
#tab-content-wrapper .price-panel span:nth-child(7) {
	top:130px;
	left:670px;
}
#tab-content-wrapper .price-panel span:nth-child(8) {
	top:212px;
	left:200px;
}
#tab-content-wrapper .price-panel span:nth-child(9) {
	top:212px;
	left:670px;
}

#tab-content-wrapper .cart {
	position:relative;
	width:912px;
	height:147px;
	background:url(/products/img/img_tab1_6.jpg) no-repeat;
}
#tab-content-wrapper .cart span {
	display:block;
	position:absolute;
	top:62px;
	left:20px;	
	width:125px;
	text-align:right;
	color:#E33A01;
	font-weight:bold;
	font-size:31px;
	font-family:Arial,serif;
}
#tab-content-wrapper .cart a {
	display:inline-block;
	margin-left:308px;
}

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

	#tab-content-1 .price-panel {
		width:100%;
		height:58vw;
		background:url(/products/img/img_tab1_5_smp.jpg) no-repeat;
		background-size:contain;
	}
	#tab-content-3 .price-panel {
		width:100%;
		height:50vw;
		background:url(/products/img/img_tab3_5_smp.jpg) no-repeat;
		background-size:contain;
	}
	#tab-content-wrapper .price-panel em {/*黒い日本語文字*/
		font-size:4vw;
	}
	#tab-content-wrapper .price-panel span {/*赤い価格*/
		width:20vw;
		font-size:5.5vw;
		letter-spacing:-1px;
	}
	#tab-content-wrapper .price-panel em:nth-child(1) {
		top:2.8vw;
		left:47vw;
		font-size:2.8vw;
	}
	#tab-content-wrapper .price-panel em:nth-child(2) {
		top:17vw;
		left:4vw;
	}
	#tab-content-wrapper .price-panel em:nth-child(3) {
		top:17vw;
		left:50vw;
	}
	#tab-content-wrapper .price-panel em:nth-child(4) {
		top:30vw;
		left:4vw;
	}
	#tab-content-wrapper .price-panel em:nth-child(5) {
		top:30vw;
		left:50vw;
	}
	#tab-content-wrapper .price-panel span:nth-child(6) {
		top:13vw;
		left:16vw;
	}
	#tab-content-wrapper .price-panel span:nth-child(7) {
		top:13vw;
		left:63vw;
	}
	#tab-content-wrapper .price-panel span:nth-child(8) {
		top:26.5vw;
		left:16vw;
	}
	#tab-content-wrapper .price-panel span:nth-child(9) {
		top:26.5vw;
		left:63vw;
	}
	#tab-content-wrapper .price-panel span.price1-otoku {
		top:43.5vw;
		left:25.5vw;
	}	
	#tab-content-wrapper .price-panel span.price3-otoku {
		top:31.5vw;
		left:25.5vw;
	}		
	#tab-content-wrapper .cart {
		width:100%;
		height:auto;
		background:none;
	}
	#tab-content-wrapper .cart a {
		display:block;
		width:100%;
		margin: 0 auto;
	}


}



#tab-content-2 {
}
#tab-content-2 .left {
	width:45%;
	float:left;
}
#tab-content-2 .left * {
	vertical-align:middle;
}

#tab-content-2 .left select {
	display:inline-block;
	width:29%;
	padding: 11px 13px 9px 13px;
	font-size:1.3rem;
	font-weight:bold;
	background:#fff;
	border: solid 3px var(--light-blue);
	border-radius: 7px;
	-webkit-border-radius: 7px;
	-moz-border-radius: 7px;
}


#tab-content-2 .right {
	width:55%;
	float:right;
	text-align:right;
}
#tab2-rakuten {
	position:relative;
}
#tab2-rakuten a.only-pc {/* 楽天半額キャンペーンバナー*/
	display:block;
	width:478px;
	height:74px;
	position:absolute;
	right:0;
	top:0
}
@media screen and (max-width: 980px) {
	#tab-content-2 .left {
		width:100%;
		float:none;
		text-align:center;
	}
	#tab-content-2 .left img {
		width:40vw;
	}	
	#tab-content-2 .left select {
		width:40vw;
		height:auto;
		padding: 4vw !important;		
		margin-bottom:0;
		font-size:4vw !important;
	}
	#tab-content-2 .right {
		width:100%;
		float:none;
	}
}


#tab-banner {
    margin-bottom: 25px;
    padding: 15px;
	line-height:0;
	text-align:center;
    background: #fff;
	border-radius: 15px;
	-webkit-border-radius: 15px;
	-moz-border-radius: 15px;    
}
#tab-banner a {
	display:block;
	float:left;
}

#tab-banner p {
	padding:20px 0;
	font-size:1rem;
	text-align:center;
}
#tab-banner .col3 {
	display:flex;
	flex-wrap: wrap;
	justify-content: center;
	padding-top:15px;
}
#tab-banner .col3 a {
	display:block;
	flex-basis: 20%;
	margin: 0 1vw;
	padding:15px;
	text-align:center;
	text-decoration:none;
	
	border-radius: 15px;
	border:solid 1px #ccc;
	-webkit-border-radius: 15px;
	-moz-border-radius: 15px;
	box-shadow: 0 0 4px 4px rgba(0, 0, 0, 0.05);	
}

#tab-banner .col3 a img {
	max-width:190px;
	width:100%;
}


@media screen and (max-width: 980px) {
	
	#tab-banner {
        margin-bottom: 25px;
        padding: 5px;
    }
	#tab-banner a {
		float:none;
	}	
	#tab-banner p {
		font-size:2.4vw;
		line-height:150%;
	}
	#tab-banner .col3 {
		padding:2vw 10% 2vw;
	}	
	#tab-banner .col3 a {
		flex-basis: 45%;
		margin-bottom:4vw;
		padding:15px;
	}
	#tab-banner .col3 a img {
		max-width:none;
		width:100%;	
	}
}







/*   infoバナー
-------------------------------------------------------------- */

#info-banner {
	line-height:0;
	text-align:center;
	margin-bottom:80px;
}
#info-banner a {
	display:block;
	float:left;
}

#info-banner p {
	padding:20px 0;
	font-size:1rem;
	text-align:center;
}
#info-banner .col3 {
	display:flex;
	flex-wrap: wrap;
	justify-content: center;
	padding-top:15px;
}
#info-banner .col3 a {
	display:block;
	flex-basis: 20%;
	margin: 0 1vw;
	padding:15px;
	text-align:center;
	text-decoration:none;
	
	border-radius: 15px;
	border:solid 1px #ccc;
	-webkit-border-radius: 15px;
	-moz-border-radius: 15px;
	box-shadow: 0 0 4px 4px rgba(0, 0, 0, 0.05);	
}

#info-banner .col3 a img {
	max-width:190px;
	width:100%;
}


@media screen and (max-width: 980px) {
	#info-banner {
		padding-top:5%;
        padding-bottom: 10vw;
	}
	#info-banner a {
		float:none;
	}	
	#info-banner p {
		font-size:2.4vw;
		line-height:150%;
	}
	#info-banner .col3 {
		padding:2vw 10% 10vw;
	}	
	#info-banner .col3 a {
		flex-basis: 45%;
		margin-bottom:4vw;
		padding:15px;
	}
	#info-banner .col3 a img {
		max-width:none;
		width:100%;	
	}
}






/*   商品詳細
-------------------------------------------------------------- */

#detail {
	margin-bottom:80px;
}
#detail .description {
	margin-bottom:50px;
	font-size:1.3rem;
	line-height:180%;
}
#detail .subtitle {
	margin-bottom:20px;
	font-weight:bold;
	font-size:2rem;
	color:var(--deep-blue); 
}
#detail .table {
	width:100%;
}
#detail .table tr,
#detail .table th,
#detail .table td {
	border:solid 1px #aaa;
	text-align:left;
	font-size:1.3rem;
	line-height:150%;
}
#detail .table th {
	width:25%;
	padding:15px 25px;
	background:#EAEAEA;
	font-weight:bold;
}
#detail .table td {
	padding:15px 25px;	
}


@media screen and (max-width: 980px) {
	#detail {
		margin-bottom:10vw !important;
		padding:0 1%
	}
	#detail .description {
		margin-bottom:8vw;
		font-size:3.5vw;
		line-height:160%;
	}
	#detail .subtitle {
		font-size:4vw;
	},
	#detail .table th,
	#detail .table td {
	}
	#detail .table th {
		width:33%;
		padding:1vw;
		font-size:3vw !important;
	}
	#detail .table td {
		padding:1vw;	
		font-size:3vw !important;
	}
}




/*   よくある質問
-------------------------------------------------------------- */

#qa {
	margin-bottom:100px;
}
#qa ul {
}
#qa ul li {
	margin-bottom:30px;
	padding: 0 0 30px 30px;
	border-bottom:solid 2px #ccc;
}
#qa ul li div {
	padding:20px 20px 20px 60px;
}
#qa ul li div.q {
	position:relative;
	padding:20px 20px 20px 60px;
	background:url(/products/img/ico_qa_q.jpg) no-repeat left 10px;
	font-weight:bold;
	font-size:1.6rem;
	color:var(--deep-blue); 
}
#qa ul li div.q a {
	display:block;
	width:50px;
	height:50px;
	position:absolute;
	top:15px;
	right:0;
}
#qa ul li div.a {
	display:none; /* init */
	width:78%;
	background:url(/products/img/ico_qa_a.jpg) no-repeat left 20px;
	font-size:1.2rem;
	line-height:160%;
}


@media screen and (max-width: 980px) {
	#qa {
		margin-bottom:10vw !important;
	}
	#qa ul li {
		margin-bottom:1vw;
		padding: 0 0 1vw 1vw;
	}
	#qa ul li div {
		padding:1vw 1vw 1vw 7vw;
	}
	#qa ul li div.q {
		padding:1vw 1vw 1vw 7vw;
		background:url(/products/img/ico_qa_q.jpg) no-repeat left 1vw;
		background-size:5vw;
		font-size:3vw;
	}
	#qa ul li div.q a {
		width:7vw;
		height:7vw;
		top:0vw;
		right:3vw;
	}
	#qa ul li div.q a img {
		width:100%;
	}
	#qa ul li div.a {
		width:80vw;
		background:url(/products/img/ico_qa_a.jpg) no-repeat left 1vw;
		background-size:5vw;
		font-size:3vw;
	}
}











