/*----------------------------- page style -----------------------------*/

section {
	border-top: #004ea2 1px solid;
	clear: both;
	margin: 40px 0 0 0;
}
section h2 {
	color: #004ea2;
	font-weight: bold;
	font-size: 124%;
	padding: 25px 8px 15px;
	text-align: center;
	line-height: 1.4em;
}
section .inner {
	padding: 0 8px;
}
section#mv, #trouble {
	border-top: none;
	margin: 0;
}
#mv .inner {
	background: #e8f2fc;
	margin: 0 0 25px;
	padding: 8px 0 15px;
	text-align: center;
}
#mv h1 {
	margin: 0;
	padding: 6px 15px 6px;
}
.mv_point {
	display: flex;
	margin: 0 5px;
}
#mv p {
	font-size: 80%;
	flex-basis: 54%;
	max-width: 54%;
	letter-spacing: -0.03em;
	padding: 0 4px;
	text-align: left;
}
#mv p span {
	background: url(../../../common/img/border_y.gif) 0 86% repeat-x;
}
#mv ul {
	display: flex;
	flex-basis: 46%;
	max-width: 46%;
}
#mv ul li {
	max-width: 55px;
	padding: 8px 3px 0;
	float: left;
}
	

#trouble h2 {
	padding: 0 8px 15px;
}
#trouble ul {
	padding: 0 8px
}

#trouble ul li {
	width: 47%;
	float: left;
	font-size: 85%;
	text-align: center;
	padding: 0 6% 16px 0;
}

#trouble ul li:nth-child(even) {
	padding: 0;
}
#trouble ul li p {
	padding: 5px 0 0;
	font-size: 93%;
}
#trouble h3 {
	clear: both;
	font-size: 115%;
	color: #ed0011;
	text-align: center;
	padding: 0 8px;
}
#trouble h3 span {
	font-size: 85%;
	color: #000000;
}



#mechanism p.readTXT {
	text-align: left;
}

#mechanism ul {
	margin: 15px 0 0 0;
	padding: 20px 8px 0;
	background: url(../img/mechanism_bg.png) 0 0 repeat-y;
	background-size: contain;
}

#mechanism ul li p {
	font-size: 93%;
}

#mechanism ul li.arrow {
	clear: both;
	text-align: center;
	padding: 8px 0; 
}
#mechanism .mechanismIMG {
	text-align: center;
	padding: 8px 0 15px;
}
#mechanism h3 {
	text-align: center;
	font-size: 115%;
	padding: 10px 0 20px 0;
	line-height: 2em;
}
#mechanism h3 span {
	text-align: center;
	color: #004ea2;
	background: url(../img/mechanism_border.png) 0 100% repeat-x;
	padding: 0 0 5px 7px;
}
#mechanism h3 span.t_red {
	color: #ed0011;
	background: none;
}
#mechanism .note {
	font-size: 77%;
	text-align: right;
}


#component h2 {
	text-align: center;
}
#component h3 {
	font-size: 108%;
	line-height: 1.3em;
	font-weight: bold;
	padding: 25px 0 10px;
}
#component h3 span {
	background: url(../../../common/img/border_y.gif) 0 86% repeat-x;
}
#component .tac {
	padding: 0 0 10px;
}
#component .plus {
	clear: both;
	text-align: center;
	padding: 20px 0;
}
#component .component_image {
	padding: 10px 0 0;
}





.accordionMENU dl.vitamin {
    border: #e1e1e1 3px solid;
	margin: 15px 0 12px;
	padding: 0 10px;
}
.accordionMENU dl.vitamin dt.vitaminB1 {
	background: url(../img/component_icon01.png) 0 50% no-repeat;
	background-size: 30px;
	padding: 10px 0 10px 35px;
	color: #d70c19;
}
.accordionMENU dl.vitamin dt.vitaminB6 {
	background: url(../img/component_icon02.png) 0 50% no-repeat;
	background-size: 30px;
	padding: 19px 0 17px 35px;
	color: #00aae7;
}
.accordionMENU dl.vitamin dt.vitaminB12 {
	background: url(../img/component_icon03.png) 0 50% no-repeat;
	background-size: 30px;
	padding: 19px 0 17px 35px;
	color: #edb200;
}
.accordionMENU dl.vitamin dt {
    cursor: pointer;
    position: relative;
	font-weight: bold;
	font-size: 100%;
	line-height: 1.2em;
}

.accordionMENU dl.vitamin dt:before {
	display: block;
	content: "";
	position: absolute;
	top: 2px;
	right: 0px;
	width: 22px;
	height: 50px;
	background: url(../img/icon_accordion_open_hk.png) 0 50% no-repeat;
	background-size: 22px;
}
.accordionMENU dl.vitamin dt:after {
	display: none;
	content: "";
	position: absolute;
	top: 2px;
	right: 0px;
	width: 22px;
	height: 50px;
	background: url(../img//icon_accordion_close_hk.png) 0 50% no-repeat;
	background-size: 22px;
}
.accordionMENU dl.vitamin dt.active:before { display: none; }
.accordionMENU dl.vitamin dt.active:after { display:block; }
 
.accordionMENU dl.vitamin dd {
	background: url(../img/icon_accordion_a.jpg) 0 4px no-repeat;
	padding: 0 0 10px;
	font-size: 85%;
}


#product h2 {
	font-size: 116%;
	line-height: 1.3em;
	letter-spacing: -0.04em;
}
#product h2 span {
	font-size: 85%;
	line-height: 1em;
}
#product h2 img {
	vertical-align: middle;
	padding: 0 0 3px 3px;
}
#product .txtBOX {
	width: 60%;
	float: right;
}
#product .txtBOX h3 {
	padding: 0 0 5px;
}
#product .txtBOX img {
	width: 100%;
}

#product p.priceTTL {
	font-size: 77%;
	font-weight: bold;
	padding: 10px 0 0 0;
}
#product p.priceTXT {
	font-size: 77%;
}


#product .componentTTL {
	clear: both;
	padding: 10px 0 5px 0;
	font-weight: bold;
	font-size: 93%;
}
#product dl.component,
#product dl.annotation {
	font-size: 65%;
	padding: 0 0 10px;
}
#product dl.component dt {
	clear: both;
	float: left;
	background: #d5f4ff;
	width: 73%;
	padding: 8px 0 8px 2%;
}
#product dl.component dd {
	background: #d5f4ff;
	margin: 0 0 0 25%;
	padding: 8px 0;
}
#product dl.component dt.nth-child_even,
#product dl.component dd.nth-child_even {
	background: #f4fcff;
}
#product dl.annotation dt {
	clear: both;
	width: 4.5em;
	float: left;
}
#product dl.annotation dd {
	margin: 0 0 0 4.5em;
}

.details {
	padding: 10px 0 0;
}
.details h4 {
	margin: 0;
	padding: 20px 0 10px;
	color:  #004ea2;
	font-weight: bold;
	letter-spacing: -0.04em;
	clear: both;
}
.details h4 span {
	font-size: 93%;
}
.details .tablet {
	padding: 10px 0 0 10px;
	text-align: center;
}
.details p {
	font-size: 85%;
}
.details ul.featureLIST {
	clear: both;
	margin: 0 0 10px;
}
.details ul.featureLIST li {
	float: left;
	border: #004ea2 2px solid;
	color: #004ea2;
	background: #f2f8ff;
	border-radius: 300px;
    -webkit-border-radius: 300px;  
    -moz-border-radius: 300px;
	width: 29%;
	height: 65px;
	font-size: 77%;
	font-weight: bold;
	margin: 10px 4% 0 0;
	padding: 13px 0 0 0;
}
.details ul.featureLIST li:nth-child(even) {
	margin: 10px 4% 0 0;
	padding: 20px 0 0 0;
	height: 58px;
}
.details ul.featureLIST li:last-child {
	margin: 10px 0 0 0;
}

.details ul.featureLIST li p {
	text-align: center;
}
.details .annotation01 {
	font-size: 85%;
	margin: 0;
	padding: 0 0 0 1em;
	text-indent: -1em;
}

.different {
	background: #fff3e9;
	margin: 20px 0 0 0;
	padding: 10px;
}
.different h3 {
	font-size: 100%;
	color: #f02e3b;
	font-weight: normal;
	margin: 0 0 5px;
	padding: 0;
}
.different p {
	font-size: 85%;
}
.different p.annotation {
	font-size: 77%;
	text-align: right;
}


.inquiry h3 {
	text-align: center;
	font-size: 85%;
	font-weight: bold;
	padding: 20px 0 5px;
	letter-spacing: -0.04em;
}

.inquiry dl dt {
	background: #004ea2;
	text-align: center;
	padding: 5px 0;
	color: #FFFFFF;
}
.inquiry dl dd {
	border-right: #e1e1e1 1px solid;
	border-left: #e1e1e1 1px solid;
	border-bottom: #e1e1e1 1px solid;
	text-align: center;
	font-size: 162%;
	padding: 10px;
}
.inquiry dl dd p {
	line-height: 1em;
}
.inquiry dl dd p img {
	vertical-align: text-bottom;
	padding: 0 7px 8px;
}

.inquiry dl dd dl dt {
	background: none;
	color: #000000;
	font-size: 45%;
	text-align: left;
	width: 5.5em;
	float: left;
	border: none;
	padding: 5px 0 0 0;
}
.inquiry dl dd dl dd {
	border: none;
	margin: 0 0 0 5.5em;
	padding: 5px 0 0 0;
	font-size: 45%;
	text-align: left;
}

.pagetop { margin: 0 0 15px; }
.pagetop a { font-size: 85%; }


