﻿@charset "utf-8";

@import url("parts.css");



/* CSS Document */



html,body{margin:0;padding:0;}

body{font: 12px "ＭＳ ゴシック", "Osaka－等幅" arial,sans-serif;text-align:center;color:#000;/*background:url(../imgdir/common/bgs.gif) repeat-x top;*/}

p{margin:0 0 10px; line-height:160%; padding:5px;}

a{color: #10117B; text-decoration:none;}

a:visited{color: #7C7C7C;}

a:hover,a:active{color: #00A0C6;text-decoration:underline;}

img {border:0; vertical-align:bottom;line-height:0;}

ul { margin:0; padding:0;}

li { list-style:none; margin:0; padding:0;}

.left { float:left; display:inline;}

.right { float:right; display:inline;}

.clear{clear:both;}

h1,h2,h3,h4,h5,h6{margin:0; padding:0; }





.clearfix:after { content:"."; display:block; height:0; clear:both; visibility:hidden; }

.clearfix { display:inline-block; }

/* Hides from IE-mac \*/

* html .clearfix { height:1%; }

.clearfix { display:block; }

/* End hide from IE-mac */





.go-top { margin:0; padding:1em 0; text-align:right; }







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



1.レイアウトスタイル



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



/*全体の枠*/  

div#container{background:#fff;text-align:left;border:1px solid #7D6F67;border-top:none; border:none;}

div#container{width:800px;margin:0 auto;padding:0;}



/*iframe_gallarey*/  

div#container_c{background:#fff;text-align:left;border:1px solid #7D6F67;border-top:none; border:none;}

div#container_c{width:605px;margin:0;padding:0;}



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



2.ヘッダー



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

/*パンくずリスト*/

div#pankuzu { width:300px; margin:0; height:20px; }

div#pankuzu ul{ margin:0; padding:0;line-height:120%;}

div#pankuzu li{ float:left; display:inline;}

#header { position:relative;}

#header h1 { background:#628048; color:#F0F0F0; padding:5px;font-size:12px; /*background:url(../imgdir/common/header_h1.gif) no-repeat top left;*/ height:15px; text-indent:5px;}



#header h1 strong, #header h1 em { font-weight:bold; font-style:normal; }



#header img { margin:4px 0 4px 10px;}

#header ul{	margin-top:7px;position:absolute;width: 300px;	right:-10px;top:21px;}

#header li{padding-top:2px; padding-right:8px;float:left;margin:0 5px 0 5px;list-style:none; border-right:1px solid #000000;}

#header li.last{padding-top:2px; padding-right:8px;float:left;margin:0 5px 0 5px;list-style:none; border:none;}

/*

#header ul{ width:300px;position:absolute;right:200px;top:30px;}

#header li{float:left;border-right:1px solid #000000; padding:0 5px;}

#header li.last {float:left; padding:0 5px; border:none;}*/



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



3.メインナビ



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





div#mainnavi {width:800px;}

div#mainnavi ul {margin:0;padding:0;}

div#mainnavi li {position:relative;width:160px;height:36px;min-height:36px;float:left;}

div#mainnavi li a { display:block; }

div#mainnavi li.navi01 span {position:absolute;background:url(../imgdir/common/mainnavi.gif) no-repeat 0px 0px; width:160px; height:36px;}

div#mainnavi li.navi02 span {position:absolute;background:url(../imgdir/common/mainnavi.gif) no-repeat -160px 0px; width:160px;height:36px; }



div#mainnavi li.navi03 span {position:absolute;background:url(../imgdir/common/mainnavi.gif) no-repeat -320px 0px; width:160px;height:36px;cursor:pointer; }

div#mainnavi li.navi04 span {position:absolute;background:url(../imgdir/common/mainnavi.gif) no-repeat -480px 0px; width:160px;height:36px;cursor:pointer; }

div#mainnavi li.navi05 span {position:absolute;background:url(../imgdir/common/mainnavi.gif) no-repeat -640px 0px; width:160px;height:36px;cursor:pointer; }





div#mainnavi li.navi01 a:hover span {position:absolute;background:url(../imgdir/common/mainnavi.gif) no-repeat 0px -36px; width:160px;height:36px;cursor:pointer; }

div#mainnavi li.navi02 a:hover span {position:absolute;background:url(../imgdir/common/mainnavi.gif) no-repeat -160px -36px; width:160px;height:36px;cursor:pointer; }

div#mainnavi li.navi03 a:hover span {position:absolute;background:url(../imgdir/common/mainnavi.gif) no-repeat -320px -36px; width:160px;height:36px;cursor:pointer; }

div#mainnavi li.navi04 a:hover span {position:absolute;background:url(../imgdir/common/mainnavi.gif) no-repeat -480px -36px; width:160px;height:36px;cursor:pointer; }

div#mainnavi li.navi05 a:hover span {position:absolute;background:url(../imgdir/common/mainnavi.gif) no-repeat -640px -36px;width:160px; height:36px;cursor:pointer; }



div#mainnavi li a:hover, div#mainnavi li a:active { text-decoration:none;}





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



3.5.ラッパー



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

#wrapper_01 { width:611px; float:right; display:inline; margin-top:8px;}

#wrapper { width:605px; float:right; display:inline; margin-top:8px;}

#wrapper.wide-content { width:798px; /*border-right:1px solid #ccc; border-left:1px solid #ccc;*/ clear:both; margin-top:8px;}



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



4.サービス(TOPページ)



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



#service { width:415px; text-align:center; float:left; display:inline;}

#service li { margin:10px 0;}





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



5.ピックアップ(TOPページ)



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



#pickup { width:196px; text-align:center; float:left; display:inline;}

#pickup img { float:right; display:inline;}

#pickup li { margin:10px 0; float:right; display:inline;}

#pickup li a:hover img {opacity:0.70;filter:alpha(opacity=80); }



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



6.ニュース(TOPページ)



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



#news { clear:both; width:300px; text-align:left float:left; display:inline;}

#news li { margin:10px 0;}





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



7.サイドメニュー(TOPページ)



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



#sidemenu { width:171px; text-align:center; float:left; display:inline; margin-top:7px;}

#sidemenu li { margin:20px 0;}

#sidemenu img#side_top_img { margin:10px 0 5px 0; }

#sidemenu ul#shop_info_area { border:1px solid #66765A; background:#ededed; text-align:center; }

#sidemenu ul#shop_info_area img { border:2px solid #fff; }

#sidemenu ul#shop_info_area li { margin:10px 0; }



#sidemenu p.bnr { line-height:110%; margin-top:0px;}





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



8.フッター(TOPページ)



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



#footer { clear:both; width:800px; height:45px;/* background:url(../imgdir/common/footer.gif) no-repeat */ color:#FFF;background:#628048; }

#footer ul { position:relative; width:200px; top:10px; left:10px; }

#footer li{float:left; display:inline;border-right:1px solid #FFF; padding:0 5px;}

#footer li.last {float:left; padding:0 5px; border:none;}

#footer li a {float:left; padding:0 5px; border:none; color:#FFF;}

#footer p { text-align:right; margin-right:10px;}





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



9.タイトル系(2次階層)



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

h2.main_ttl { margin: 0 0 20px 0;/*float:right; display:inline;*/}



h3.ttl { background:url(../imgdir/common/title_bar.gif) no-repeat left ; height:28px; padding:6px 0 6px 12px; font-size:14px; margin-top:40px;}



h4.ttl { background:url(../imgdir/common/title_3rd.gif) no-repeat left -25px ; height:28px; padding:0px 0 0px 12px; font-size:16px; margin-top:40px;}



p.ttl_bold { font-weight:bold; font-size:16px;}





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



紫外線対策特集ページ



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

#uv { color:#333; }

#uv a { color:#1B9BC5; text-decoration:none; }

#uv a:hover { text-decoration:underline; }

#uv a:visited { color:#1B9BC5;}



#uv h3 { margin:1em 0; }

#uv .unit { margin:0 0 25px 0; text-align:left; }

#uv .unit.image { text-align:center; }

#uv .unit.banner { margin-top:50px; }

#uv .unit.banner a:hover img { opacity:0.9; filter:alpha(opacity=90); }



#uv #lead.group { margin:0; padding:0; }

#uv #description.group { margin:50px 25px; padding:0; }









#uv #lead.group p,

#uv #lead.group dl{ margin-left:30px; }

#uv #lead.group dl { padding:0; }

#uv #lead.group dl dt{ margin:0 5px 0 0; padding:0; float:left; color:#1B9BC5; }

#uv #lead.group dl dd{ margin:0; padding:0; }

#uv #lead.group dl dt,

#uv #lead.group dl dd { margin-bottom:10px; }





#uv .unit h4{ margin:0.5em 0; padding:0; font-size:1.4em; font-weight:bold; color:#1B9BC5; clear:both; }

#uv #price-list.unit h4{ font-size:1.6em; color:#205CA7; }





#uv .unit.text { width:750px; }

#uv .unit.text div.top { margin:0; padding:4px 0; background:url(../imgdir/uv/bg_content_box_top.gif) no-repeat left top; /* border:1px solid #f00; */ }

#uv .unit.text div.body { margin:0; padding:0; background:url(../imgdir/uv/bg_content_box_body.gif) repeat-x left top; /* border:1px solid #0f0; */ }



#uv .unit.text div.bottom { margin:0; padding:0; background:url(../imgdir/uv/bg_content_box_bottom.gif) no-repeat left bottom; }

#uv .unit.text div.body p { padding:1em; }





#uv .unit.image ul { text-align:center; }

#uv .unit.image ul li{ margin:0 10px; display:inline; }





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

橋本**************************************/

#uv #price-list #uv_manyu {  }

#uv .unit2 { width:750px; border-bottom:1px solid #1B9BC5; border-left:1px solid #1B9BC5; border-right:1px solid #1B9BC5; 

background-image:url(../imgdir/uv/img_haikei.jpg); background-position:0 50px;

background-repeat:no-repeat; }





#uv #price-list.unit table { margin:20px 30px 0 0; padding:0; }

#uv #price-list.unit table caption { margin:0 0 1em 0; padding:0 0 0 10px; color:#F7BB3F; font-size:1.2em; text-align:left; }

#uv #price-list.unit table th,

#uv #price-list.unit table td{ margin:0; padding:5px; color:#333; border:none; border-bottom:1px solid #ddd; }









#uv #price-list.unit table th { background-color:transparent; font-weight:bold; padding-right:25px; }

#uv #price-list.unit table td { padding:5px 50px 5px 75px; }







#product { color:#333; }

#product a { color:#F68B38; text-decoration:none; }

#product a:hover { text-decoration:underline; }

#product a:visited { color:#F68B38;}



#product h3 { margin:1em 0; }

#product .unit { margin:0 0 15px 0; padding:0 0 15px 0; text-align:left; background:url(../imgdir/uv/dot2.gif) repeat-x left bottom; clear:both; }



#product #lead.group { margin:0 0 50px 0; padding:0; }

#product #description.group { margin:50px 25px; padding:0; }









#product #lead.group dl{ margin:0; padding:0; }

#product #lead.group dl dt{ margin:0 0 1em 0; padding:0; }

#product #lead.group dl dd{ margin:0 0 1em 40px; padding:0; }







#product .unit h4{ margin:0.5em 0; padding:0; font-size:1.4em; font-weight:bold; color:#F68B38; clear:both; }



#product .unit div.image img { padding:5px; background:url(../imgdir/uv/dot.gif) repeat left top; }





#product .unit div.exp { width:500px; }

#product .unit div.exp table { margin:0; padding:0; width:50%; }

#product .unit div.exp table caption { margin:0 0 1em 0; padding:0 0 0 10px; color:#F7BB3F; font-size:1.2em; text-align:left; }

#product .unit div.exp table th,

#product .unit div.exp table td{ margin:0; padding:5px; color:#333; border:none; border-bottom:1px solid #ddd; }



#product .unit div.exp table th { background-color:transparent; font-weight:bold; width:50px;  }

#product .unit div.exp table td { text-align:left; }



#product .unit div.exp dl { margin:1em 0; padding:0; }

#product .unit div.exp dl dt{ margin:0 0 0.25em 0; padding:0; font-weight:bold; color:#F68B38; }

#product .unit div.exp dl dd{ margin:0; padding:0; }









