/***************************
Theme Name: Hair-CLICHE
Theme URI: http://hair-cliche.net/
Author: 
Author URI:http://hair-cliche.net/
Created by: 
Description:
Version:  1.3
Tags: black, white,green, custom-menu, right-sidebar,featured-image-header, sticky-post, theme-options, threaded-comments, featured-images, flexible-header, responsive-layout
License: GNU General Public License v3 or later
License URI: http://www.gnu.org/licenses/gpl.html
Text Domain: hair

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

/*Font*/

.en{font-family: 'Oswald', sans-serif; font-weight:400;}
.en_b{font-family: 'Oswald', sans-serif; font-weight: 700;}
.en_lb{font-family: 'Anton', sans-serif;}


.clear{ clear:both; font-size:1px; line-height:100%;}


body{
	font-family:
	"ヒラギノ角ゴ Pro W3",
	 "Hiragino Kaku Gothic Pro",
	 "メイリオ", Meiryo, Osaka,
	 "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;

	width:100%;
	letter-spacing: 0.2em;
}

.sp_only{ display:none;}

.error{float:left; width:100%; height:200px; background:#EFE9D9;text-align:center;}

/* =========================================================
Contents
========================================================= */

.pkuzu{float:left; width:100%; background:#EFE9D9;}
.pkuzu a{text-decoration:none;}

.pkuzu .innr{float:left; width:90%; margin:1% 7% 1% 5%; letter-spacing: 0.1em;}

.pkuzu .innr .home{float:left; }
.pkuzu .innr .home a{color:#640000;padding-bottom:2px;}

.pkuzu .innr .second{float:left;padding:0 10px 0 10px;}
.pkuzu .innr .second img{padding-bottom:2px;}
.pkuzu .innr .second a{font-weight:bold;color:black;}


.border-box {
	border: 1px solid #640000; 
	width:80px;
	text-align:center;
	font-size:12px;
	color:#640000;

	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-o-box-sizing: border-box;
	-ms-box-sizing: border-box;
	box-sizing: border-box;

	margin:10px 0px 10px 0px;
}

/* =========================================================
Header
========================================================= */
header {width:100%; background-color:#640000;position:relative; z-index: 2;}

header .page{float:left; width:100%;background:#640000; margin: auto;}

header .innrtop{float:left; width:90%; max-width:1020px;margin-left:7%;margin-right:3%;padding:0px;background:#640000;}

header .innrtop .left-box{float:left;}
header .innrtop .left-box h1{ padding:5px 5px 5px 5px; }
header .innrtop .left-box a{ text-decoration:none; color:white; font-size:12px;}

header .innrtop .center-box{ float:right;margin:7px 20px 5px 0;}

header .innrtop .right-box{ float:right;text-align:right;padding:5px 5px 5px 0px ; background:url(/images/common/icon_mail.png) no-repeat left;}
header .innrtop .right-box a{ text-decoration:none; color:white; font-size:12px; margin-left:30px;}

/* =========================================================
Header Menu
========================================================= */
header .page-menu{float:left; width:100%;background:#FCFAF1; margin: auto;}

header .innrmenu{float:left; width:90%; max-width:1020px;margin-left:7%;margin-right:3%;padding:0px;background:#FCFAF1;}

header .innrmenu .left-box{float:left;padding:25px 0 25px 0;}

header .innrmenu .right-box{float:right;padding:20px 0 25px 0; }
header .innrmenu .right-box nav{ padding:36px 0 0 0;}
header .innrmenu .right-box nav ul{ float:right;}
header .innrmenu .right-box nav ul li{ float:left; font-size:0.85em; line-height:100%; padding:0 0 8px 0; margin-left:8px;}
header .innrmenu .right-box nav ul li.last:after{content:""; color:#AAAAAA;}
header .innrmenu .right-box nav ul li a{ font-weight:bold; color:#333; text-decoration:none; margin-right:8px;}
header .innrmenu .right-box nav ul li.last a{margin-right:0px;}


/*==========================================================
TopImage
========================================================= */
.topimg{float:left; width:99.8%;  background:#FCFAF1;}

.topimg .relative {position: relative;}

.topimg .absolute {position: absolute; bottom: 300px; right:-1%; color: #fff; width: 100%; max-width: 800px; padding: 1em 0;}
.topimg .absolute p {margin: 0; padding: 0 0.8em; font-size: 180%; text-align: right;}
.topimg .absolute h3 {margin: 0; padding: 0 0.8em; font-size: 180%; text-align: right;}


.topimg .innrorder {position: absolute; bottom: 150px; left:35%; color: #fff; background:#640000; padding:1% 5% 1% 5%;}
.topimg .innrorder a{text-decoration:none; color:white; font-size:15px;}

/*==========================================================
【 SPECIAL 】
========================================================= */
.special{float:left; width:100%; background:#FCFAF1;}
.special .innr{float:right; height:30px; ;margin-right:3%; margin-left:auto; background:#FCFAF1;}
.special .innr h3{float:right; padding:0 10px 0 10px;}
.special .innr a{text-decoration:none;  font-weight:bold; font-size:12px; padding:5px 10px 5px 10px;}


/*==========================================================
【 NEWS 】
========================================================= */
.news {float:left; width:100%; background:#FCFAF1;}
.news .innr{width:90%; margin-left:7%; margin-right:3%; padding:0px; height:150px;}

.news .innr .img {
	float:left; background:#640000;
	height:100px; width:100px; border-radius:50%;
	background-position:center;
	text-align:center; color:white;
}

.news .innr .txt{padding-top:25px;}
.news .innr p{text-align: center;color: #fff; margin:0;}

.news .innr .list {float:left; margin-top:2%; margin-left:5%;  font-size:0.9em; }
.news dl{display:table;padding-bottom:10px;}
.news dl dt{display:table-cell; text-align:left; padding-right:10px;width:auto; vertical-align:center; letter-spacing: 0.1em; font-style:italic;}
.news dl dd{display:table-cell; vertical-align:center; padding-right:10px;}
.news .innr .list a{text-decoration:none; color:black;}

.news .innr .coponimg {
	float:right; width:30%; min-height:100px; margin-left:30px; margin-top:2%;
	background-image:url(/images/top/BNR01.jpg);
	background-repeat:no-repeat; 
}

/*==========================================================
【 CONCEPT 】
========================================================= */
.concept{float:left; width:100%; background:#F2EACE;}

.concept .innr{float:left; width:100%; height:600px;max-width:1440px;

	background-image:
	url(/images/top/photo02-002.png),
	url(/images/top/photo_spot02.png),
	url(/images/top/photo_spot03.png),
	url(/images/common/spot_bg_left.png),
	url(/images/common/spot_bg_right.png);

	background-repeat:
	no-repeat, 
	no-repeat,
	no-repeat,
	no-repeat,
	no-repeat;

	background-position:
	20% 200px ,
	50% 200px ,
	80% 200px ,
	-20% 0px ,
	120% 0px;

	background-size:
	20% auto , 
	20% auto , 
	20% auto , 
	auto auto , 
	auto auto ;

}


.concept .innr .title{float:left; width:100%; height:100px;
		background-image:url("/images/common/title_bg.png");
		background-repeat: no-repeat;background-position: 50% 10%;}

.concept .innr .title h2{text-align:center;color:#640000;font-size:28px;margin-top:2%;}

.concept .innr .info{float:left; width:40%; margin-left:35%; font-size:1.2em; font-weight:bold;}
.concept .innr .more{float:left; width:20%; margin-left:46%; margin-top:10px;}
.concept .innr .more a{text-decoration:none; color:#640000; padding:0 10px 0 10px;}

.concept .innr .about{float:left; width:80%; margin:25% 0% 0% 15%; letter-spacing: 0.1em; }
.concept .innr .about ul{float:none;}
.concept .innr .about li{float:left; font-size:0.8em; padding:0 20px 0 0; }


/*==========================================================
【 CONCEPT SUB】
========================================================= */

.sub-concept{float:left; width:100%; background:#FCFAF1;}

.sub-concept .innr{float:left; width:100%; height:100%;max-width:1440px;}

.sub-concept .innr .info{float:left; margin-top:5%; margin-left:40%; }
.sub-concept .innr .info h2{text-align:center;font-size:1.2em; font-weight:bold;}

.sub-concept .innr .about{float:left; width:70%; margin-left:20%;margin-top:2%;}
.sub-concept .innr .about p{padding:0 10px 10px 10px; }

.sub-concept .innr .txt{float:left; width:75%; margin-left:15%;margin-top:2%;}
.sub-concept .innr .txt p{padding:0 10px 10px 10px; }

.sub-concept .innr .list{float:left; width:75%; margin-left:15%;margin-top:2%;}
.sub-concept .innr .list dl{display:table; padding:0 10px 10px 10px;}
.sub-concept .innr .list dl dd{ display:table-cell; vertical-align:center; padding-right:10px;}

/*==========================================================
【 ACCEESS 】
========================================================= */
.access{float:left; width:100%; height:100px; background:#FCFAF1; 
		background-image:url("/images/common/title_bg.png");
		background-repeat: no-repeat;background-position: center;}


.access h2{margin-top:25px;text-align:center;color:#640000;font-size:28px;}


/*==========================================================
【 Map 】
========================================================= */
.ggmap {position: relative;padding-bottom: 56.25%;padding-top: 30px;height: 0;overflow: hidden;}
 
.ggmap iframe,
.ggmap object,
.ggmap embed {position: absolute;top: 0;left: 0;width: 100%;height: 100%;}

.maplink {float:left;width:100%;background:#FCFAF1;text-align:center; }
.maplink a{text-decoration: none;color: #640000; font-size:10px;}


/*==========================================================
【ROUTE】
========================================================= */
.route{float:left;width:100%; background:#FCFAF1;}

.route .innr{float:left;width:90%; margin:3% 3% 0 7%; min-height:300px;
	background-image:url("/images/top/photo_shop.png");
	background-repeat: no-repeat;
	background-position: left;
}



.route .innr .over-box{float:left; width:55%; margin-top:3%; margin-left:320px; font-size:0.7em; letter-spacing: 0.1em;}

.route .innr .over-box dl{display:table;}

.route .innr .over-box dl dt{
	display:table-cell; font-weight:bold; text-align:left; padding-right:10px;	width:auto; vertical-align:center;
}

.route .innr .over-box dl dd{ display:table-cell; vertical-align:center; padding-right:10px;}


.route .innrsp{float:left;}


/*==========================================================
【SCHEDULE】【BLOG】
========================================================= */
.other{float:left; width:100%;background:#FCFAF1;}
.other .innr{float:left; width:90%; margin-left:7%;margin-right:3%; padding:0px;}
.other .innr h2{text-align:center;color:#640000;font-size:28px; margin-top:2%;margin-bottom:2%;}

.schedule{float:left; width:45%;  height:50%; margin-right:3%; }
.schedule h3{padding:10px 0 10px 0; font-weight:bold;text-align:center;}


.schedule .cal{float:left; width:100%;  height:250px; margin-right:3%; }
.schedule .cal p{background:#640000;color:white;}

.blog{float:left;width:45%;  height:50%; }
.blog .more{float:left; width:25%; margin-left:40%; margin-top:10px;}
.blog .more a{text-decoration:none; color:#640000; padding:0 10px 0 10px;}
.blog .list{float:left;margin-top:20px;font-size:0.8em;}
.blog .list a{color:black;}

.blog dl{display:table;}
.blog dl dt{display:table-cell; text-align:left; padding:5px 10px 10px 0 ;width:auto; vertical-align:center; font-style:italic;}
.blog dl dd{display:table-cell; vertical-align:center; padding:5px 10px 10px 0;width:auto;}

/*BLOGメイン*/

.blog-main{float:left;width:100%; background:#FCFAF1;}
.blog-main p{margin-bottom:10%;}

.blog-main .innr{float:left; width:90%; max-width:1020px; margin-left:7%;margin-right:3%; margin-top:3%;}

.blog-main .innr .left-box{float:left; width:25%; min-width:250px;}

.blog-main .innr .left-box .article{float:left;width:100%;margin:0 0 20px; 0;}
.blog-main .innr .left-box .category{float:left;width:100%; border-bottom:#640000 solid 1px;  margin:0 0 20px 0;}
.blog-main .innr .left-box h5{color:#640000; font-weight:bold; font-size:1.1em;}
.blog-main .innr .left-box a{text-decoration:none; color:black;}
.blog-main .innr .left-box img{padding:0 5px 2px 0 };
.blog-main .innr .left-box .article li{font-size:0.9em; }

.blog-main .innr .left-box .article dl{font-size:1.0em;}
.blog-main .innr .left-box .article dt{font-size:0.8em; font-style:italic; color:gray;}
.blog-main .innr .left-box .article dd{padding-bottom:10px;}


.blog-main .innr .right-box{float:right; width:65%; }
.blog-main .innr .right-box h3{color:#640000; font-weight:bold; font-size:1.2em; margin:0 0 20px 0;}
.blog-main .innr .right-box h4{font-size:0.8em; margin:0 0 20px 0; font-style:italic;}
.blog-main .innr .right-box p{margin:0 0 10px 0;}
/*.blog-main .innr .right-box img{width:50%; height:50%;margin-bottom:10%;}*/

.blog-main .innr .right-box .phote img{width:50%; height:50%;margin-bottom:10%;}

.blog-main .innr .right-box .read-more{float:left;width:100%; border-bottom:black solid 0.5px;  padding:0 0 20px 0; margin-bottom:30px;}
.blog-main .innr .right-box .read-more a{text-decoration:none;  color:black; }
.blog-main .innr .right-box .read-more img{padding:0 10px 0 0;}


.blog-main .link-box{float:right; width:150px; background:#640000; margin: 10% 30% 5% 0%; padding:10px 10px 10px 20px ;}
.blog-main .link-box a{text-decoration:none;  color:white; font-size:15px; }


/*==========================================================
Scroll Link
========================================================= */
.sclink {float:left; width:100%; height:50px; background-color:#FCFAF1;}
.sclink .innr{float:left; width:90%; height:50px; max-width:1020px;margin-left:7%;margin-right:3%; }
.sclink .innr #pagetop{float:right; width:150px; }
.sclink .innr #pagetop a{text-decoration: none;color: #640000; font-weight:bold; letter-spacing: 0.2em;  padding:10px 0 10px 0;}

/*==========================================================
Footer
========================================================= */
footer {width:100%; background-color:#640000;}

footer .page{float:left; width:100%;background:#640000; margin: auto;}

footer .page .innr{float:left; width:90%; max-width:1020px; margin-left:7%;margin-right:3%;background:#640000;}

footer .page .innr .left-box{float:left; margin-top:5%;margin-bottom:5%; color:white;  font-size:12px;}

footer .page .innr .left-box h3{ padding:5px 5px 10px 0px; }
footer .page .innr .left-box a{ text-decoration:none; color:white; font-size:12px;}
footer .page .innr .left-box p{ padding:10px 0 0 0;}


footer .page .innr .left-box nav{ padding:3px 0 0 0;}
footer .page .innr .left-box nav ul{ float:right;}
footer .page .innr .left-box nav ul li{ float:left; font-size:0.85em; line-height:100%; padding:0 0 8px 0; }
footer .page .innr .left-box nav ul li.last:after{content:""; color:white;}
footer .page .innr .left-box nav ul li a{ color:white; text-decoration:none; margin-right:8px;}
footer .page .innr .left-box nav ul li.last a{margin-right:0px;}

footer .page .innr .right-box{float:right; margin-top:3%;margin-bottom:5%; color:white; font-size:12px; text-align:right;}
footer .page .innr .right-box img{padding-bottom:10px;}

/*==========================================================
SubImage
========================================================= */
.subimg{
	float:left; width:100%; height:200px;
	background-image:url(/images/common/s03.jpg);
	background-repeat: no-repeat;
	background-size: cover;
}

.dot {
	width:100%; height:100%;
	background-image:url(/images/common/dot_B.png);
	background-repeat: repeat;
}

.dot .innr{width:100%; padding-top:5%;}

.dot  h1{text-align:center; color:white; font-size:36px; letter-spacing: 0.2em;}
.dot  h2{text-align:center; color:white; font-size:16px;}




/*==========================================================
【 STAFF 】
========================================================= */
.staff{float:left;width:100%; background:#FCFAF1;}


.staff .staff-name{float:left; width:100%; height:200px; 
		background-image:url("/images/common/title_bg.png");
		background-repeat: no-repeat;background-position: center;}

.staff h2{margin-top:70px; text-align:center; color:#640000; font-size:28px; font-weight:bold;}
.staff h3{text-align:center; color:#640000; font-size:12px; font-weight:bold;}

.staff .staff-photo {float:left; width:100%; height:125px;}
.staff .staff-photo img{position: absolute;left: 50%;margin-left: -100px; width:200px; height:125px;}

.staff .innr{float:left; width:90%; height:400px;margin-left:7%;margin-right:3%;margin-top:5%; }

.staff .innr .prof{float:left; width:45%; }

.staff .innr dl{float:left; display:table; font-size:1.1em; }
.staff .innr dl dt{
	display:table-cell; text-align:right; padding:15px 0 15px 0; width:130px; 
	vertical-align:center; border-bottom:#640000 solid 2px;color:#640000;
}

.staff .innr dl dd{
	display:table-cell; text-align:left; width:400px;
	vertical-align:center; padding:15px 0 15px 15px ; border-bottom:#EEEEEE solid 2px;
}

.staff .innr .msg{float:left; width:45%; margin-left:5%;}
.staff .innr .msg p{word-wrap: break-word; padding-bottom:10px;}



.staff .recult{float:left; width:90%; height:100%;margin-left:7%;margin-right:3%;margin-top:5%;}
.staff .recult dl{float:left; display:table; font-size:1.1em; }
.staff .recult dl dt{
	display:table-cell; text-align:right; padding:15px 0 15px 0; width:150px; 
	vertical-align:center; border-bottom:#640000 solid 2px;color:#640000;
}

.staff .recult dl dd{
	display:table-cell; text-align:left;width:800px; 
	vertical-align:center; padding:15px 0 15px 15px ; border-bottom:#EEEEEE solid 2px;
}




/*==========================================================
【 SMENU 】
========================================================= */
.smenu{float:left;width:100%; background:#FCFAF1;}


.smenu .innr{float:left; width:90%; height:100%;margin-left:7%;margin-right:3%;margin-top:1%;}

.smenu .innr .link{float:left; width:90%; margin-top:3%; margin-bottom:1%;}

.smenu .innr .link nav{ padding:5px 0 0 0;}
.smenu .innr .link nav ul{ float:right;margin-right:5%;}
.smenu .innr .link nav ul li{ float:left;  font-size:0.85em; line-height:100%; padding:0 0 5px 0; margin-left:8px;}
.smenu .innr .link nav ul li:after{content:"/"; color:#AAAAAA;}
.smenu .innr .link nav ul li.last:after{content:""; color:#AAAAAA;}
.smenu .innr .link nav ul li a{ font-weight:bold; color:#333; text-decoration:none; margin-right:5px;}
.smenu .innr .link nav ul li.last a{margin-right:0px;}


.smenu .innr .title{
		float:left; width:100%; height:100px; background:#FCFAF1; margin-top:40px;
		background-image:url("/images/common/title_bg.png");
		background-repeat: no-repeat;background-position: center;
}

.smenu .innr .title h2{margin-top:15px;text-align:center;color:#640000;font-size:32px;}
.smenu .innr .title h3{margin-top:1px;text-align:center;color:#640000;font-size:12px;font-weight:bold;}

.smenu .innr .list{
	float:left; width:90%; height:90px;
	margin-left:7%;margin-right:3%;margin-top:3%; 
	border-bottom:1.5px solid #640000;}

.smenu .innr .list .txt{float:left;width:70%;}

.smenu .innr .list .price{float:right; font-size:28px; color:#640000; padding:10px 10px 10px 10px;}

.smenu .innr dl{font-weight:bold;}
.smenu .innr dl dt{text-align:left; width:auto; vertical-align:center; padding-left:10px;}

.smenu .innr dl dd{text-align:left; width:auto; vertical-align:center; font-size:0.8em; padding-left:10px;}


/*==========================================================
【 CAMPAIGN 】
========================================================= */

.campaign{float:left;width:100%; background:#FCFAF1;}

.campaign .title{
		float:left; width:100%; height:100px; background:#FCFAF1; margin-top:40px;
		background-image:url("/images/common/title_bg.png");
		background-repeat: no-repeat;background-position: center;
}

.campaign .title h2{margin-top:15px;text-align:center;color:#640000;font-size:28px;}
.campaign .title h3{margin-top:1px;text-align:center;color:#640000;font-size:12px;font-weight:bold;}

.campaign .about{float:left; margin-left:10%; width:80%; height:100%;text-align:center;}

.campaign .innr{float:left; width:80%; height:100%;margin-left:10%;margin-right:3%;margin-top:1%;}
.campaign .innr .ticket{float:left; width:90%; height:100%; margin:3% 3% 5% 3%; background:#EFE9D9;}

.campaign .innr .ticket .price{color:#640000; font-size:28px; padding:20px 5px 5% 40%;}
.campaign .innr .ticket p{float:left; color:#640000;font-weight:bold; font-size:20px; padding:0 20px 20px 10px; letter-spacing: 0.1em;}

.campaign .innr .ticket dt{color:#640000; padding:20px 5px 5px 20%; font-weight:bold;}
.campaign .innr .ticket dd{padding:0 5px 5px 25%; }