@charset "UTF-8";

/*****************************************************

HEADER

*****************************************************/

header{
	box-shadow: 0 2px 6px 2px rgba(0,0,0,0.3);
}

header h2{
	background:url(../imgs/bg-title.png);
	margin:0;
	padding:40px 0;
	color:#f0e9dc;
	font-size:32px;
	border-bottom:1px solid #837875;
}

#breadcrumbs{
	background:url(../imgs/bg-title.png);
	margin:0 auto;
	padding:20px 0;
	color:#d8d0c5;
	font-size:12px;
	border-bottom:1px solid #726662;
}

#breadcrumbs ul{
	width:960px;
	list-style-type:none;
}

#breadcrumbs li{
	display:inline;
	padding-right:12px;
	border:none;
}

#breadcrumbs li:before{
	content:">";
	padding-right:12px;
}

#breadcrumbs li:first-child:before{
	content:"";
	padding-right:0;
}

#breadcrumbs ul li a{
	display:inline;
	padding:0;
	font-size:12px;
	background:none;
	height:auto;
	color:#d8d0c5;
}

#breadcrumbs ul li a:hover{
    text-decoration:underline;
	color:#e38f71;
}

#breadcrumbs ul li a,
#breadcrumbs ul li a:hover{
	transition:none;
	-webkit-transition:none;
	-moz-transition:none;
	-o-transition:none;
	-ms-transition:none;
}

/*****************************************************

MAIN

*****************************************************/

.wrapper{
	width:100%;
}

section{
	width:960px;
	margin:0 auto;
	padding:40px 0 118px;
	overflow:hidden;
}

.visible{
	overflow:visible;
}

section div{
	margin-left:32px;
	padding:0;
	width:464px;
	float:left;
}

section .first{
	margin:0;
}

section .line{
	clear:both;
}

section .single{
	margin:0 auto;
	width:600px;
	float:none;
	clear:both;
}

section .single .img{
	float:left;
	margin-right:48px;
}

section .single h4{
	text-align:left;
	font-size:24px;
}

 .matrix{
	margin:48px auto 16px;
	padding:0;
	width:960px;
	clear:both;
}

 .matrix div{
	width:288px;
	margin:0 0 32px 48px;
	float:left;
}

 .matrix .left{
	margin-left:0;
}

 .matrix h4{
	margin:0;
	text-align:left;
	font-size:16px;
	font-weight:bold;
}

.notice{
	position:relative;
}

.balloon{
	position:absolute;
	right:-60px;
	top:-160px;
}

.balloon-mini{
	position:absolute;
	right:-60px;
	top:-80px;
}

h3{
	margin-bottom:40px;
	text-align:center;
	font-size:32px;
	font-weight:bold;
}

h3 span{
	font-size:20px;
	color:#7f6d68;
	font-weight:normal;
}

section p:first-child{
	margin-top:0;
}

section p:last-child{
	margin-bottom:0;
}

.bg-orange{
	background:url(../imgs/bg-orange.png);
}

.bg-yellow{
	background:url(../imgs/bg-yellow.png);
}

.bg-blue{
	background:url(../imgs/bg-blue.png);
}

@media screen and (max-width: 960px) {
    .wrapper{
        width:auto;
        padding: 0 1em;
    }
    section{
        width:auto;
        margin:0;
        padding:2em 0;
    }
    section div{
        margin-left:0;
        padding:0;
        width:auto;
        float:none;
    }
    section .first{
        margin-bottom: 1em;
    }
    section .single{
        margin:0 auto;
        max-width:100%;
    }
    .matrix{
        margin:1em 0 2em;
        width:auto;
    }
    .matrix div{
        width:auto;
        margin:0 0 1em;
        float:none;
    }
    .balloon{
        right:0;
        top:0;
        width: 92px !important;
    }
    h3{
        margin-bottom:1rem;
        font-size:28px;
    }
}

/*****************************************************

LINK

*****************************************************/

aside{
	width:320px;
	margin:1.5em auto 0;
	clear:both;
}

aside a{
	display:block;
	padding:16px;
	background:#e38f71;
	text-align:center;
	border-radius: 6px;
}

.darkbrown{
	background:#825d5b;
}

.brown{
	background:#a26b61;
}

aside a:link,aside a:visited,aside a:hover,
.symptom a:link,.symptom a:visited,.symptom a:hover{
	transition: all 0.2s ease-in-out;
	-webkit-transition: all 0.2s ease-in-out;
	-moz-transition: all 0.2s ease-in-out;
	-o-transition: all 0.2s ease-in-out;
	-ms-transition: all 0.2s ease-in-out;
}

aside a:link,
aside a:visited{
	color:#f0e9dc;
}

aside a:hover{
    text-decoration:none;
	background-color:#e37953;
}

aside a.darkbrown:hover{
	background-color:#6e4f4d;
}

aside a.brown:hover{
	background-color:#a15e52;
}

.symptom{
	list-style-type:none;
	margin:0;
}

.symptom a{
	display:table-cell;
	box-sizing:border-box;
	-moz-box-sizing:border-box;
	width:320px;
	height:160px;
	margin:0 0 40px;
	padding:38px 0 0 0;
	float:left;
	font-size:24px;
	text-align:center;
	line-height:1;
}

.symptom .blue{
	background:#00aab5;
}

.symptom .green{
	background:#76bb31;
}

.symptom .red{
	background:#d07252;
}

.symptom a:link,
.symptom a:visited{
	color:#f0e9dc;
    text-decoration:none;
}

.symptom a.blue:hover{
	background:#00aab5;
	background:rgba(2,145,154,0.8);
}

.symptom a.green:hover{
	background:#66ab22;
	background:rgba(102,171,34,0.9);
}

.symptom a.red:hover{
	background:#c4441c;
	background:rgba(196,68,28,0.8);
}

.symptom span{
	font-size:16px;
}

.symptom span.details{
	display:block;
	margin-top:18px;
	text-align:center;
}

.column aside{
	width:288px;
}

/*****************************************************

ITEM

*****************************************************/

h4 span{
	display:block;
	padding-top:6px;
	font-size:18px;
}

h4 img{
	padding-top:8px;
}

h4.hikaeme{
	display:inline;
	padding:8px;
	font-size:16px;
	background-color:#f0e0d0;
	background:rgba(153,153,153,0.1);
}

table{
	width:464px;
}

th{
	width:2em;
}

.border-s{
	background:url(../imgs/border-s.png) no-repeat top right;
}

.border-l{
	background:url(../imgs/border-l.png) no-repeat top right;
}

.va-middle{
	vertical-align:middle;
}

.price{
	margin-bottom:40px;
}

.price th{
	width:50%;
}

.price .dose{
	width:2em;
	padding-right:0;
}

.price th.border-l{
	background-size:4px 85px;
}

.effectiveness,
.ed{
	width:100%;
	background:rgba(255,255,255,0.2);
}

.effectiveness th{
	width:8em;
}

.ed th{
	width:13em;
}

.ed td:nth-child(even){
	background:url(../imgs/border.png) no-repeat top right;
}

.ed .remarks{
	width:25em;
}

.discount th{
	width:4em;
}

.access th{
	width:7em;
}


.card{
	margin:0;
	padding:32px 0;
	float:none;
	background:#f8f4ee;
	background:rgba(255,255,255,0.4);
	text-align:center;
}

.frame,
.frame2,
.frame3{
	margin:0;
	box-sizing: border-box;
	-moz-box-sizing: border-box;
	width:288px;
	float:none;
	overflow: hidden;	
}

.frame2,
.frame3{
	width:100%;
	margin:0;
	text-align:center;
	font-size:20px;
	background:rgba(255,255,255,0.2);
}

.frame3 p,
.frame3 li{
	text-align:left;
	font-size:16px;
}

.frame3 p.komoji{
	font-size:14px;
}

.frame3 h4{
	text-align:left;
}

ul ul{
	margin:0 0 0 2em;
}

dl.prescribe{
	margin-top:32px;
}

dl.other{
	margin:0;
}

.prescribe dt{
	margin:0 0 8px 0;
	padding:10px;
	width:272px;
	text-align:center;
	box-sizing: border-box;
	-moz-box-sizing: border-box;
}

.prescribe dd{
	margin:0;
	float:left;
	width:272px;
}

.prescribe dd.img{
	float:right;
	width:160px;
}

.prescribe dd.dp{
	margin:2px 0 8px;
	font-size:18px;
	text-align:center;
}

.prescribe dd.last{
	width:100%;
}

dt.viagra{
	color:#fff;
	background-color:#313e6a;
}

dt.levitra{
	color:#fff;
	background-color:#5b373b;
}

dt.cialis{
	color:#fff;
	background-color:#41692d;
}

dt.general{
	padding:0;
	text-align:left;
}

.other dd.img{
	margin-bottom:32px;
}

.aga-set dl{
	font-size:14px;
}

.aga-set dt{
	margin:0;
	padding:0;
	float:none;
	text-align:left;
	font-size:16px;
}

.aga-set dd{
	margin:0;
	text-align:left;
	font-size:16px;
}

.aga-set dd.aga-item{
	float:left;
}

.aga-set dd.aga-set-price{
	margin-left:16em;
}

@media screen and (max-width: 960px) {
    table{
        width:auto;
    }
    h4.hikaeme{
        display:inline-block;
        margin: 0;
    }
}