@charset "UTF-8";

/* ボディ設定*/
html {
  font-size: 62.5%; /* sets the base font to 10px for easier math */
}
body{
	font-size: 16px;
	font-size: 1.6rem;
	font-family: Helvetica, Roboto, "Droid Sans", "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", Meiryo, "メイリオ", sans-serif;
	line-height: 1.8;
	color: #111;
}
body {
  -webkit-text-size-adjust: 100%;
  -moz-text-size-adjust: 100%;
  -ms-text-size-adjust: 100%;
  -o-text-size-adjust: 100%;
  text-size-adjust: 100%;
}
p,dt,dd,li,th,td{
	font-size:13px;
	font-size:1.3rem
}
img{
  max-width: 100%;
  height: auto;
}
.container{
	margin:0 auto;
	width:100%;
}
.contents{
	margin:0 auto;
}
.contents::before,
.contents::after,
.contents .section::before,
.contents .section::after{
	cotent:"";
	clear:both;
	display:block;
}
.contents .inner{
	width:960px;
	margin:0 auto;
}
.section{
	padding-bottom:60px;
}
.contents .inner .section{
	padding:0 80px 60px;
}
#home .section{
	padding-bottom:90px;
	border-bottom: 0.5px solid #ebebeb;
}
#home .contents p,
#second .contents p{
	line-height:2.1;
	letter-spacing:0.1em;
}
header {
	text-align: center;
	margin: 0 auto;
}
header:before,
header:after {
	content:"";
	clear:both;
	display:block;
}
footer {
	border-top:1px solid #eaeaea;
}
.footerInner{
	width:800px;
	margin:0 auto;
	padding:1.2em 0 1.4em;
}
.footerInner::before,
.footerInner::after{
	content:"";
	clear:both;
	display:block;
}
.footerInner small{
	float:right;
	line-height:2.8;
}
.footerList{
	float:left;
}
.footerList li{
	font-size: 12px;
	font-size: 1.2rem;
	display:inline-block;
	margin-right:35px;
}
.footerList .instaNav{
	width:16px;
	line-height: 1;
    margin-bottom: 4px;
    vertical-align: bottom;
}

/* ---------------------------------
	Header
--------------------------------- */
#mainVisual{
}
#mainVisual .col img{
	max-width:100%;
	width:100%;
	height:auto;
	vertical-align:top;
	z-index:5;
}

#head{
	background:#fff;
	border-bottom:1px solid #ebebeb;
	height:100px;
	width:90%;
	z-index:500;
	opacity:0.95;
}
header.fixed {
	position: fixed;
	left: 5%;
	top: 0;
}

#second #head{
	position:fixed;
	top:0;
}
.headerInner{
	margin: 0 auto;
	width: 960px;
}
.headerInner::before,
.headerInner::after{
	content:"";
	clear:both;
	display:block;
}
.headerInner ul{
	float: right;
	width: 50%;
	height: auto;
	margin: 0 auto;
	line-height: 100px;
	display: block;
}
.headerInner li{
	padding: 0px 30px;
	display: inline-block;
}
.headerInner li:last-child{
	margin-right:0;
}
.siteId{
	float:left;
	padding: 10px 0px;
	width: 50%;
}

.fixed {
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 1000;
}

audio {
	padding: 18px 0px;
	float: right;
}

.audio-coment {
    float: right;
    height: 100px;
    padding-right: 20px;
}

.audio-coment h4{
    line-height: 100px;
}

.audio-btn {
    height: 100px;
    width: 960px;
    margin: 0 auto;
}

/* ---------------------------------
	Heading
--------------------------------- */
h1{
	margin:0;
	padding:0;
}
#home .contents h2{
	padding-bottom:32px;
	padding-top:30px;
}
#home .contents h3{
	padding-bottom:18px;
}
h3.notoSans{
	font-size:20px;
	font-size:2rem;
	letter-spacing:0.06em;
	line-height:1.7;
}

/* ---------------------------------
	top-Contents
--------------------------------- */
#home .contents .column_2 .imgRight{
	width:430px;
	padding:0 0 0 60px;
}
#home .contents .column_2 .imgLeft{
	width:430px;
	padding:0 60px 0 0;
}
.column_2::before,
.column_2::after{
	cotent:"";
	clear:both;
	display:block;
}
.column_2 .span_3{
	width:48.4%;
	margin-right:3.2%;
	margin-bottom:2.8%;
}
.column_2 .inner .span_3:nth-child(2n+0){
	margin:0;
}

/* ---------------------------------
	Second
--------------------------------- */
#second .contents .inner{
}
.secondVisual{
	height:340px;
	position:relative;
	text-align:center;
	width:100%;
	z-index:5;
	margin-top:70px;
}
.secondVisual.bgAbout{
	background:url(../../about/images/second_visual_about.jpg) no-repeat  center center / cover;
}
.secondVisual.bgPlants{
	background:url(../../plants/images/second_visual_plants.jpg) no-repeat  center center / cover;
}
.secondVisual.bgSalon{
	background:url(../../salon/images/second_visual_salon.jpg) no-repeat  center center / cover;
}
#second .contents h2 {
	font-size:30px;
	font-size:3rem;
    padding-bottom: 32px;
}
#second .contents h3 {
    padding-bottom: 18px;
}
#second.plants .contents h2 {
	font-size:22px;
	font-size:2.2rem;
    padding-bottom: 20px;
}

/* about */
.about .contents .inner .section{
	padding:0 95px 60px;
}
.about .contents .column_2 .imgLeft {
    padding: 0 60px 0 0;
    width: 355px;
}
.about .contents .column_2 .imgRight {
    padding: 0 0 0 60px;
    width: 355px;
}
.about .contents .inner .section .column_2 {
	min-height:345px;
}
.about .contents .inner .section .column_2 .tableCell {
	height:345px;
	display: table-cell;
     vertical-align: middle;
}
.about .contents .inner .sectionIrregular .column_2 .tableCell {
	height:372px;
	display: table-cell;
     vertical-align: middle;
}
.about .contents .inner .sectionIrregular{
	margin-left:-15px;
    padding:0 95px 60px;
}
.about .contents .inner .sectionIrregular:before,
.about .contents .inner .sectionIrregular:after{
	content:"";
	clear:both;
	display:block;
}
.about #shopInfo{
	padding-top:20px;
}

/* plants */
.plants .contents .column_2{
	min-height:420px;
}
.plants .contents .column_2 .imgLeft {
    padding: 0 58px 0 0;
    width: 315px;
}
.plants .contents .column_2 .imgRight {
    padding: 0 0 0 60px;
    width: 320px;
}
.secondCover{
	/*height:500px;*/
	height:40vw;
	z-index:5;
}
.recommendTtl{
	width:218px;
	margin:0 auto;
}
.secondCover.coverPlants{
	background:url(../../plants/images/bg_plants01.jpg) no-repeat center center / cover;
}

.flameBox{
	border:2px solid #111;
	padding:20px;
}
.flameBox::before,
.flameBox::after{
	content:"";
	clear:both;
	display:block;
}

/* salon */
.salon .contents .column_2 {
    min-height: 290px;
}
.salon .contents .column_2_hi {
    min-height: 420px;
}
.salon .contents .column_2 .imgLeft {
    padding: 0 60px 0 0;
    width: 380px;
}
.salon .contents .column_2 .imgRight {
    padding: 0 0 0 60px;
    width: 380px;
}
.salon .contents .column_2_hi .imgRight {
    padding: 0 0 0 60px;
    width: 320px;
}
#second.salon .contents h2 {
    font-size: 2.2rem;
	line-height:1.4;
    padding-bottom: 20px;
}
.column_2_hi::before,
.column_2_hi::after {
	content:"";
    clear: both;
    display: block;
}
.salon .secondCover{
	height:600px;
	height:40vw;
	z-index:5;
}
.secondCover.coverSalon{
	background:url(../../salon/images/bg_salon.jpg) no-repeat center center / cover;
}
.salonMenu{
}
.contents .inner .section.salonMenu {
    padding: 0 210px 60px;
}

/* ---------------------------------
	Buttons
--------------------------------- */
.button {
    display: inline-block;
    font-family: "Open Sans",sans-serif;
    font-size: 14px;
	font-size:1.4rem;
    height: 34px;
    line-height: 34px;
    outline: medium none;
    text-align: center;
    text-decoration: none;
    width: 100px;
}
.button::before,
.button::after {
    content: "";
    display: block;
    position: absolute;
    z-index: -1;
    box-sizing: border-box;
    transition: all 0.3s ease 0s;
}
.contents .button{
	margin-top:24px;
}
.button01 {
	background: #fff;
	border: 1px solid #222;
	color: #222;
	display: none;
}
.button01:hover {
	background: #222;
	background-color: #222;
	color: #fff;
}
/* ---------------------------------
	 List style
--------------------------------- */

/* ---------------------------------
	 Table 
--------------------------------- */
.table_type01 {
    width: 100%;
}
.table_type01 th {
    padding: 8px 4px;
    vertical-align: top;
    width: 135px;
	text-align:left;
	border-top:1px dotted #ddd;
}
.table_type01 td {
    padding: 8px 4px;
    width: 420px;
	border-top:1px dotted #ddd;
}
/* ---------------------------------
	 Link
--------------------------------- */
a:link, a:visited {
    color: #111;
    text-decoration: none;
}
a:hover, a:active {
    color: #111;
	transition:all 0.3s ease 0s;
}
#menu a:hover,
#menu a:active{
	text-decoration:none;
}
#pageTop a:hover{
	opacity:0.8;
}
.headerInner a:hover,
.footerList li a:hover,
.follow_us a:hover,
#timeline a:hover,
#nameInfo a:hover{
	opacity:0.65;
}
/* ---------------------------------
	 Other
--------------------------------- */
.alignCenter{
	text-align:center;
}
.imgRight {
    float: right;
    font-size: 0.9em;
    padding: 0 0 0 20px;
    width: auto;
}
.imgLeft {
    float: left;
    font-size: 0.9em;
    padding: 0 20px 0 0 ;
    width: auto;
}
.mb1em{
	margin-bottom:1em;
}
.mb105em{
	margin-bottom:1.5em;
}
.mb2em{
	margin-bottom:2em;
}
.mb25em{
	margin-bottom:2.5em;
}
#pageTop {
	width:46px;
    position: fixed;
	line-height:0;
    bottom: 40px;
	right: 22px;
    margin: 0;
}
.zoom-in {
    cursor: zoom-in;
}
.row {
    zoom: 1; /* float解除 for IE6/7  */
}
.row::before,
.row::after {
    content: "";
    clear: both;
    display: block;
}

/* ---------------------------------
	 shopInfo
--------------------------------- */
#shopInfo{
	width:960px;
	margin:0 auto;
	padding:50px 0px 70px 0px;
}
#shopInfo .inner{
	padding:0 80px;
}
.about #shopInfo .inner{
	padding:0 95px;
}
.shopInfo_data{
	width:420px;
	float:left;
}
.about .shopInfo_data{
	width:390px;
	float:left;
}
#shopInfo::before,
#shopInfo::after,
.shopInfo_data::before,
.shopInfo_data::after,
.shopInfo_data dl::before,
.shopInfo_data dl::after{
	content:"";
	clear:both;
	display:block;
}
#shopInfo .column_2 .imgRight{
	width:340px;
	padding-left:40px;
}
#shopInfo h2{
	padding-bottom:16px;
}
#shopInfo li,
#shopInfo dt,
#shopInfo dd{
	letter-spacing:0.1em;
}
#shopInfo ul{
	border-bottom:1px dotted #ccc;
	padding-bottom:10px;
	margin-bottom:10px;
}
#shopInfo dl{
}
#shopInfo dt,
#shopInfo dd{
	display:inline-block;
}
#shopInfo dt{
	font-weight:bold;
}
#shopInfo dd{
	margin-right:6px;
}

/* ---------------------------------
	 nameInfo
--------------------------------- */
#nameInfo{
	width:960px;
	margin:0 auto;
	padding:20px 0 60px;
}
#nameInfo .inner{
	padding:0 95px;
}
#second #nameInfo h3 {
    padding-bottom: 18px;
}
.about #nameInfo .imgRight {
    padding: 0 0 0 22px;
    width: 205px;
	line-height:1;
}

/* ---------------------------------
	 mapBox
--------------------------------- */
#mapBox{
	width:100%;
	height:400px;
	margin:0;
	padding:0;
}
#mapBox::before,
#mapBox::after{
	content:"";
	clear:both;
	display:block;
}

/* ---------------------------------
	 Media Queries
--------------------------------- */

@media screen and (max-width: 768px) {
	p,dt,dd,li,th,td{
		font-size:14px;
		font-size:1.4rem
	}
}

/* ---------------------------------
	 shopInfo
--------------------------------- */
#admin{
	width:960px;
	margin:0 auto;
	padding:50px 0px;
	border-bottom: 0.5px solid #ebebeb;
}
#admin .inner{
	padding:0 80px;
}
.about #admin .inner{
	padding:0 95px;
}
.tpks_area{
	width:420px;
	float:left;
}
.about .tpks_area{
	width:390px;
	float:left;
}
#admin::before,
#admin::after,
.tpks_area::before,
.tpks_area::after,
.tpks_area dl::before,
.tpks_area dl::after{
	content:"";
	clear:both;
	display:block;
}
#admin .column_2 .scd_area{
	width:340px;
	padding-left:40px;
}
#admin h2{
	padding-bottom:16px;
}
#admin li,
#admin dt,
#admin dd{
	letter-spacing:0.1em;
}
#admin ul{
	border-bottom:1px dotted #ccc;
	padding-bottom:10px;
	margin-bottom:10px;
}
#admin dl{
}
#admin dt,
#admin dd{
	display:inline-block;
	margin-block-start: 1em;
	margin-block-end: 1em;
}
#admin dt{
	font-weight:normal;
	border-bottom: dotted 1px #ccc;
}
#admin dd{
	margin-right:6px;
	line-height: 2.1;
}
.scd_area {
    float: right;
    font-size: 0.9em;
    padding: 0 0 0 20px;
    width: auto;
}