/* ===================================================================
CSS information
 file name  :  common.css
=================================================================== */
body {
	background-color:#FFFFFF;
	/* フォントの種類（閲覧環境により指定順の該当フォントで表示） */
	font-family:Roboto, "Droid Sans", "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo,Verdana,sans-serif;
	/* font-size:62.5% = 10px */
	font-size:62.5%;
}


/* basicのスタイル記述 */
/* ========== header ========== */
#header {
	margin:0 auto;
	padding:0;
	overflow: hidden;
	width: 1000px;
}
#header h1 {
	margin:20px 0px 0px 20px;
	padding:0;
	width:280px;
	height:60px;
	overflow: hidden;
	background: url(../images/logo.png) no-repeat 0px 0px;
}
#header h1 a {
	margin:0;
	padding:60px 0px 0px 0px;
	display: block;
	width: 280px;
	height: 0px;
	
}
/* nav */
nav#nav {
	margin: 0px 40px 0px auto;
	padding:0;
	width: 540px;
	height: 30px;
}
nav#nav ul {
	margin:0;
	padding:0;
	overflow: hidden;
	width: 540px;
	height: 30px;
}
nav#nav ul li {
	margin:0;
	padding:0;
	height: 30px;
	float: left;
}
nav#nav ul li a {
	margin:0;
	padding:0;
	display: block;
	height: 30px;
	font-size:1.5em;
	color:#898989;
	text-align:center;
}
nav#nav ul li.nav01 a {
	width: 125px;
}
nav#nav ul li.nav02 a {
	width: 120px;
}
nav#nav ul li.nav03 a {
	width: 120px;
}
nav#nav ul li.nav04 a {
	width: 175px;
}
nav#nav ul li a:hover {
	color:#707070;
}

/* ========== image ========== */
#main_image,#sub_image {
	margin: 0 auto;
	padding:0;
	width: 100%;
	height:auto;
	overflow: hidden;
}
#main_image img,#sub_image img {
	margin: 0 auto;
	display: block;
	width: 100%;
	height:auto;
	/*float: left;*/
	border: 0;
}

/* ========== contents ========== */
#contents {
	margin: 0 auto;
	width: 100%;
}
/* catch */
.catch {
	overflow: hidden;
	margin:0;
	padding:0;
	text-align:center;
}
.catch h2 {
	margin:50px 0px;
	color:#707070;
	font-size:3.0em;
	font-weight:normal;
}
.catch h2 span.kai {
}
.catch h2 span.sub {
	color:#a0a0a0;
	font-size:0.8em;
	font-weight:normal;
}

h2.h2_sub {
	margin:30px 0px;
	color:#707070;
	font-size:3.0em;
	font-weight:normal;
	text-align:center;
}

/* news */
section.news {
	margin:0;
	padding:0;
	width:100%;
}

section.news div.in_news_out {
	width:100%;
	background:#a0a0a0;
}

section.news div.in_news {
	margin:0px auto;
	max-width:1000px;
	color:#FFFFFF;
}

div.div_table {
	width: 100%;
	display:table;
}
div.div_table_title {
	margin:0;
	padding:30px 0px;
	width: 50%;
	display:table-cell;
	text-align:center;
	vertical-align:middle;
}
div.div_table_title h2 {
	font-size:3.0em;
	font-weight:normal;
}
div.div_table_desc {
	margin:0;
	padding:30px 1.5%;
	width: 50%;
	display:table-cell;
	text-align:left;
	vertical-align:middle;
	font-weight:normal;
}
div.div_table_desc h3 {
	font-weight:normal;
	font-size:2.4em;
}
div.div_table_desc ul.ul_top_campaign li {
	font-size:1.4em;
}
div.div_table_desc ul.ul_top_campaign li span.text_18 {
	font-size:1.28em;
}
div.div_table_desc p.p_desc {
	font-size:1.4em;
}
div.div_table_desc p.p_desc_contact {
	font-size:1.4em;
}

/* ========== Menu Price ========== */
div.menu_price_out {
	width:100%;
	background:#FFFFFF;
}
div.menu_price {
	margin:0px auto;
	max-width:1000px;
}
dl.dl_menu {
	margin:10px 0px 0px 0px;
	padding:0;
	width:100%;
	color:#A0A0A0;
	border-top:#a0a0a0 1px dotted;
}
dl.dl_menu dt {
	padding:20px 0px 20px 10px;
	font-size:1.4em;
	float:left;
}
dl.dl_menu dt span.menu_left {
	margin-right:1em;
}
dl.dl_menu dt span.menu_name {
	margin-right:1em;
	color:#707070;
	font-size:1.14em;
}
dl.dl_menu dd {
	padding:20px 10px 20px 0px;
	font-size:1.6em;
	text-align:right;
	border-bottom:#a0a0a0 1px dotted;
}
dl.dl_menu dd span.price_text_14 {
	margin-left:1em;	
	margin-right:1em;
	font-size:0.875em;
}
p.p_menu_desc {
	margin:20px 10px;
	font-size:1.4em;
	text-align:right;
	color:#A0A0A0;
}
p.p_menu_desc_right {
	margin:20px 10px;
	font-size:1.4em;
	text-align:right;
	color:#A0A0A0;
}
dl.dl_menu_t0 {
	margin-top:0;
	border-top:#a0a0a0 1px dotted;
}

/* ========== Art Sample ========== */
div.art_sample {
	margin:0px auto;
	padding:0px 10px;
	max-width:980px;
}
div.art_sample a {
	margin:1.6%;
	display: block;
	width: 21.8%;
	height:auto;
	float:left;
	position:relative;
}
div.art_sample a img {
	display: block;
	width: 100%;
	height:auto;
}
div.art_sample a img.icon_zoom {
	display: block;
	width: 22px;
	height:auto;
	position:absolute;
	right:5px;
	bottom:5px;
}

/* ========== Salon Info ========== */
dl.dl_about {
	margin:0px 0px 0px 0px;
	padding:0;
	font-size:1.4em;
}
dl.dl_about dt {
	margin:0;
	padding:5px 0px 0px 0px;
	color:#707070;
	font-weight:bold;
}
dl.dl_about dd {
	margin:0;
	padding:3px 0px 5px 0px;
}
img.img_about_logo {
}

div.map {
	margin:0px auto 30px auto;
	max-width:1200px;
	position: relative;
	padding-bottom: 28.33%;
	padding-top:0px;
	height: 0;
	overflow: hidden;
}
 
div.map iframe,
div.map object,
div.map embed {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}
img.nailist {
	margin: 0 auto;
	display: block;
	width: 100%;
	height:auto;
	/*float: left;*/
	border: 0;
}

div.div_table_nailist_out {
	margin: 30px auto 0px auto;
	width: 100%;
	display:table;
}
div.div_table_nailist_out2 {
	margin: 15px auto 0px auto;
	width: 100%;
	display:table;
}
div.div_table_nailist {
	margin:0;
	padding:15px 10px;	
	width: 50%;
	display:table-cell;
	vertical-align:top;
}

table.table_nailist_in {
	width: 100%;
}
table.table_nailist_in td {
	margin:0;
	padding:0px;	
	text-align:left;
}
table.table_nailist_in td.td_nailist_photo {
	width:40%;
}
table.table_nailist_in td.td_nailist_photo img {
	display: block;
	width: 100%;
	max-width:200px;
	height:auto;
	max-height:200px;
	border: 0;
} 
table.table_nailist_in td.td_nailist_name {
	width: 60%;
	vertical-align:middle;
}
table.table_nailist_in td.td_nailist_name h3 {
	font-weight:bold;
	margin-left:10%;
	font-size:1.4em;
}
table.table_nailist_in td.td_nailist_name h3 span.name_j {
	font-weight:normal;
	font-size:0.857em;
}
table.table_nailist_in td.td_nailist_desc {
	padding:15px 0px;
	font-size:1.4em;
}

/* ========== Contact Reservation ========== */

div.div_table_contact_head {
	margin-bottom:30px;
	min-height:180px;
}
div.div_table_desc h3.h3_form {
	margin-bottom:15px;
	font-size:3.0em;
}
div.div_table_desc p.p_desc_ind {
	text-indent:-1em;
	margin-left:1em;
}

span.contact_tel {
	font-size:1.14em;
}
span.contact_tel_no {
	margin-left:0.5em;
	font-size:2.14em;
}

a.a_hot_peppaer {
	margin-top:30px;
	display:block;
	width:100%;
	text-align:center;
	background:#FFFFFF;
}
a.a_hot_peppaer img {	
	vertical-align:bottom;
}

dl.dl_contact {
	margin:0px auto;
	width:98%;
	font-size:1.4em;
}

dl.dl_contact dt {
	display:block;
	padding:10px 10px 0px 10px;
	width:25%;
	float:left;
	text-align:right;
}

dl.dl_contact dd {
	padding:0px 10px 10px 30%;
	display:block;
	width:70%;
}

dl.dl_contact dd .in_wide {
	width:96%;
	padding:10px;
	font-size:1em;
	background:#EEEEEE;
	border:1px #999999 solid;
	border-radius: 0;
	-webkit-appearance: none;
}
dl.dl_contact dd input,
dl.dl_contact dd label,
dl.dl_contact dd select {
	vertical-align:middle;
}
dl.dl_contact dd .left_1em {
	margin-left:1em;
}
dl.dl_contact dd .in_date {
	width:2.5em;
	margin:2px;
	padding:3px;
	font-size:1em;
	background:#FFFFFF;
	border:1px #999999 solid;
	border-radius: 0;
	-webkit-appearance: none;
}
div.div_radio {
	width:96%;
	padding:10px;
	font-size:1em;
	background:#EEEEEE;
	border:1px #999999 solid;
	color:#333333;
	text-align:left;
	line-height:2.0;
}
div.div_radio_noline {
	margin-top:-1px;
}
div.div_radio_end {
	margin-bottom:20px;
}
div.div_radio_5em {
	min-height:5em;
}
div.div_kibou {
	margin-bottom:0.6em;
}
dl.dl_contact dd input[type=radio] {
	width:1.5em;
	height:1.5em;
}
dl.dl_contact dd input[type=checkbox] {
	width:1.5em;
	height:1.5em;
}
dl.dl_contact dd input#date_1st,
dl.dl_contact dd input#date_2st,
dl.dl_contact dd input#date_3st {
	width:8em;
	margin:0px 2px 0px 2px;
	padding:3px;
	font-size:1em;
	background:#FFFFFF;
	border:1px #999999 solid;
	border-radius: 0;
	-webkit-appearance: none;
}
dl.dl_contact dd select {
	font-size:1.0em;
	font-weight:normal;
}
p.center_layout {
	margin:20px 10px;
	text-align:center;
	font-size:1.4em;
}
input.form_btn {
	padding:0.5em 0;
	width:15em;
	font-size:1.28em;
	background:#A0A0A0;
	border:none;
	color:#FFFFFF;
	border-radius: 0;
	-webkit-appearance: none;
}
input.form_btn_send {
	margin-left:1em;
}
span.vm_kibou {
	vertical-align:middle;
}
dl.dl_contact dd.dd_conf {
	width:96%;
	padding:10px;
	font-size:1em;
	background:#EEEEEE;
	border:1px #999999 solid;
}
span.red_text {
	color:#FF0000;
}
p.p_send {
	margin:50px auto;
	padding:10px;
	font-size:2.0em;
	font-weight:bold;
	width:4em;
	border:#C8C8C8 1px solid;
}
p.p_send_desc {
	margin:15px 10px;
	padding:0px;
	font-size:1.4em;
}
p.p_send_err {
	margin:50px auto;
	padding:10px;
	font-size:2.0em;
	font-weight:bold;
	width:5em;
	border:#C8C8C8 1px solid;
}

/* ========== pagetop ========== */
#pagetop {
	position: fixed;
	bottom: 15px;
	right: 15px;
}

/* ========== footer ========== */
#footer {
	margin:0;
	padding: 40px 0 0 0;
}
#footer .inner {
	overflow: hidden;
	width: 1000px;
	margin: 0 auto;
}
#footer ul.sns {
	overflow: hidden;
	float: right;
	width:150px;
}
#footer ul.sns li {
	overflow: hidden;
	display: block;
	width: 38px;
	height: 38px;
	float: left;
	padding-left: 25px;
}
ul.sns .fb a span {
	display: block;
	width: 38px;
	height: 0;
	padding-top: 38px;
	background: url(../images/sns_fb.png) no-repeat 0 0;
}
ul.sns .ins a span {
	display: block;
	width: 38px;
	height: 0;
	padding-top: 38px;
	background: url(../images/sns_ins.png) no-repeat 0 0;
}
ul.footer_nav li:last-child, #footer .sns li:last-child {
	margin: 0;
}
ul.footer_nav {
	margin:0px 0px 0px 15px;
	overflow: hidden;
	float: right;
	width:185px;
	font-size:1.2em;
	border-left:#898989 1px solid;
}
ul.footer_nav li {
	padding:0px 0px 0px 15px;
	line-height:2.0;
}
ul.footer_nav li a {
	color:#898989;
}
ul.footer_company {
	margin:0px;
	padding:0px 10px;
	float:left;
	color: #a0a0a0;
	width:380px;
}
ul.footer_company li {
	font-size:1.2em;
}	
ul.footer_company li.name {
	color: #707070;
	font-size:1.8em;
}
ul.footer_company li span.tel {
	margin-left:5px;
	color: #707070;
	font-size:2.0em;
}
p#copyright {
	clear:both;
	margin: 10px auto;
	text-align:center;
}
small {
	font-size:12px;
	color: #a0a0a0;
}

@media screen and (min-width: 1200px) {
#main_image {
	margin: 0 auto;
	height:640px;
}
#sub_image {
	margin: 0 auto;
	height:350px;
}
div.map {
	padding-bottom:0;
	height:340px;
}
}

@media screen and (max-width: 880px) {
#header {
	width:100%;
}
#footer .inner {
	width:100%;
}
}

@media screen and (max-width: 768px) {
.footer_nav {
	overflow: hidden;
	float: right;
	width:50%;
}
#footer .sns {
	overflow: hidden;
	float: right;
	width:50%;
}
ul.footer_company {
	clear:both;
	float:none;
	width:100%;
	padding:0px;
	text-align:center;
}
}


 @media screen and (max-width: 640px) {
/* ========== header ========== */
#header {
	margin: 0 auto;
}
#header h1 {
	margin: 10px auto 0px auto;
}
/* nav */
nav#nav {
	margin:10px auto 0px auto;
	padding:0;
	overflow: hidden;
	width: 100%;
	height:auto;
}
nav#nav ul {
	margin: 0 auto;
	padding:0;
	width: 100%;
	height:auto;
}
nav#nav ul li {
	margin:0;
	padding:0;
	display: block;
	width: 100%;
	height:auto;
	background:#a0a0a0;
	border-bottom: 1px solid #FFFFFF;
	float: left;
}
nav#nav ul li a {
	margin:0;
	padding:10px 0px 10px 0px;
	display: block;
	width: 50%;
	height:auto;
	text-align:center;
	color:#FFFFFF;
	background:url(../images/nav_arrow_rt.png) no-repeat 98% center;
}
nav#nav ul li.nav01 a, nav#nav ul li.nav02 a,nav#nav ul li.nav03 a,nav#nav ul li.nav04 a {
	width: 100%;
}
nav#nav ul li a:hover {
	color:#FFFFFF;
}

/* ========== main ========== */
#main_image {
	height:100%;
	background: none;
}
#main_image img {
	width: 100%;
	height: auto;
}

/* ========== contents ========== */
#contents {
	width: 100%;
}
.catch {
	font-size:0.8em;
}
.catch h2 {
	margin:15px 0px;
}
.catch h2 span.kai {
	display: block;
	margin:0px;
}
.catch h2 span.sub {
	margin:0px;
}

div.div_table {
	width: 100%;
	font-size:0.9em;
	display:block;
}
div.div_table_title {
	margin:0;
	padding:15px 0px 15px 0px;	
	width: 100%;
	display:block;
	text-align:center;
	vertical-align:middle;
}
div.div_table_title h2 {
}
div.div_table_desc {
	margin:0;
	padding-top:0;
	padding-left:0;
	padding-right:0;
	width: 100%;
	display:block;
	text-align:center;
	vertical-align:middle;
	font-weight:normal;
}
div.div_table_desc h3 {
	font-weight:normal;
	font-size:2.4em;
}
div.div_table_desc ul.ul_top_campaign li {
	font-size:1.4em;
}
div.div_table_desc ul.ul_top_campaign li span.text_18 {
	font-size:1.28em;
}
div.div_table_desc p.p_desc {
	margin:0px 15px;
	font-size:1.4em;
	text-align:left;
}
div.div_table_desc p.p_desc_contact {
	font-size:1.4em;
	text-align:center;
}


/* ========== Menu Price ========== */
dl.dl_menu {
	margin:10px 0px 0px 0px;
	padding:0;
	width:100%;
}
dl.dl_menu dt {
	padding:20px 10px 0px 10px;
	font-size:1.4em;
	float:none;
}
dl.dl_menu dt span.menu_left {
	margin-right:1em;
	display:block;
}
dl.dl_menu dt span.menu_name {
	margin-right:1em;
	color:#707070;
	font-size:1.14em;
}
dl.dl_menu dd {
	padding:5px 10px 20px 0px;
	font-size:1.6em;
	text-align:right;
	border-bottom:#a0a0a0 1px dotted;
}
dl.dl_menu dd span.price_text_14 {
	margin-left:0.5em;	
	margin-right:0.5em;
	font-size:0.875em;
}
p.p_menu_desc {
	margin:20px 10px;
	font-size:1.4em;
	text-align:left;
}
p.p_menu_desc_right {
	margin:20px 10px;
	font-size:1.4em;
}

/* ========== Salon Info ========== */
dl.dl_about {
	margin:0px 5% 0px 5%;
	padding:0;
	font-size:1.4em;
	text-align:left;
}
dl.dl_about dt {
	margin:0;
	padding:5px 0px 0px 0px;
	color:#707070;
}
dl.dl_about dd {
	margin:0;
	padding:3px 0px 5px 0px;
}
img.img_about_logo {
	margin: 0 auto;
	display: block;
	max-width:360px;
	width: 90%;
	height:auto;
	/*float: left;*/
	border: 0;
}

div.div_table_nailist_out {
	margin: 30px auto 0px auto;
	padding:0px;
	width: 100%;
	display:block;
}
div.div_table_nailist_out2 {
	margin: 0px auto 0px auto;
	width: 100%;
	display:block;
}
div.div_table_nailist {
	margin:0;
	padding:15px 2% 0px 2%;	
	width: 96%;
	display: block;
}

table.table_nailist_in {
	width: 100%;
}
table.table_nailist_in td {
	margin:0;
	padding:0px;	
	width: 100%;
	text-align:left;
	display:table-cell;
}
table.table_nailist_in td.td_nailist_photo {
	width: 50%;
}
table.table_nailist_in td.td_nailist_photo img {
	display: block;
	max-width:200px;
	height:auto;
	/*float: left;*/
	border: 0;
} 
table.table_nailist_in td.td_nailist_name {
	width: 100%;
	vertical-align:middle;
}
table.table_nailist_in td.td_nailist_name h3 {
	font-weight:bold;
	margin-left:10%;
	font-size:1.4em;
}
table.table_nailist_in td.td_nailist_name h3 span.name_j {
	font-weight:normal;
	font-size:0.857em;
}
table.table_nailist_in td.td_nailist_desc {
	padding:15px 0px;
	font-size:1.4em;
}

/* ========== Contact Reservation ========== */

div.div_table_desc p.p_desc_contact_tel {
	text-align:center;
}

dl.dl_contact {
	margin:0px auto;
	width:95%;
	font-size:1.4em;
}

dl.dl_contact dt {
	margin:10px 0px;
	display:block;
	width:100%;
	padding:0px;
	float:none;
	text-align:left;
	min-height:0;
}

dl.dl_contact dd {
	padding:0px;
	display:block;
	width:100%;
	min-height:0;
	text-align:center;
}

dl.dl_contact dd .in_wide {
	width:96%;
	padding:2%;
	font-size:1em;
	background:#EEEEEE;
}
div.div_radio {
	width:96%;
	padding:2%;
	font-size:1em;
	background:#EEEEEE;
}
dl.dl_contact dd .in_date {
	width:2em;
	padding:1%;
	font-size:1em;
	background:#FFFFFF;
}
dl.dl_contact dd input[type=radio] {
	width:2.0em;
	height:2.0em;
}
dl.dl_contact dd input[type=checkbox] {
	width:2.0em;
	height:2.0em;
}
span.vm_kibou {
	display:block;
	font-size:1em;
}
input.form_btn_send {
	display:block;
	margin:15px auto 0 auto;
}
dl.dl_contact dd input#date_1st,
dl.dl_contact dd input#date_2st,
dl.dl_contact dd input#date_3st {
	width:7em;
}

/* ========== pagetop ========== */
#pagetop {
	/*display: none;*/
}

/* ========== footer ========== */
#footer {
	width: 100%;
	margin-top: 30px;
	padding: 0 0 50px 0;
}
#footer .inner {
	width: 100%;
}
#footer ul.sns {
	overflow:hidden;
	float: none;
	margin:20px auto;
}
#footer ul.sns li {
}
ul.sns li.fb a {
}
ul.sns li a, .sns li a:hover {
}
ul.sns .fb a span {
}
.ie8 .sns .fb a span/* IE8 */ {
}
ul.sns .ins a span {
}
.ie8 .sns .ins a span/* IE8 */ {
}

ul.footer_nav {
	overflow: hidden;
	width: 100%;
	float: none;
	margin:0;
	border-left:none;
	border-top: 1px solid #898989;
}
ul.footer_nav li {
	margin:0;
	padding:0;
	display: block;
	width: 100%;
	height:auto;
	font-size:1.3em;
	background:#FFFFFF;
	border-bottom: 1px solid #898989;
	float: left;
}
ul.footer_nav li a {
	margin:0;
	padding:10px 0px 10px 0px;
	display: block;
	width: 100%;
	height:auto;
	text-align:center;
	color:#898989;
	background:url(../images/footer_arrow_rt_g.png) no-repeat 98% center;
}
ul.footer_company li {
	font-size:1.1em;
}
ul.footer_company li.name {
	font-size:1.4em;
}
ul.footer_company li span.tel {
	font-size:1.8em;
}
}

@media screen and (max-width: 500px) {
/* ========== Art Sample ========== */
div.art_sample {
	margin:0px auto;
	padding:0px 10px;
	max-width:980px;
}
div.art_sample a {
	margin:1.6%;
	display: block;
	width: 46.8%;
	height:auto;
	float:left;
}
div.art_sample a img {
	display: block;
	width: 100%;
	height:auto;
}
}

@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min-device-pixel-ratio: 2) {
/* RETINA用のスタイル記述 */
}