/*
2015.04
aromafig.com
*/

@import "../font/font-face.css";


/* ===============================================
/ html5 reset
=============================================== */
html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre, a,
footer, header, menu, nav, section, summary,
article, aside, canvas, details, figcaption, figure, 
abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var, b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
time, mark, audio, video {
	margin:0; padding:0; border:0; outline:0; vertical-align:top;
	}
body {
	line-height:1;
	}
article, aside, details, figcaption, figure, footer, header, menu, nav, section {
	display:block;
	}
ul, li{
	list-style:none;
	}
blockquote, q {
	quotes:none;
	}
blockquote:before, blockquote:after,q:before, q:after {
	content:''; content:none;
	}
a {
	vertical-align:baseline;
	border:none;
	outline:none;
	}
table {
	border-collapse:collapse; border-spacing:0;
	}
input, select {
	vertical-align:middle;
	}


/* ===============================================
/ base font
=============================================== */
html { font-size: 62.5%; }
body {
	font-family: "NotoSans_L", sans-serif;
	color:#000;
	letter-spacing:0.025em;
	-webkit-text-size-adjust:none;
	}
h1,	h2, h3, h4, h5 {
	font-size:10px;
	font-weight:normal;
	}
.f11 { font-size:1.1em; line-height:2; }
.f12 { font-size:1.2em; line-height:2; }
.f14 { font-size:1.4em; letter-spacing:0.03em; line-height:2; }
.f18 { font-size:1.8em; letter-spacing:0.03em; line-height:2; }

.size90 { font-size:90%;}
.size80 { font-size:80%;}


/* ===============================================
/ common
=============================================== */
body {
	width:100%;
	}
a {
	color:#000;
	text-decoration:none;
	}
a:hover {
	color:#999;
	}


/* ===============================================
/ gnav, footer
=============================================== */
#gnav {
	width:100%;
	height:120px;
	background:#fff;
	position:relative;
	}
#gnav .inner {
	width:960px; margin:0 auto;
	position:relative;
	}
#gnav h1 {
	position:relative;
	top:10px;
	}
#gnav h1 a img:hover {
	opacity: 0.75; -ms-filter: "alpha(opacity=75)";
	}
.gnav_ary {
	position:absolute;
	top:0; right:0;
	font-size:1.1em;
	font-family: 'Josefin Sans', sans-serif;
	font-weight:600;
	letter-spacing:0.25em;
	}
.ua_ie .gnav_ary {font-weight:400;}
.gnav_ary, .gnav_ary ul:before, .cf:after {content:""; display:table;}
.gnav_ary, .gnav_ary ul:after {clear:both;} .cf {zoom:1;}
.gnav_ary ul {
	float:right;
	}
.gnav_ary li {
	float:left;
	margin-left:30px;
	}
.gnav_ary .gray a {
	color:#999;
	letter-spacing:0.15em;
	}
.gnav_ary a:hover {
	color:#999;
	}
.gnav_ary .gray a:hover {
	color:#000;
	}
.gnav_ary a.facebook:hover {
	color:#3b579e;
	}
.gnav_ary .w_jp {
	font-family: "NotoSans_DL", sans-serif;
	font-weight:normal;
	position:relative; top:-1px;
	}
.ua_mac .gnav_ary .w_jp  { position:relative; top:-2px; } /**/
.gnav_ary .w_jp:hover {
	color:#999;
	}
#gnav_sns {
	margin-top:40px;
	}
#gnav_site {
	margin-top:17px;
	clear:both;
	}
footer {
	width:960px; margin:0 auto;
	position:relative;
	height:90px;
	}
footer p {
	font-family:Georgia, serif;
	font-style:italic;
	font-size:1.1em;
	letter-spacing:0.1em;
	color:#999;
	line-height:1.63;
	padding-top:40px;
	}
#gnav_bottom {
	margin-top:55px;
	}
.gnav_ary .current {
	color:#999;
	}


/* ===============================================
/ common elem
=============================================== */
.w960 {
	width:960px; margin:0 auto;
	position:relative;
	}
.w800 {
	width:800px; padding:0 20px; margin:0 auto;
	position:relative;
	}
.bg_beige {
	background:url("../img/bg_beige.gif") left top repeat;
	}
.common_wrap {
	width:838px; margin:60px auto 0;
	padding:0 30px;
	background:#fff;
	border:1px solid #DBD8CC;
	}
.common_header {
	height:72px;
	line-height:75px;
	}
.common_header h1 {
	font-family: 'Josefin Sans', sans-serif;
	font-size:1.1em;
	font-weight:700;
	letter-spacing:0.25em;
	float:left;
	}
.common_header h1.w_jp {
	font-family: "NotoSans_DL", sans-serif;
	}
.common_header.ornament_organic {
	background:url("../img/ornament_organic.gif") 790px 22px no-repeat;
	}
.index ul {
	float:right;
	}
.index li {
	float:left;
	margin-left:22px;
	}
.index a {
	font-family: 'Josefin Sans', "NotoSans_L", sans-serif;
	letter-spacing:0.15em;
	color:#999;
	}
.index a:hover {
	color:#000;
	}
.main_pic {
	margin-top:45px;
	text-align:center;
	}
.line_top {
	border-top:1px solid #C7C4B9;
	}
.bg_line {
	border-bottom:1px solid #111;
	padding-bottom:0.3em;
	}
.ua_ie .bg_line {
	padding-bottom:0;
	}
.bg_line.ov:hover {
	border-color:#999;
	}


/* ===============================================
/ js
=============================================== */
.fade {
	visibility:hidden;
	}


/* ===============================================
/ edit
=============================================== */
.green { color:#477c74; }
.purple { color:#660066; }
.red {color:#cc0000;}
.u_line { text-decoration:underline;}

.fl {float:left;}
.fr {float:right;}
.cl {clear:both;}
.cf:before, .cf:after {content:""; display:table;} .cf:after {clear:both;} .cf {zoom:1;}
.float_list {clear:both;}
.float_list li {float:left;}
.float_list:after {content:""; clear:both; display:block;}

.txl {text-align:left;}
.txr {text-align:right;}
.txc {text-align:center;}
.nowrap {white-space:nowrap}

.mt-5 {margin-top:-5px !important;}
.mt-10 {margin-top:-10px !important;}
.mt0 {margin-top:0 !important;}
.mt5 {margin-top:5px !important;}
.mt10 { margin-top:10px !important; }
.mt20 { margin-top:20px !important; }
.mt25 { margin-top:25px !important; }
.mt30 { margin-top:30px !important; }
.mt35 { margin-top:35px !important; }
.mt40 { margin-top:40px !important; }
.mt50 { margin-top:50px !important; }
.mt60 { margin-top:60px !important; }
.mt70 { margin-top:70px !important; }
.mt80 { margin-top:80px !important; }
.mt90 { margin-top:90px !important; }
.mt100 { margin-top:100px !important; }
.mt110 { margin-top:110px !important; }

.mb0 {margin-bottom:0 !important;}
.mb5 {margin-bottom:5px !important;}
.mb10 {margin-bottom:10px !important;}
.mb20 {margin-bottom:20px !important;}
.mb25 {margin-bottom:25px !important;}
.mb30 {margin-bottom:30px !important;}
.mb35 {margin-bottom:35px !important;}
.mb40 {margin-bottom:40px !important;}
.mb50 {margin-bottom:50px !important;}
.mb60 {margin-bottom:60px !important;}
.mb70 {margin-bottom:70px !important;}
.mb80 {margin-bottom:80px !important;}
.mb90 {margin-bottom:90px !important;}
.mb100 {margin-bottom:100px !important;}
.mb110 {margin-bottom:110px !important;}

.lh25 {line-height:2.5}
.ls000 {letter-spacing:0.00em !important;}
.ls010 {letter-spacing:0.10em !important;}
.ls015 {letter-spacing:0.15em !important;}

.rel {position:relative;}
.inline {display:inline;}

.opa a:hover img {opacity: 0.80; -ms-filter: "alpha(opacity=80)";}