@charset "utf-8";

nav {
 	opacity:0;
	visibility:hidden;
	}

/* http://meyerweb.com/eric/tools/css/reset/ 
v2.0 | 20110126
License: none (public domain)
*/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
margin: 0;
padding: 0;
border: 0;
font-size: 100%;
font: inherit;
vertical-align: baseline;

outline: 0;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
display: block;
}

blockquote, q {
quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
content: '';
content: none;
}

/*-----------------------------------------------------------------------------*/
/* 基本設定 */
/*-----------------------------------------------------------------------------*/
*, *::before, *::after {
	box-sizing: border-box;
	}
html, body { }

html {
	font-size: 62.5%; /*10px相当*/
	-webkit-font-smoothing: antialiased;
	overflow-y: scroll;
	}

body {
	position: relative;
	color:#000;
	text-align:center;
	font-size: 16px;
	line-height: 1.8;
	word-wrap:break-word;
	overflow-wrap:break-word;

	font-family : 'Noto Sans JP', "メイリオ", sans-serif;

	-webkit-text-size-adjust: 100%;/*　iphoneでの文字拡大禁止　*/	
	}
@media screen and (max-width: 767px) {
body {
	font-size:13.5px;
	line-height:1.6;
		}
}
@media screen and (min-width: 768px) {
body {
	min-width:1180px;
	}
}

table {
	font-size:inherit;
	border-collapse:collapse;
	border-spacing:0;
	}
	th,td {
	line-height:1.5;
	font-weight: inherit;
	text-align: left;
	}
h1,h2,h3,h4,h5,h6,em,pre {  line-height:1.5;}
img {
	vertical-align: top;
	border:none;
	max-width:100%;
	height:auto;
	}
ul, ol { list-style: none;}
strong { font-weight: bold;}
sup { vertical-align: super; font-size: 60%;}
sub { vertical-align: bottom; font-size: 60%;}
.clear { clear: both;}
.nowrap { white-space: nowrap;}

.txt_l, .txt_l p {	text-align:left !important;}
.txt_c, .txt_c p {	text-align:center !important;}
.txt_r, .txt_r p {	text-align:right !important;}

a img {
	transition:all 0.3s ease;
	}
	a:hover img {
/*	opacity:0.9;*/
	}

::-moz-selection { color:#fff; background: #96a9aa; }
::selection { color:#fff; background:#96a9aa; }

/*　レスポンシブ切り替え（brなど）　*/
@media screen and (max-width: 767px) {
.pc, .pc_br { display: none !important; }
}
@media screen and (min-width: 768px) {
.sp, .sp_br { display: none !important; }
}

/*　リンク
-----------------------------------------------------------------------------*/
a {
	color:#079292;
	outline:none;
	border:none;
	text-decoration: underline;
	-webkit-tap-highlight-color: rgb(0 0 0 / 0);
	}
@media screen and (min-width: 768px) {
	a:hover {
	color: #39A8A8;
	}
}

/*　フォント
-----------------------------------------------------------------------------*/
.font_b {
	font-weight: bold !important;
	}
.font_600 {
	font-weight: 600 !important;
	}
.font_n {
	font-weight: normal !important;
	font-style: normal !important;
	}

/*　float解除（共通）
-----------------------------------------------------------------------------*/
.cf::after {
	content: "";
	clear: both;
	display: block;
	}

/*　リストスタイル
-----------------------------------------------------------------------------*/
ul.list_dot {
	padding-left:1.7em;
	}
	ul.list_dot > li { list-style-type:disc;}
ol.list_num {
	padding-left:1.7em;
	}
	ol.list_num > li { list-style-type:decimal;}
ul.list_square {
	padding-left:1.7em;
	}
	ul.list_square > li { list-style-type: square;}
ul.list_disc {
	margin: 1em 0;
	padding-left:1.7em;
	}
	ul.list_disc > li {
	list-style-type: disc;
	margin: 0.5em 0;
	}
ul.list_maru {
	margin: 1em 0;
	}
	ul.list_maru > li {
	text-indent: -1.3em;
	padding-left: 1.3em;
	margin: 0.5em 0;
	}
	ul.list_maru > li::before {
	content: '〇';
	display: inline;
	padding-right: 0.3em;
	}
ol.list_alpha {
	padding-left:2em;
	}
	ol.list_alpha > li { list-style-type: upper-alpha;}
	
/*　telリンク
-----------------------------------------------------------------------------*/
.tel_link, .tel_link:hover {
	cursor:default;
	color:inherit;
	text-decoration:none;
	border:none !important;
	background-color:transparent !important;
	}

/*　テーブル
-----------------------------------------------------------------------------*/
table  {
	width:100%;
	}
	table tr, table th, table td  {
	}
	
table {
	}
	table th, table td {
	}
	table th {
	text-align:left;
	}
	table td {
	}
	
/*■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■*/
/*　h2
-----------------------------------------------------------------------------*/
h2 {
	font-weight: 600;
	margin-bottom:0.8em;
	letter-spacing: 0.05em;
	}
.h_2 {
	overflow: auto;
	font-size: 180%;
	font-weight: 600;
	margin: 0.5em 0 1em;
	}
	.h_2::after {
	content: '';
	display: block;
	width: 1.8em;
	height: 2px;
	background-color: #079292;
	margin: 1.0em auto 0;
	}
	#aroma .h_2::after { background-color: #5360AA;}
	#pool .h_2::after { background-color: #0288D1;}
	#radonpit .h_2::after { background-color: #c69c6d;}
	#barrel_sauna .h_2::after { background-color: #6e493d;}

.h_2_s {
	font-weight: normal;
	color: #fff !important;
	font-size: 120%;
	padding: 0.5em 1em;
	margin: 0.5em 0 1.2em;
	background-color: #079292;
	}
	#air .h_2_s {background-color: #8CBABA;}
	#pool .h_2_s {background-color: #0288D1;}
	#radonpit .h_2_s {background-color: #c69c6d;}
	#barrel_sauna .h_2_s {background-color: #6e493d;}
	
.h_2_product {
	font-size: 150%;
	margin-block: 1.5em -0.8em;
	}

@media screen and (max-width: 767px) {
.h_2 {
	font-size: 145%;
	text-align: center;
	}
.h_2_product {
	font-size: 140%;
	text-align: left;
	}
}
@media screen and (min-width: 768px) {
	.h_2::after {
	margin-left: 0;
	}
}

/*　h3
-----------------------------------------------------------------------------*/
h3 {
	font-size: 115%;
	font-weight: 600;
	margin: 0.5em 0 0.3em;
	}

/*　h4
-----------------------------------------------------------------------------*/
h4 {
	font-size:105%;
	line-height:2;
	font-weight: 600;
	margin:0.5em 0 0.3em;
	}

/* ttl
-----------------------------------------------------------------------------*/
.ttl_1 {
	text-align: center;
	position: relative;
	line-height: 1.5;
	margin-block: 1em 1.2em;
	}
	.ttl_1 span{
	display: block;
	}
	.ttl_1 .jp {
	font-weight: 600;
	letter-spacing: 0.2em;
	}
.ttl_boder::before {
	content: '';
	display: inline-block;
	width: 2px;
	height: 1.3em;
	background-color: #079292;
	margin-left: -1px;
	}
@media screen and (max-width: 767px) {
	.ttl_1 {
	font-size: 21px;
	margin-block: 0 1em;
	}
	.ttl_1 .s {
	font-size: 60%;
	}
}
@media screen and (min-width: 768px) {
	.ttl_1 {
	font-size: 185%;
	}
	.ttl_1 .s {
	font-size: 50%;
	}
}
.ttl_1+#content { padding-top: 0;}

/* ttl_2
-----------------------------------------------------------------------------*/
.ttl_2_wrap {
	position: relative;
	background-color: #fff;
	}
	.ttl_2_wrap::after {
	content: '';
	display: block;
	width: 100%;
	height: 8px;
	background: linear-gradient( to right, #005c5d, #079292 50%, #33b7ba);
	}
	#spa .ttl_2_wrap::after {
	background: linear-gradient( to right, #00658c, #1190BF 50%, #3AB6E6); }
	#air .ttl_2_wrap::after {
	background: linear-gradient( to right, #679999, #8CBABA 50%, #B0D9D9); }
	#aroma .ttl_2_wrap::after {
	background: linear-gradient( to right, #3E4880, #5360AA 50%, #868FC4); }
	#pool .ttl_2_wrap::after {
	background: linear-gradient( to right, #015380, #0288D1 50%, #43A6DE); }
	#case .ttl_2_wrap::after {
	background: linear-gradient( to right, #172F5D, #0A3E8A 50%, #2F72B8); }
	#contact .ttl_2_wrap::after {
	background: linear-gradient( to right, #333, #666 50%, #808080); }
	#radonpit .ttl_2_wrap::after,
	#barrel_sauna .ttl_2_wrap::after,
	#outdoor_sauna .ttl_2_wrap::after {
	background: linear-gradient( to right, #795548, #c69c6d 50%, #c7b299); }
	#spa_lounger .ttl_2_wrap::after {
	background: linear-gradient( to right, #42210B, #795548 50%, #C7B299); }
	
	.ttl_2 {margin-bottom: 0;}
	
@media screen and (max-width: 767px) {
.ttl_2_wrap {
	text-align: left;
	}
	.ttl_2 {
	font-size: 140%;
	padding-bottom: 0.5em;
	letter-spacing: 0.02em;
	}
}
@media screen and (min-width: 768px) {
	.ttl_2 {
	font-size: 200%;
	margin-right: -0.5em;
	padding-bottom: 0.3em;
	}
}
@media screen and (min-width: 1600px) {
	.ttl_2 {
	margin-right: -0.5em;
	font-size: 208%;
	}
}

/*　ttl_band
-----------------------------------------------------------------------------*/
.ttl_band {
	text-align: center;
	line-height:1.3;
	font-weight: 600;
	color: #fff;
	background: linear-gradient( to right, #005c5d, #079292 50%, #33b7ba);
	margin-top: -0.5em;
	margin-bottom: 0;
	letter-spacing: 0.06em;
	}
	#outdoor_sauna .ttl_band {background: linear-gradient( to right, #795548, #8c6239 50%, #c7b299);
	margin-top: 2em;/*50px*/
	}
	#spa .ttl_band {background: linear-gradient( to right, #00658c, #1190bf 50%, #3ab6e6);}
	#case .ttl_band {background: linear-gradient( to right, #172F5D, #0A3E8A 50%, #2F72B8);}
	
	.ttl_band > span {
	display: block;
	}
	.ttl_band span span {
	display: inline-block;
	margin: 0 -0.3em;
	}
@media screen and (max-width: 767px) {
	.ttl_band {
	font-size: 145%;
	padding: 0.6em 0;
	}
}
@media screen and (min-width: 768px) {
	.ttl_band {
	font-size: 170%;
	padding: 0.4em 0;
	}
}

/*　section ＆　p
-----------------------------------------------------------------------------*/
#content p {
	text-align: justify;
	-ms-text-justify: inter-ideograph;
	}
/* note
-----------------------------------------------------------------------------*/
#content .note{
	color: #222;
	font-size: 82%;
	margin-bottom: 2.5em;
	}
@media screen and (max-width: 767px) {
	#content .note{
	
	}
}
@media screen and (min-width: 768px) {
	#content .note{

	}
}

/* btn
-----------------------------------------------------------------------------*/
.area_btn {
	margin-top: 1.5em;
	}
.btn_arw {
	text-align: left;
	position: relative;
	display: inline-block;
	color: #fff;
	text-decoration: none;
	line-height: 1.5;
	padding: 0.9em 4.5em 0.9em 0.8em;
	min-width: 17em;
	}
	.btn_arw::after {
	content: '';
	display: block;
	position: absolute;
	top: 0;
	right: 0;
	width: 3.3em;
	height: 100%;
	background: url("../images/i_arw.svg") no-repeat right center rgb(0 0 0 / 0.5);
	background-size: 3.3em auto;
	transition: 0.2s ease-in-out;
	}
	.btn_arw span { position: relative; display: inline-block; z-index: 1;}
	.btn_sauna, .btn_aqua { background-color: #079292;}
	.btn_spa { background-color: #1190BF;}
	.btn_outdoor_sauna { background-color: #6e493d;}
	.btn_barrel_sauna { background-color: #6e493d;}
	.btn_spa_lounger { background-color: #A60000;}
	.btn_pool { background-color: #0288D1;}
	.btn_air { background-color: #8CBABA;}
	.btn_aroma { background-color: #5360AA;}
	.btn_case { background-color: #0A3E8A;}
	.btn_wht { background-color: #fff; color:#000; font-weight: 600;}
	.btn_wht::after { background-color: #000;}
	
@media screen and (max-width: 767px) {
	.area_btn {
	text-align: center;
	}
	.btn_arw {
	font-size: 12px;
	padding-top: 1.1em;
	padding-bottom: 1.1em;
	}
	.btn_arw::after {
	}
}
@media screen and (min-width: 768px) {
	.btn_arw {
	font-size: 14px;
	}
	.btn_arw:hover { color: #fff; }
	.btn_arw:hover::after {
	background-color: rgb(0 0 0 / 0.3);
	background-position: right -5px center;
	width: 100%;
	}
	.btn_wht:hover::after { background-color: #111;}
}

/* btn_base
-----------------------------------------------------------------------------*/
.btn_base {
	text-align: center;
	display: block;
	background-color: #404040;
	line-height: 1.5;
	color: #fff;
	text-decoration: none;
	border: none;
	
	transition: 0.2s ease-out;
	box-shadow: 1px 1px 12px rgb(0 0 0 / 0.5);
	}
	.btn_base .icon {
	position: relative;
	display: inline-block;
	padding-left: 40px;
	}
	.btn_base .icon::before {
	content: '';
	background-repeat: no-repeat;
	background-size: contain;
	display: inline-block;
	position: absolute;
	left: 0;
	top: 50%;
	transform: translateY(-50%);
	width: 40px;
	height: 40px;
	}
	.btn_base .icon_contact::before { content: url("../images/navBtn_i_contact.svg");}
	.btn_base .icon_catalog::before {content: url("../images/navBtn_i_catalog.svg");}
	.btn_base .icon_case::before {content: url("../images/navBtn_i_case.svg");}
	.btn_base .icon_download::before {content: url( "../images/navBtn_i_download.svg");}
	
	.btn_base_case { background-color: #0A3E8A;}
	
@media screen and (max-width: 767px) {
	.btn_base {
	font-size: 17px;
	padding: 20px 0.5em;
	width: 100%;
	max-width: 350px;
	margin: 60px auto 0;
	}
	.btn_base + .btn_base { margin-top: 30px;}
}
@media screen and (min-width: 768px) {
	.btn_base {
	font-size: 133%;
	padding: 2.5% 0.5em;
	width: 450px;
	margin: 80px auto 0;
	}
	.btn_base + .btn_base { margin-top: 40px;}
	
	.btn_base:hover {
	color: #fff;
	background-color: #222;
	}
	.btn_base_case:hover {background-color: #073077;}
}
@media screen and (min-width: 1600px) {
	.btn_base {
	font-size: 145%;
	}
}

/* area_link
-----------------------------------------------------------------------------*/
.area_link {
	margin-top: 1.2em;
	margin-bottom: 1.2em;
	}

/* bg_gray
-----------------------------------------------------------------------------*/
.bg_gray {
	background-color: #EAEAEA;
	}