@charset "utf-8";

/*
=======================================
  Reset CSS
=======================================
*/
html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
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,
article, aside, canvas, details, figcaption, figure, 
footer, header, main, menu, nav, section, summary,
time, mark, audio, video{
  margin:0;
  padding:0;
}

article,aside,details,figcaption,figure,
footer,header,main,menu,nav,section{
  display:block;
}

html{
  -webkit-text-size-adjust: none;
  text-size-adjust: none;
}

img{
  border: 0;
  max-width: 100%;
  height: auto;
}

ul,ol{
  list-style-type: none;
}

table {
  border-collapse: collapse; 
  border-spacing: 0;
}

img, input, select, textarea { 
  vertical-align: middle;
}

.clear {
	clear: both;
}

.clearfix::after {
	content: "";
	display: block;
	clear: both;
}

label, input, textarea, select {
	cursor: pointer;
}

/* figure内の画像下の余白を取る */
figure img {
	vertical-align: bottom;
}

/* ########## BASE LAYOUT ########## */

*{ margin:0; padding:0;}
html			{ overflow-y:scroll; scroll-behavior: smooth;}
body { 
	min-width: 998px;
	color:#000000; 
	background-color:#ffffff; 
	text-align:center; 
	font-family:"メイリオ",Meiryo,"ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","ＭＳ Ｐゴシック",Osaka,sans-serif;
}
table			{ border-collapse:collapse; border-spacing:0; empty-cells:show;}
th,td			{ text-align:left; font-weight:normal; vertical-align:top;}
ul,ol			{ list-style:none;}
em				{ font-style:normal;}
img				{ border-style:none; vertical-align:bottom;}
a:link img		{ border-style:none;}
a:visited img	{ border-style:none;}
a:hover img		{ border-style:none;}

/* FONT SIZE STYLE */
html {
	font-size: 14px;
}
body { 
	font-size:0.9rem; 
	line-height:1.5;
}
table			{ font-size:0.9rem; line-height:1.5;}
h1,h2		{ font-size:1rem; line-height:1.5;}
h3		{ font-size:1rem; line-height:1.5;}
h4 {
	margin-bottom: 0.5rem;
	font-size:0.9rem; 
	line-height:1.5;
}

/* COMMON STYLE */
.bold			{ font-weight:bold;}
.floatR			{ float:right;}
.floatL			{ float:left;}

/* LINK DECORATION */
a:link,
a:visited		{ color:#0c4d9c; text-decoration:none;}
a:hover			{ color:#0c4d9c; text-decoration:underline;}

#pan a:link,
#footer a:link,
#pan a:visited,
#footer a:visited
				{ color:#000000;}
#pan a:hover,
#footer a:hover
				{ color:#0c4d9c;}

/* MAIN LAYOUT */
#wrapper		{ width:958px; margin:0 auto; padding:0 20px; text-align:left;}
#header			{ 
	width:958px; 
	padding:14px 0 0 0;
	z-index: 1000;
	
}
#main			{ width:958px;}
#cont			{ width:723px; padding:0 0 20px 0; float:left;}
#side			{ width:215px; padding:9px 0 0 0; float:right;}
#footer			{ width:958px; padding:0 0 30px 0; clear:both;}
#foot1			{ width:958px;}
#foot2			{ width:958px;}

/* HEADER */
.logo_nav {
	margin-bottom: 12px;
	display: -webkit-box;
	display: -webkit-flex;
	display: -moz-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-pack: justify;
	-webkit-justify-content: space-between;
	   -moz-box-pack: justify;
	    -ms-flex-pack: justify;
	        justify-content: space-between;
	-webkit-box-align: end;
	-webkit-align-items: flex-end;
	   -moz-box-align: end;
	    -ms-flex-align: end;
	        align-items: flex-end;
}

#logo_area {
	display: -webkit-box;
	display: -webkit-flex;
	display: -moz-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-webkit-align-items: center;
	   -moz-box-align: center;
	    -ms-flex-align: center;
	        align-items: center;
}
#logo_area p {
	margin: 0 0 0 12px;
	font-size: 0.85rem;
	color: #000;
	font-weight: bold;
	line-height: 1.5;
}
#logo_area p span {
	padding: 0;
	font-size: 0.7rem;
	font-weight: normal;
	color: #404040;
	line-height: 1;
}

#logo			{ 
	width: 132px;
	height: auto;
}

#hnav			{ 
	display: -webkit-box; 
	display: -webkit-flex; 
	display: -moz-box; 
	display: -ms-flexbox; 
	display: flex;
	-webkit-box-align: end;
	-webkit-align-items: flex-end;
	   -moz-box-align: end;
	    -ms-flex-align: end;
	        align-items: flex-end;
}

#hnav li {
	margin:0 0 0 1rem;
	padding:0 0 0 1rem; 
	background:url("/img/icon_link.svg") -0.05rem -0.15rem no-repeat;
	-webkit-background-size: 15px auto;
	   -moz-background-size: 15px auto;
	     -o-background-size: 15px auto;
	        background-size: 15px auto;
	line-height: 1;
}

#hnav li a {
	color: #000;
	font-size: 0.75rem;
	font-weight: normal;
	line-height: 1;
}
#hnav li a:hover {
	color: #0c4d9c;
	text-decoration: none;
}


/* GLOBAL NAVI */
#global_nav			{ 
	position:relative; 
	width:958px; 
	height:51px; 
	clear:both; 
	overflow:hidden;
}

#global_nav ul		{ 
	position:absolute; 
	top:0; 
	left:0; 
	width:958px; 
	height:51px;
}

#global_nav li		{ 
	height:48px; 
	margin:1px 0 2px 1px;
	text-align: center;
	float:left;
}

#global_nav li a {
	display: block;
	height:48px; 
	text-indent: -9999px;
	text-decoration: none;
	-webkit-transition:0.7s;
	-moz-transition:0.7s;
	-o-transition:0.7s;
	transition: 0.7s;
}

#global_nav ul li:nth-child(1) a {
	width: 122px;
	background-image: url(/img/gnav01_off.png);
	background-size: cover;
}
#global_nav ul li:nth-child(2) a {
	width: 125px;
	background-image: url(/img/gnav02_off.png);
	background-size: cover;
}
#global_nav ul li:nth-child(3) a {
	width: 112px;
	background-image: url(/img/gnav03_off.png);
	background-size: cover;
}
#global_nav ul li:nth-child(4) a {
	width: 112px;
	background-image: url(/img/gnav04_off.png);
	background-size: cover;
}
#global_nav ul li:nth-child(5) a {
	width: 115px;
	background-image: url(/img/gnav05_off.png);
	background-size: cover;
}
#global_nav ul li:nth-child(6) a {
	width: 128px;
	background-image: url(/img/gnav06_off.png);
	background-size: cover;
}
#global_nav ul li:nth-child(7) a {
	width: 121px;
	background-image: url(/img/gnav07_off.png);
	background-size: cover;
}
#global_nav ul li:nth-child(8) a {
	width: 113px;
	background-image: url(/img/gnav08_off.png);
	background-size: cover;
}

#global_nav ul li:nth-child(1) a:hover,
#global_nav ul li:nth-child(1) a:active {
	background-image: url(/img/gnav01_on.png);
}
#global_nav ul li:nth-child(2) a:hover,
#global_nav ul li:nth-child(2) a:active {
	background-image: url(/img/gnav02_on.png);
}
#global_nav ul li:nth-child(3) a:hover,
#global_nav ul li:nth-child(3) a:active {
	background-image: url(/img/gnav03_on.png);
}
#global_nav ul li:nth-child(4) a:hover,
#global_nav ul li:nth-child(4) a:active {
	background-image: url(/img/gnav04_on.png);
}
#global_nav ul li:nth-child(5) a:hover,
#global_nav ul li:nth-child(5) a:active {
	background-image: url(/img/gnav05_on.png);
}
#global_nav ul li:nth-child(6) a:hover,
#global_nav ul li:nth-child(6) a:active {
	background-image: url(/img/gnav06_on.png);
}
#global_nav ul li:nth-child(7) a:hover,
#global_nav ul li:nth-child(7) a:active {
	background-image: url(/img/gnav07_on.png);
}
#global_nav ul li:nth-child(8) a:hover,
#global_nav ul li:nth-child(8) a:active {
	background-image: url(/img/gnav08_on.png);
}

body.tylo-index #global_nav ul li:nth-child(1) a {
	background-image: url(/img/gnav01_on.png);
}
body.steam-sauna #global_nav ul li:nth-child(2) a {
	background-image: url(/img/gnav02_on.png);
}
body.dry-sauna #global_nav ul li:nth-child(3) a {
	background-image: url(/img/gnav03_on.png);
}
body.soft-sauna #global_nav ul li:nth-child(4) a {
	background-image: url(/img/gnav04_on.png);
}
body.firewood-sauna #global_nav ul li:nth-child(5) a {
	background-image: url(/img/gnav05_on.png);
}
body.servicing-index #global_nav ul li:nth-child(6) a {
	background-image: url(/img/gnav06_on.png);
}
body.record-index #global_nav ul li:nth-child(7) a {
	background-image: url(/img/gnav07_on.png);
}
body.contact-index #global_nav ul li:nth-child(8) a {
	background-image: url(/img/gnav08_on.png);
}






#menubtn {
	display: none;
}


#gnav			{ position:relative; width:958px; height:51px; clear:both; overflow:hidden;}
#gnav ul		{ position:absolute; top:0; left:0; width:958px; height:51px;}
#gnav li		{ height:48px; padding:1px 0 2px 1px; float:left;}

/* PANKUZU */
#pan			{ padding:8px 0 10px 0; font-size:90%;}
#pan li			{ padding:0 5px 0  0; float:left;}
#pan img		{ width:13px; height:13px; margin:0 5px 0 0; vertical-align:middle;}
#pan #padHome	{ padding:0 0 0 5px;}

/* PAGE TOP VISUAL */
#chead			{ padding:0 0 18px 0;}

.top_visual {
	margin:0 0 18px 0;	
	width: 958px;
	height: 160px;
	position: relative;
}

.top_visual #chead_new { 
	position: absolute;
	line-height: 1;
	top: 47px;
	left: 44px;
	font-size: 1.35rem;
	letter-spacing: 0.1rem;
}

#chead_new .chead_new_headline {
	display: block;
	margin-bottom: 9px;
	font-size: 0.8rem;
	letter-spacing: 0.05rem;
	line-height: 1;
}

#chead_new .chead_new_subtitle {
	display: block;
	margin-top: 5px;
	line-height: 1;
	font-size: 0.7rem;
	font-family: 'Be Vietnam', sans-serif;
	color: #9d9d9d;
	font-weight: 100;
}

/* PAGETOP */

.ptopBox { 
	margin:0 0 20px 0; 
	text-align: right;
	clear:both;
}

.ptopBox a { 
	padding:0 0 0 1rem; 
	background:url("/img/icon_link_arrow_up.svg") -0.2rem 0 no-repeat;
	-webkit-background-size: 15px auto;
	   -moz-background-size: 15px auto;
	     -o-background-size: 15px auto;
	        background-size: 15px auto;
	line-height: 1;
	font-size: 0.8rem;
	font-weight: bold;
	color: #000;
}

.ptopBox a:hover {
	text-decoration: none;
	color: #666;
}

/*
.ptopBox		{ margin:0 0 20px 0; clear:both;}
.pagetop		{ float:right;}
*/


/* SIDE MENU */
#sidemenu-steam-sauna,
#sidemenu-dry-sauna,
#sidemenu-soft-sauna,
#sidemenu-firewood-sauna,
#sidemenu-data-download,
#sidemenu-company
				{ display:none; margin:0 0 23px 0;}
#sidemenu		{}
#sidemenu li	{ padding:0 0 3px 0;}
#sidemenu a		{ 
	display:block; 
	width:190px; 
	padding:8px 6px 8px 21px; 
	font-size: 0.85rem;
	color:#000000; 
	background-color: #d3d6d7;
	background-image:url("/img/icon_link.svg");
	background-position: 0.45rem 0.6rem;
	background-repeat: no-repeat;
	-webkit-background-size: 1rem auto;
	   -moz-background-size: 1rem auto;
	     -o-background-size: 1rem auto;
	        background-size: 1rem auto;
	-webkit-transition:0.7s;
	-moz-transition:0.7s;
	-o-transition:0.7s;
	transition: 0.7s;
}

#sidemenu a:hover { 
	color:#fff; 
	background-color:#000;
	text-decoration: none;
	background-image:url("/img/icon_link_white.svg");

}


/*
#sidemenu a:hover { 
	color:#ffffff; 
	background:#000000 url("/img/sidemenu_icon_in.gif") 11px 50% no-repeat;
}
*/



/* SIDE BANNER */

#sidebana1 {
	width: 215px;
}

#sidebana1 li	{ 
	padding:0 0 13px 0;
	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	        box-sizing: border-box;
}

#sidebana1 a img {
	width: 215px;
	height: auto;
	border: solid 1px #fff !important;    	/* 内側の線になる一本線の枠線をひく*/
	outline: solid 1px #dadada;    /* 外側の線になる一本線の枠線をひく*/
	outline-offset: 0;        /* 外側の線と内側の線の空き具合を調整*/
	-webkit-transition:0.3s;
	-moz-transition:0.3s;
	-o-transition:0.3s;
	transition: 0.3s;

}

#sidebana1 a img:hover {
	outline: solid 1px #828282;    /* 外側の線になる一本線の枠線をひく*/
}





/* FOOTER */
#foot1			{ padding:0 0 20px 0; text-align:center; border-bottom:solid 1px #c4c4c4;}
#foot1 li		{ 
	display:inline-block; 
	line-height: 1;
	padding:0 10px; 
	font-size: 0.8rem; 
	border-right: 1px solid #bebebe;
}
#foot1 #fnav09	{ 
	border-right: none;
}

@media screen and (min-width:641px) {
	#foot1 #fnav05	{ 
		border-right: none;
	}
}


#foot2 { 
	padding:10px 0 0 0; 
	border-top:solid 1px #f6f6f6;
	overflow: hidden;
	display: -webkit-box;
	display: -webkit-flex;
	display: -moz-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: end;
	-webkit-align-items: flex-end;
	   -moz-box-align: end;
	    -ms-flex-align: end;
	        align-items: flex-end;
	
}

#foot21 a {
	display: -webkit-box;
	display: -webkit-flex;
	display: -moz-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: end;
	-webkit-align-items: flex-end;
	   -moz-box-align: end;
	    -ms-flex-align: end;
	        align-items: flex-end;
	
}
#foot21 a img {
	width: 72px;
	height: auto;
	padding-right: 10px;
}
#foot21 a p {
	font-size: 0.8rem;
	font-weight: bold;
	line-height: 1;
}
#foot21 a:hover {
	text-decoration: none;
	color: inherit;
}
.foot22	{ 
	padding:1px 0 0 15px; 
	font-size:0.8rem; 
	line-height: 1;
	vertical-align: middle;
}

.foot22 a:hover {
	text-decoration: none;
	color: inherit;
}


#foot23	{ 
	justify-self: right;
	margin-left: auto;
	font-family: 'Be Vietnam', sans-serif;
	font-size: 0.7rem;
	color: #666;
	letter-spacing: 0.05rem;
}

/*
#foot21			{ 
	float:left;
	padding: 0 10px 0 3px;
}
#foot21 img {
	width: 260px;
	height: auto;
}

#foot22	{ 
	padding:1px 0 0 15px; 
	font-size:0.8rem; 
	line-height:24px; 
	background:url("/img/foot_icon_link.gif") 5px 50% no-repeat; 
	float:left;
}
#foot23	{ 
	float:right;
	font-family: 'Be Vietnam', sans-serif;
	font-size: 0.7rem;
	color: #666;
	letter-spacing: 0.05rem;
}
*/




/* CONT FOOTER */

#cfootInfo		{ 
	padding:25px 0 0 0; 
	border-top:solid 1px #e3e3e3;
	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	        box-sizing: border-box;
	display: -webkit-box;
	display: -webkit-flex;
	display: -moz-box;
	display: -ms-flexbox;
	display: flex;
}
#cfootInfo div {
	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	        box-sizing: border-box;
}
#cfootInfo .cfootInfo_message {
	width:  245px;
	margin-right: 25px;
}
#cfootInfo .cfootInfo_message h4 {
	margin-bottom: 0.2rem;
	font-size: 0.9rem;
	font-weight: bold;
	color: #0c4d9c;
}
#cfootInfo .cfootInfo_photo {
	width:  100px;
	margin-right: 25px;
	text-align: center;
}
#cfootInfo .cfootInfo_photo img {
	width:  55px;
}
#cfootInfo .cfootInfo_contact h4 {
	font-size: 0.8rem;
}
#cfootInfo .cfootInfo_contact p {
	font-size: 0.8rem;
	line-height: 1.8;
}
#cfootInfo .cfootInfo_contact p a {
	padding:0 0 0 1rem; 
	background-image:url("/img/icon_link_circle_arrow.svg");
	background-position: 0 0.1rem;
	background-repeat: no-repeat;
	-webkit-background-size: 0.9rem 0.9rem;
	   -moz-background-size: 0.9rem 0.9rem;
	     -o-background-size: 0.9rem 0.9rem;
	        background-size: 0.9rem 0.9rem;
	color: #000;
}
#cfootInfo .cfootInfo_contact p a:hover {
	color: #0c4d9c;
}

#cfootInfo .cfootInfo_contact p.cfootInfo_contact_tel {
	margin: 0.6rem 0;
	font-size: 1.8rem;
	font-weight: bold;
	font-family: 'Source Sans Pro', sans-serif;
	line-height: 1;
}

/*
#cfootInfo		{ padding:25px 0 0 0; border-top:solid 1px #e3e3e3;}
#cfootInfo div	{ float:left;}
#cfootInfo p	{ width:245px; padding:0 15px 0 0;}
*/


/* CLEARFIX */
.clearfix:after,
.section:after,
.section_short:after,
.ptopBox:after,
#hnav:after,
#gnav ul:after,
#main:after,
#pan:after,
#cont:after,
#cfootInfo:after,
#foot2:after		{ content:''; display:block; clear:both;}

.clearfix,
.section,
.section_short,
.ptopBox,
#hnav,
#gnav ul,
#main,
#pan,
#cont,
#cfootInfo,
#foot2			{ zoom:1;}



/* PRINTING */
@media print{

}

/* ########## STYLE ########## */


.section						{ margin:0 0 40px 0; clear:both;}
.section_short						{ margin:0 0 15px 0; clear:both;}
.division						{ padding:0 0 40px 0;}
.dotline						{ padding:20px 0 0 0; background:url("/img/dot1.gif") 0 0 repeat-x;}

/* .dotline table					{ border : #999999 1px solid;}*/
.dotline table td.toi			{ width : 170px;
								  padding : 5px;
								  vertical-align : middle;
								}
.dotline table th,td			{ padding : 3px;}
.dotline table th				{ text-align : center;}
.dotline table td.cat			{ text-align : center;
								  font-weight : bold;
								}
.dotline .pdf					{ padding : 0 5px 0 0;}

/* TEXT */
.texth							{ margin:0 0 0.5em 0;}
.text							{ margin:0 0 1em 0;}
.text2							{ margin:0 0 2em 0;}
.youtube_include				{ padding:20px 0 20px 0; text-align: center;}

/* H */
.section h2.title				{ margin:0 0 15px 0;}
.section h3.title { 
	margin:0 0 15px 0; 
	padding:0 0 0 8px; 
	line-height:1.1; 
	font-weight:bold; 
	border-left:solid 3px #b2b2b2;
}

.section_short h2.title				{ margin:0 0 15px 0;}
.section_short h3.title				{ margin:0 0 15px 0; padding:0 0 0 8px; line-height:1.1; font-weight:bold; border-left:solid 3px #b2b2b2;}

/* BOX */

.dotBox	{
	padding: 20px;
	border: 1px dotted #d3d3d3;
	background: #f7f7f7;
}
.dotBox .section_short {
	margin-bottom: 2rem;
}
.dotBox h3 { 
	margin:0 0 0.8rem 0;
	padding-left: 0.5rem; 
	line-height:1.1; 
	font-weight:bold; 
	border-left:solid 3px #b2b2b2; 
	font-size: 0.9rem;
}
.dotBox p {
	margin-bottom: 0.5rem;
}

.dotBox_white							{ padding:1px 1px 2px 1px; background:url("/img/dot2.gif") 0 0 repeat;}
.dotBox_white .dotBox_white					{ background-color:#ffffff; background-image:none;}
.dotBox_white dl						{ padding:20px 10px 0 28px;}
.dotBox_white dt						{ padding:0 0 0 8px; line-height:1.1; font-weight:bold; border-left:solid 3px #b2b2b2; font-size: 105%;}
.dotBox_white dd						{ padding:10px 0 20px 0;}
.dotBox_white dd ul					{ margin:5px 0 0 0;}

/* TEXT LINK */
ul.link li { 
	padding:0 0 5px 1rem; 
	background:url("/img/icon_link.svg") -0.2rem 0 no-repeat;
	-webkit-background-size: 15px auto;
	   -moz-background-size: 15px auto;
	     -o-background-size: 15px auto;
	        background-size: 15px auto;
}


/*
ul.link li { 
	padding:0 0 1rem 0; 
	vertical-align: middle;
	line-height: 1;
}
ul.link li:before {
    font-family: "Material Icons";
    content:'\E315';
	margin-right: 2px;
	vertical-align: middle;
	font-weight: normal !important;
	line-height: 1;
}
*/



ul.link li .win					{ margin:0 0 0 4px; vertical-align:baseline;}

ul.link_long li						{ padding:0 0 13px 10px; background:url("/img/icon_link.gif") 1px 0.3em no-repeat;}
ul.link_long li .win					{ margin:0 0 0 4px; vertical-align:baseline;}

/* PDF LINK */
li.pdf img.pdf					{ width:16px; height:16px; margin:0 5px 0 0; vertical-align:-3px;}
ul.clearfix li.pdf				{ padding:0 15px 4px 0; float:left;}


/* HOME
 --------------------------------------------------------------------*/
#homeVisual {
	width: 958px;
	height: 465px;
    overflow: hidden;
    position: relative;
    margin: 10px 0;
    padding:0;
}

#homeVisual .main_img {
    z-index:10;
    opacity: 0;
    width: 100%;
    height: 465px;
    background-position: center center;
    background-repeat: no-repeat;
    -webkit-background-size: cover;
       -moz-background-size: cover;
         -o-background-size: cover;
            background-size: cover;
    position: absolute;
    left: 0;
    top: 0;
    -webkit-animation: anime 30s 0s infinite;
    -moz-animation: anime 30s 0s infinite;
      -o-animation: anime 30s 0s infinite;
         animation: anime 30s 0s infinite; 

 }

#homeVisual .main_img:nth-of-type(2) {
  -webkit-animation-delay: 6s;
  -moz-animation-delay: 6s;
    -o-animation-delay: 6s;
       animation-delay: 6s; }

#homeVisual .main_img:nth-of-type(3) {
  -webkit-animation-delay: 12s;
  -moz-animation-delay: 12s;
    -o-animation-delay: 12s;
       animation-delay: 12s; }

#homeVisual .main_img:nth-of-type(4) {
  -webkit-animation-delay: 18s;
  -moz-animation-delay: 18s;
    -o-animation-delay: 18s;
       animation-delay: 18s; }

#homeVisual .main_img:nth-of-type(5) {
  -webkit-animation-delay: 24s;
  -moz-animation-delay: 24s;
    -o-animation-delay: 24s;
       animation-delay: 24s; }

#homeVisual .main_img img {
  width: 958px;
  height: 465px;
}

@-webkit-keyframes anime {
  0% {
        opacity: 0;
    }
    8% {
        opacity: 1;
    }
    17% {
        opacity: 1;
    }
    25% {
        opacity: 0;
        -webkit-transform: scale(1.2) ;
                transform: scale(1.2) ;
         z-index:9;
    }
    100% { opacity: 0 }
}

@-moz-keyframes anime {
  0% {
        opacity: 0;
    }
    8% {
        opacity: 1;
    }
    17% {
        opacity: 1;
    }
    25% {
        opacity: 0;
        -moz-transform: scale(1.2) ;
             transform: scale(1.2) ;
         z-index:9;
    }
    100% { opacity: 0 }
}

@-o-keyframes anime {
  0% {
        opacity: 0;
    }
    8% {
        opacity: 1;
    }
    17% {
        opacity: 1;
    }
    25% {
        opacity: 0;
        -o-transform: scale(1.2) ;
           transform: scale(1.2) ;
         z-index:9;
    }
    100% { opacity: 0 }
}

@keyframes anime {
  0% {
        opacity: 0;
    }
    8% {
        opacity: 1;
    }
    17% {
        opacity: 1;
    }
    25% {
        opacity: 0;
        -webkit-transform: scale(1.2) ;
           -moz-transform: scale(1.2) ;
             -o-transform: scale(1.2) ;
                transform: scale(1.2) ;
         z-index:9;
    }
    100% { opacity: 0 }
}


#homeCont { 
	width:705px; 
	margin: 0;
	padding:0 0 30px 0; 
	float:left;
	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	        box-sizing: border-box;
}
#homeCont .section { 
	width:705px; 
	overflow:hidden;
}
#homeCont .clearfix { 
	width:705px; 
	margin:0 0 0 1px;
	padding: 0;
}
#homeCont .clearfix > li { 
	width:223px; 
	padding:15px 0 0 16px; 
	float:left;
}
#homeCont .clearfix > li:first-child { 
	padding-left: 0;
}
#homeCont .clearfix > li h2 { 
	margin: 15px 0 12px;
	font-size: 0.9rem;
	line-height: 1;
}
#homeCont .clearfix > li img {
	width: 100%;
	height: auto;
}


#homeSide-box { 
	width:238px; 
	padding:0 0 9px 0;
	float:right;
}
#homeSide { 
	width:238px; 
	background:#f4f4f4;
	margin-bottom: 15px;
}

#homeTylo { 
	width:238px; 
	padding:12px 10px 5px 10px; 
	background: #f4f4f4;
	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	        box-sizing: border-box;
}
#homeTylo h2 {
	margin-bottom: 10px;
}

#homeTylo h2 img {
	width: 125px;
	height: 36px;
	padding-left: 3px;
}

#homeTylo h3 { 
	margin: 15px 0 12px;
	font-size: 0.9rem;
	line-height: 1;
}

#homeTylo > img {
	width: 218px;
}
#homeSide-banner { 
	width: 238px; 
	margin-bottom: 20px;
	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	        box-sizing: border-box;
}

#homeSide-banner a img {
	width: 238px;
	height: auto;
	border: solid 1px #fff !important;    	/* 内側の線になる一本線の枠線をひく*/
	outline: solid 1px #dadada;    /* 外側の線になる一本線の枠線をひく*/
	outline-offset: 0;        /* 外側の線と内側の線の空き具合を調整*/
	-webkit-transition:0.3s;
	-moz-transition:0.3s;
	-o-transition:0.3s;
	transition: 0.3s;
}

#homeSide-banner a img:hover {
	outline: solid 1px #828282;    /* 外側の線になる一本線の枠線をひく*/
}

#homeSide-banner a + a  {
	display: block;
	margin-top: 1rem;
}

/* お知らせ欄 */
body.home .news-area-title {
	margin-top: 2.5rem !important;
}

body.home .news-area {
	margin: 0 0 40px 0;
}
body.home .news-area dl {
	display: flex;
	box-sizing: border-box;
	flex-flow: wrap;
	width: 100%;
}
body.home .news-area dt {
	box-sizing: border-box;
	width: 20%;
	padding: 1rem 0;
	border-bottom: 1px dotted #ccc;
	font-weight: bold;
}
body.home .news-area dd {
	box-sizing: border-box;
	width: 80%;
	padding: 1rem 0;
	border-bottom: 1px dotted #ccc;
}
body.home .news-area dd a {
	color: #000;
}
body.home .news-area dd a:hover {
	color: #0c4d9c;
}

body.home .news-area dd a.border {
	text-decoration: underline !important;
	color: #0c4d9c;
}


/* HOME 製品ラインナップ */

body.home .home-sauna-lineup {
	width: 705px; /* コンテナの幅を指定 */
	margin: 20px 0 40px;
	display: flex;
	justify-content: space-between; /* アイテム間のスペースを均等に */
    gap: 12px; /* アイテム間の余白を設定 */
    box-sizing: border-box; /* paddingやborderを含めるために設定 */
}

body.home .home-sauna-lineup a {
    text-decoration: none; /* 下線を消す */
    color: inherit; /* 元の色を引き継ぐ */
    display: block; /* ブロック要素にして全体を覆う */
}

body.home .home-sauna-lineup .sauna-lineup-item {
	width: 227px; /* アイテムの幅を指定 */
    position: relative; /* 相対位置を設定 */
    background-color: #fff; /* アイテムの背景色 */
    text-align: center; /* 中央揃え */
    border: 5px solid #f2f2f2; /* 内枠の赤い線 */
    box-shadow: 0 0 0 1px #cdcdcd; /* 外枠の青い線 */
    transition: box-shadow 0.4s ease; /* 外枠の色変化にトランジションを追加 */
    cursor: pointer; /* カーソルをポインターに変更 */
    box-sizing: border-box; /* ボックスのサイズにボーダーとパディングを含める */
}

body.home .home-sauna-lineup .sauna-lineup-item:hover {
	 box-shadow: 0 0 0 1px #000; /* ホバー時に外枠を黒色に */
}

body.home .home-sauna-lineup .sauna-lineup-item .item-container-box {
    display: flex;
    flex-direction: column; /* 縦並びに設定 */
    width: 100%;
}

body.home .home-sauna-lineup .sauna-lineup-item .item-container-box h2 {
	margin: 15px 0 40px;
	color: #000;
	text-decoration: none;
}

body.home .home-sauna-lineup .sauna-lineup-item .item-container-box h2::after {
	content: "";
	width: 40px;
	height: 2px;
	display: block;
	position: relative;
	left: 50%;
	top: 18px;
	transform: translateX(-50%);
	background: #000;
}

body.home .home-sauna-lineup .sauna-lineup-item .item-container-box h2 span {
	display: block;
	line-height: 1;
	font-size: 0.7rem;
	font-family: 'Be Vietnam', sans-serif;
	color: #9d9d9d;
	font-weight: 100;
	text-decoration: none;
}

body.home .home-sauna-lineup .sauna-lineup-item .item-container-box .item-image img {
	width: 100%;
}

body.home .home-sauna-lineup .sauna-lineup-item .item-container-box .item-text {
	margin: 0 16px 27px;
}

body.home .home-sauna-lineup .sauna-lineup-item .item-container-box .item-text p:first-child {
	margin-bottom: 25px;
	text-align: left;
	color: #000;
	text-decoration: none;
}

body.home .home-sauna-lineup .sauna-lineup-item .item-container-box .item-text p.item-link {
    background-color: #000; /* リンクの背景色を黒 */
    color: #fff; /* 文字とアイコンの色を白 */
    padding: 5px 15px 5px 10px; /* 内部余白 */
    text-decoration: none; /* 下線を消す */
    display: inline-flex; /* テキストに応じて幅を可変に */
    align-items: center; /* アイコンとテキストを縦方向に中央揃え */
}

body.home .home-sauna-lineup .sauna-lineup-item .item-container-box .item-text p.item-link::before {
    content: ""; /* 擬似要素を有効にするために必要 */
    background-image: url('/img/icon_link_white.svg'); /* 矢印画像を背景に設定 */
    background-size: contain; /* 画像をボックス内に収める */
    background-repeat: no-repeat; /* 画像の繰り返しを無くす */
    width: 20px; /* アイコンの横幅 */
    height: 20px; /* アイコンの高さ */
    margin-right: 1px; /* アイコンとテキストの間隔 */
}


@media screen and (max-width:640px) {

	#homeCont {
		margin-top: 30px;
	}
	
	body.home .news-area dl {
		flex-flow: column nowrap;
	}
	body.home .news-area dt {
		width: 100%;
		border-bottom: none;
		padding: 1rem 0 0.5rem;
	}
	body.home .news-area dd {
		width: 100%;
		padding: 0 0 1rem;
	}


	/* HOME 製品ラインナップ */
	body.home .home-sauna-lineup {
		display: flex;
		flex-direction: column; /* アイテムを縦に並べる */
		align-items: center; /* アイテムを左右中央に揃える */
		width: 100%; /* コンテナの幅を指定 */
	    gap: 40px; /* アイテム間の余白を設定 */
	}

	body.home .home-sauna-lineup .sauna-lineup-item {
	    width: 100%; /* アイテムの幅 */
	}

	body.home .home-sauna-lineup .sauna-lineup-item .item-container-box h2 {
		font-size: 1.05rem;
	}

	body.home .home-sauna-lineup .sauna-lineup-item .item-container-box h2 span {
		display: inline-block;
		margin-left: 10px;
		font-size: 0.85rem;
	}


}

/* STEAM and DRY
 --------------------------------------------------------------------*/
#productsTop					{}
#productsTop > p {
	width: 255px;
}
#productsTop img {
	width: 255px;
	height: auto;
	padding-top: 10px;
}


#productsTop div				{ width:445px; padding:10px 0 0 0; float:right;}

#productsVid {
	margin: 50px 0 50px;
	padding: 0;
	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	        box-sizing: border-box;
}

#productsVid iframe {
	width: 723px;
	height: 407px;
}

#productsVidDry {}
#productsVidDry.section			{padding : 0 121px 0 122px;}

#productsInfo					{ width:723px; overflow:hidden;}
#productsInfo div.clearfix		{ width:738px; margin:0 0 0 -15px;}
#productsInfo dl				{ width:231px; padding:0 0 0 15px; float:left;}
#productsInfo dl dt img {
	width: 231px;
	height: auto;
}
#productsInfo dd				{ padding:5px 0 0 0;}

#recommendBox					{ width:723px; background:url("/steam-sauna/img/bg_line1.gif") 0 0 repeat-y; overflow:hidden;}
#recommendBox .clearfix			{ width:741px; margin:0 0 0 -18px;}
#recommendBox li.li0			{ width:229px; padding:0 0 0 18px; float:left;}
#recommendBox li.li0 p			{ 
	width:220px;
}
#recommendBox li.li0 p.image			{ 
	text-align: center;
}
#recommendBox li.li0 .link li	{ font-size:0.9rem;}
#recommendBox1					{ padding:0 0 4px 0; background:url("/steam-sauna/img/bg_line2.gif") 18px 100% no-repeat;}
#recommendBox2					{ padding:4px 0 0 0;}

#recommendBox h3 {
	margin-bottom: 1rem;
	font-size: 0.9rem;
}
#recommendBox h3 span {
	display: inline-block;
	margin-bottom: 0.5rem;
	color: #0c4d9c;
	font-weight: normal;
}

#recommendBox h3 span.recommendBox1_point {
	font-family: 'Montserrat', sans-serif;
}
#recommendBox h3 span.recommendBox1_number {
	padding-left: 0.5rem;
	font-size: 1.7rem;
	font-family: 'Oxygen', sans-serif;
	
}

/* スチームサウナの特徴 */
body.steam-sauna-feature #recommendBox1 li:nth-child(1) p.image img {
	padding: 15px 0 15px;
	width: 150px;
}
body.steam-sauna-feature #recommendBox1 li:nth-child(2) p.image img {
	padding: 25px 0 15px;
	width: 160px;
}
body.steam-sauna-feature #recommendBox1 li:nth-child(3) p.image img {
	padding: 0 0 15px;
	width: 200px;
}
body.steam-sauna-feature #recommendBox2 li:nth-child(1) p.image img {
	padding: 5px 0 15px;
	width: 200px;
}
body.steam-sauna-feature #recommendBox2 li:nth-child(2) p.image img {
	padding: 15px 0 15px;
	width: 220px;
}
body.steam-sauna-feature #recommendBox2 li:nth-child(3) p.image img {
	padding: 25px 0 15px;
	width: 170px;
}

/* ドライサウナの特徴 */
body.dry-sauna-feature #recommendBox1 li:nth-child(1) p.image img {
	padding: 25px 0 0;
	width: 230px;
}
body.dry-sauna-feature #recommendBox1 li:nth-child(2) p.image img {
	padding: 15px 0 20px;
	width: 190px;
}
body.dry-sauna-feature #recommendBox1 li:nth-child(3) p.image img {
	padding: 5px 0 25px;
	width: 190px;
}
body.dry-sauna-feature #recommendBox2 li:nth-child(1) p.image img {
	padding: 15px 0 25px;
	width: 240px;
}
body.dry-sauna-feature #recommendBox2 li:nth-child(2) p.image img {
	padding: 5px 0 25px;
	width: 220px;
}
body.dry-sauna-feature #recommendBox2 li:nth-child(3) p.image img {
	padding: 15px 0 15px;
	width: 170px;
}

/* 薪サウナの特徴 */
body.firewood-sauna-feature #recommendBox1 li:nth-child(1) p.image img {
	padding: 20px 0 0;
	width: 230px;
}
body.firewood-sauna-feature #recommendBox1 li:nth-child(2) p.image img {
	padding: 10px 0 20px;
	width: 190px;
}
body.firewood-sauna-feature #recommendBox1 li:nth-child(3) p.image img {
	padding: 20px 0 25px;
	width: 190px;
}
body.firewood-sauna-feature #recommendBox2 li:nth-child(1) p.image img {
	padding: 10px 0 25px;
	width: 240px;
}
body.firewood-sauna-feature #recommendBox2 li:nth-child(2) p.image img {
	padding: 5px 0 25px;
	width: 220px;
}
body.firewood-sauna-feature #recommendBox2 li:nth-child(3) p.image img {
	padding: 15px 0 15px;
	width: 170px;
}

#compareTb { 
	margin:10px 0 0 0; 
	border-top:solid 1px #cccccc; 
	border-right:solid 1px #cccccc; 
	border-bottom:solid 1px #cccccc;
}
#compareTb thead th	 { 
	width: 42%;
	border-bottom:dotted 1px #dadada; 
	border-left:dotted 1px #d2d2d2;
}
#compareTb thead td				{ border-bottom:dotted 1px #dadada; border-left:solid 1px #cccccc;}
#compareTb tbody th				{ border-bottom:dotted 1px #dadada; border-left:solid 1px #cccccc;}
#compareTb tbody td				{ border-bottom:dotted 1px #dadada; border-left:dotted 1px #dadada;}
#compareTb thead th				{ padding:10px 0 8px 0; font-weight:bold; text-align:center; background-color:#f1f1f1;}
#compareTb thead td				{ background-color:#f1f1f1;}
#compareTb tbody th				{ padding:10px 8px; font-weight:bold; text-align:center; background-color:#f9f9f9; vertical-align:middle; white-space:nowrap;}
#compareTb tbody td				{ padding:10px 10px 10px 18px;}


.bathBox						{ 
	margin:0 0 20px 0; 
	padding:15px 25px;
	-webkit-border-radius: 3px;
	   -moz-border-radius: 3px;
	        border-radius: 3px;
	border: solid 2px #f1f1f1 !important;    	/* 内側の線になる一本線の枠線をひく*/
	outline: solid 1px #d7d7d7;    /* 外側の線になる一本線の枠線をひく*/
	outline-offset: 0;        /* 外側の線と内側の線の空き具合を調整*/
}

.bathBox .bathBox_left { width:480px; padding:0; float:left;}
.bathBox .bathBox_left h3 { 
	margin-bottom: 0.5rem;
}
.bathBox .bathBox_left p { margin:0 0 0.5rem 0;}
.bathBox .bathBox_right { 
	margin:5px 15px 0 0;
	width: 170px;
	float: right;
}
.bathBox .bathBox_right img {
	width: 170px;
	height: auto;
}


li.productsList:after			{ content:''; display:block; clear:both;}
li.productsList { 
	padding:7px 0 50px 0;
	clear:both;
	zoom:1;
}
.productsList .product { 
	width:385px; 
	float:right;
}
.productsList .product h3 {
	margin-bottom: 1rem;
	font-size: 1.2rem;
}
.productsList .product h4 { 
	margin-bottom: 0.5rem;
	font-size: 0.9rem;
}
.productsList .product p { 
	margin-bottom: 0.5rem;
}

/*
.productsList .product #right   { text-align : right; margin-top : -20px;}
.productsList .product .cau     { font-weight : bold; font-size : 105%;}
.productsList .product .intro   { font-size : 110%; font-weight : bold;}
*/

.productsList .product table { 
	margin-top: 15px;
	width:385px; 
	border-top:solid 1px #cccccc;
}
.productsList .product thead th,
.productsList .product thead td	{ font-weight:bold;}
.productsList .product th.gen	{ width : 104px; height : 18px;}
.productsList .product th,
.productsList .product td		{ padding:4px 0 2px 12px; border-bottom:solid 1px #cccccc;}
.productsList .image { 
	width:302px; 
	float:left;
}

.productsList .image p img {
	width: 302px;
	border: 1px solid #cacaca;
}
img.no-border {
	border: none !important;
}
.productsList .image li	 { 
	padding:12px 6px 0 0; 
	float:left;
}
.productsList .image li img	{ 
	width: 52px;
	border: 1px solid #cccccc;
	cursor:pointer
}


.productsList ul.catalog {
	margin: 12px 0 0 7px;
}
.productsList ul.catalog li {
	margin-bottom: 0.4rem;
	font-size: 1rem;
	font-weight: bold;
}
.productsList ul.catalog li:last-child {
	margin-bottom: 0;
}

.productsList .full-column {
	width: 100%;
	margin-top: 30px;
}
.productsList .full-column h4 {

}
.productsList .full-column table { 
	width: 100%;
	border-top:solid 1px #cccccc;
}
.productsList .full-column thead th,
.productsList .full-column thead td	{ font-weight:bold;}
.productsList .full-column thead tr { background-color: rgb(244, 244, 244);}
.productsList .full-column th.gen	{ width : 104px; height : 18px;}
.productsList .full-column th,
.productsList .full-column td		{ padding:4px 0 2px 12px; border-bottom:solid 1px #cccccc;}


/* POLICY
 --------------------------------------------------------------------*/

body.policy-index dl.section { 
	padding:10px 10px 0 0;
}
body.policy-index dl.section dt	{ 
	padding:30px 0 4px 0; 
	font-weight:bold;
}

body.policy-index .attention_list {
	margin-top: 1rem;
}

body.policy-index .attention_list li::before {
	content: "・";
}

body.policy-index .attention_list li {
	margin-bottom: 0.3rem;
	padding-left:1em;
	text-indent:-1em;
}

/* SITEMAP
 --------------------------------------------------------------------*/
ul.sitemap01					{ padding:30px 0;}
ul.sitemap01 .clearfix			{ background:url("/img/sitemap_link10.gif") 0 5px no-repeat;}
ul.sitemap01 .clearfix div		{ width:145px; padding:0 0 0 24px; float:left;}
ul.sitemap01 .clearfix div a	{ padding:0 5px 0 0; background-color:#ffffff;}

ul.sitemap02					{ background:url("/img/sitemap_dot1.gif") 0 0 repeat-y; float:left;}
ul.sitemap02 .clearfix			{ background:url("/img/sitemap_link20.gif") 0 5px no-repeat;}
ul.sitemap02 .clearfix div		{ padding:0 0 0 95px; float:left;}

li.first						{ padding:0 0 20px 95px; background:url("/img/sitemap_link00.gif") 0 0 no-repeat;}
li.midd							{ padding:0 0 20px 95px; background:url("/img/sitemap_link21.gif") 0 5px no-repeat;}
li.last							{ padding:0 0 20px 95px; background:url("/img/sitemap_link22.gif") 0 5px no-repeat;}

ul.sitemap03					{ width:300px; background:url("/img/sitemap_dot1.gif") 0 0 repeat-y; float:left;}

ul.sitemap01 a					{ font-weight:bold;}
ul.sitemap01 a:link,
ul.sitemap01 a:visited			{ color:#000000; text-decoration:none;}
ul.sitemap01 a:hover			{ color:#0c4d9c; text-decoration:underline;}


/* top notice
-----------------------------------------------------------------------*/
#box	{ width : 370px;
		padding : 5px;
	  	background-color : #ffffff;
		font-size : 11pt;
		  font-weight : bold;
		  position : relative;
		  left : 530px; 
		  top : -415px;
}


/* ########## 追加 ########## */

/* ### 共通項目 ### */


/* マージン */
.mt0{ margin-top: 0 !important;}
.mt5{ margin-top: 5px !important;}
.mt10{ margin-top: 10px !important;}
.mt15{ margin-top: 15px !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;}
.mt45{ margin-top: 45px !important;}
.mt50{ margin-top: 50px !important;}

.mb0{ margin-bottom: 0 !important;}
.mb5{ margin-bottom: 5px !important;}
.mb10{ margin-bottom: 10px !important;}
.mb15{ margin-bottom: 15px !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;}
.mb45{ margin-bottom: 45px !important;}
.mb50{ margin-bottom: 50px !important;}

.mr0{ margin-right: 0 !important;}
.mr5{ margin-right: 5px !important;}
.mr10{ margin-right: 10px !important;}
.mr15{ margin-right: 15px !important;}
.mr20{ margin-right: 20px !important;}
.mr25{ margin-right: 25px !important;}
.mr30{ margin-right: 30px !important;}
.mr35{ margin-right: 35px !important;}
.mr40{ margin-right: 40px !important;}
.mr45{ margin-right: 45px !important;}
.mr50{ margin-right: 50px !important;}

.ml0{ margin-left: 0 !important;}
.ml5{ margin-left: 5px !important;}
.ml10{ margin-left: 10px !important;}
.ml15{ margin-left: 15px !important;}
.ml20{ margin-left: 20px !important;}
.ml25{ margin-left: 25px !important;}
.ml30{ margin-left: 30px !important;}
.ml35{ margin-left: 35px !important;}
.ml40{ margin-left: 40px !important;}
.ml45{ margin-left: 45px !important;}
.ml50{ margin-left: 50px !important;}

/* 画像に枠線を入れる*/
img.double_line {
	border: solid 1px #fff !important;    	/* 内側の線になる一本線の枠線をひく*/
	outline: solid 1px #d4d4d6;    /* 外側の線になる一本線の枠線をひく*/
	outline-offset: 0;        /* 外側の線と内側の線の空き具合を調整*/
}

/* HOME 見出しh1 */
h1.new_style {
	margin-top: 10px;
	padding-bottom: 8px;
	border-bottom: 1px solid #c4c4c4;
	font-size: 1.05rem;
	letter-spacing: 0.05rem;
	line-height: 1;
}

h1.new_style span {
	padding-left: 1rem;
	font-size: 0.85rem;
	letter-spacing: 0.05rem;
}

/* 全ページ共通：見出しh2 */
h2.title_new {
	margin: 10px 0 15px;
	padding-bottom: 8px;
	border-bottom: 1px solid #c4c4c4;
	font-size: 1.05rem;
	letter-spacing: 0.05rem;
	line-height: 1;
}

h2.title_new span {
	padding-left: 1rem;
	font-size: 0.85rem;
	letter-spacing: 0.05rem;
}

/* 全ページ共通：リンクに矢印アイコンを付ける */
.link_arrow { 
	padding:0 0 5px 1rem; 
	background:url("/img/icon_link.svg") -0.2rem 0 no-repeat;
	-webkit-background-size: 15px auto;
	   -moz-background-size: 15px auto;
	     -o-background-size: 15px auto;
	        background-size: 15px auto;
}

.link_blank::after {
  padding-left: 0.5rem;
  display: inline-block;
  content: url("/img/icon_win.gif");
  vertical-align: middle;
}

/* 全ページ共通：PDFリンクにPDFアイコンを付ける */
a[href$=".pdf"] {
  padding-left: 22px;
  display: inline-block;
  background-image: url("/img/icon_pdf.svg");
  background-repeat: no-repeat;
  background-position: 0 0;
  background-size: 16px;
  vertical-align: middle;
}

/* 全ページ共通：文章中にPDFリンクを付ける */
.inline-link {
	display: inline-block;
	padding-left: 35px !important;
}


/* 全ページ共通：ZIPリンクにZIPアイコンを付ける */
a[href$=".zip"] {
  padding-left: 22px;
  display: inline-block;
  background-image: url("/img/icon_zip.svg");
  background-repeat: no-repeat;
  background-position: 0 0;
  background-size: 16px;
  vertical-align: middle;
}

a.no-icon {
  padding-left: 0;
  display: inline;
  background-image: none;
  background-repeat: none;
  background-position: none;
  background-size: none;
  vertical-align: baseline !important;
}

.icon-zip {
  padding-left: 22px;
  display: inline-block;
  background-image: url("/img/icon_zip.svg");
  background-repeat: no-repeat;
  background-position: 0 0;
  background-size: 16px;
  vertical-align: middle;
}

/* 全ページ共通：動画リンクに動画アイコンを付ける */
a.link-video {
  padding-left: 22px;
  display: inline-block;
  background-image: url("/img/icon_video.png");
  background-repeat: no-repeat;
  background-position: 0 0;
  background-size: 16px;
  vertical-align: middle;
}

.attention {
	color: #e90000;
}

.attention-box {
	border: 3px solid #d84d4d;
	margin: 2rem 0 4rem;
	padding: 30px;
}

@media screen and (min-width:641px) {
	.attention-box {
		text-align: center;
	}
}

.attention-box h4{
	font-size: 1rem;
	color: #e90000;
}

.attention-box p {
	color: #e90000;
}

/* インデント */
p.indent {
	padding-left:1em;
	text-indent:-1em;
}

/*
.link_arrow		{ 
	padding:0 0 0 12px; 
	line-height: 1;
	vertical-align: middle;
}

.link_arrow::before {
    font-family: "Material Icons";
    content:'\E315';
	margin-right: 2px;
	vertical-align: middle;
	font-weight: normal !important;
}
.link_arrow:hover::before {
    color: #000;
}
*/


/* PDFリンクのリスト形式の際に余白をとる */
ul.pdf_list {
	margin-bottom: 1.5rem;
	display: -webkit-box;
	display: -webkit-flex;
	display: -moz-box;
	display: -ms-flexbox;
	display: flex;
}

ul.pdf_list li:not(last-child) {
	margin-right: 1.5rem;
}

/* ### 全ページ共通：タイトル画像 ### */

body.tylo-index .top_visual {
	background-image: url("/tylo/img/index_h1_visual.jpg");
	background-size: 958px;
}

body.steam-sauna .top_visual {
	background-image: url("/steam-sauna/img/index_h1_visual.jpg");
	background-size: 958px;
}

body.dry-sauna .top_visual {
	background-image: url("/dry-sauna/img/index_h1_visual.jpg");
	background-size: 958px;
}

body.soft-sauna .top_visual {
	background-image: url("/soft-sauna/img/index_h1_visual.webp");
	background-size: 958px;
}

body.firewood-sauna .top_visual {
	background-image: url("/firewood-sauna/img/index_h1_visual.jpg");
	background-size: 958px;
}

body.servicing-index .top_visual {
	background-image: url("/servicing/img/index_h1_visual.jpg");
	background-size: 958px;
}

body.record-index .top_visual {
	background-image: url("/record/img/index_h1_visual.jpg");
	background-size: 958px;
}

body.faq-index .top_visual {
	background-image: url("/faq/img/index_h1_visual.jpg");
	background-size: 958px;
}

body.contact-index .top_visual {
	background-image: url("/contact/img/index_h1_visual.jpg");
	background-size: 958px;
}

body.company-index .top_visual {
	background-image: url("/company/img/index_h1_visual.jpg");
	background-size: 958px;
}

body.company-recruit .top_visual {
	background-image: url("/company/img/index_h1_visual.jpg");
	background-size: 958px;
}

body.company-dealers .top_visual {
	background-image: url("/company/img/dealers_h1_visual.jpg");
	background-size: 958px;
}

body.data-download .top_visual {
	background-image: url("/data-download/img/index_h1_visual.jpg");
	background-size: 958px;
}

body.policy-index .top_visual {
	background-image: url("/img/policy_h1_visual.jpg");
	background-size: 958px;
}

body.sitemap-index .top_visual {
	background-image: url("/img/sitemap_h1_visual.jpg");
	background-size: 958px;
}



/* ### 全ページ共通：立米表記 ### */

.dry-sauna .productsList sup,
.steam-sauna .productsList sup {
	font-size: 0.6rem;
}

/* ### 全ページ共通：カタログPDFダウンロード ### */

#cagalog_banner {
	margin-bottom: 40px;	
}

#cagalog_banner a {
	display: block;
	width: 100%;
	background-image: none;
	padding: 0;
}

#cagalog_banner a img {
	width: 100%;
	height: auto;
	border: none;
} 

/* ### 全ページ共通：改行しない ### */
.nowrap {white-space: nowrap;}


/* ### 全ページ共通：商品ページ 画像切り替えをゆっくり ### */
.image-gallery .main-image {
    transition: opacity 0.3s ease; /* フェードエフェクト */
}


/* ### 全ページ共通：PC・スマホの表示・非表示 ### */
@media screen and (min-width:641px) {
	.pc-hide {
		display: none !important;
	}
}
@media screen and (max-width:640px) {
	.sp-hide {
		display: none !important;
	}
}


/* ### 全ページ共通：画像購入予定表示 ### */
.need-to-purchase {
	position: relative; /* 親要素を相対位置に */
}

.need-to-purchase::after {
    content: "有料画像につき購入が必要"; /* 表示するテキスト */
    font-size: 0.8rem;
    position: absolute; /* 絶対位置に設定 */
    top: 50%; /* 縦中央 */
    left: 50%; /* 横中央 */
    transform: translate(-50%, -50%); /* 真ん中に配置 */
    color: white; /* テキストの色 */
    background-color: rgba(186, 0, 0, 0.7); /* 背景を透過させる */
    padding: 5px; /* テキストの周りに余白 */
    border-radius: 0; /* 角を丸くする */
    text-align: center; /* テキストを中央揃え */
    pointer-events: none; /* テキストの上でクリックを無効にする */
}

/* ### 全ページ共通：PDF施工説明書の更新日マーク ### */
.update-mark {
    display: inline-block;
    background-color: #f2f2f2; /* 背景色 */
    color: #000;            /* 文字色 */
    padding: 0.2rem 0.3rem;     /* 内側の余白 */
    border-radius: 2px;       /* 角を丸くする */
    font-size: 0.7rem !important;         /* フォントサイズ */
    text-align: center;        /* 中央揃え */
    white-space: nowrap;
    margin-top: 3px;          /* 左側の余白 */
    
}