/*
Theme Name: Katura Online Mobile
Theme URI: n/a
Description: Katura Online Mobile WordPress Theme
Author: katuraonline
Author URI: http://katuraonline.jp/
Version: 1.0
*/



/* 旧設定移行 */
/*===============================================================================================================
02. トップページ
=============================================================================================================== */

/* ヘッダー
-------------------------------------------------------------- */

header#top-page { padding:0; position: relative; width: 100%;}
div#intro-bar { height:20px;
	background: #dd0000;
	background: -webkit-gradient(linear, 50% 0%, 50% 100%, from(#7d0d0d), to(#f00));
	background: -moz-linear-gradient(50% 0%, #7d0d0d, #f00);
}
div#intro-bar ul#credit-cards { height:15px; margin-top:2.5px; display:block; float:right; }
ul#credit-cards li { float:left; width:auto; height:15px; display:block; margin-right:2px; }
ul#credit-cards li img { height:100%; margin-bottom:2.5px; }


div#header-main { height:auto; padding:4px 0 4px 10px; overflow:hidden; margin-bottom: 2px;}

div#header-main hgroup { height:auto; width:100%; float:left; position:relative; }
div#header-main hgroup h1 { font-size:18px;}
div#header-main hgroup h1 a{ color:#333;}
div#header-main hgroup h2 { font-size:10px; color:red; margin:0px 0 2px 0;}
/*追加*/
#header-main h2 a{
	color:#333;
}
#header-main h2{
font-size:12px;
font-weight:normal;
white-space:nowrap;
text-align:center;
}
/******/


nav#header-actions { margin: 0; float:right; width:150px; position: absolute; right: 3px;}

nav#header-actions ul li{
	float: left;  height:45px; width:45px; z-index:1; position:relative; text-align: center; margin-left: 3px;

	border-radius: 7px;
	-moz-border-radius: 10px;
	-webkit-border-radius: 7px;

	background: #ef533b;
	background: -moz-linear-gradient(50% 0%, #ef533b, #d93d25 48%, #dc503b 93%, #d13820);
	background: -webkit-gradient(linear, 50% 0%, 50% 100%, from(#ef533b), color-stop(48%,#d93d25), color-stop(93%,#dc503b), to(#d13820));
}
nav#header-actions ul li a{
	
}
nav#header-actions ul li img {width:70%; margin: 5% 0 0;}
nav#header-actions ul li p.action-button-text{ display: box; width: 100%; font-size: 9px; text-align: center; line-height: 1; letter-spacing: -0.1em; color: white; position: absolute; bottom: 5px;}
nav#header-actions ul li .gloss, .call-action .gloss {

	background: rgba(255, 255, 255, 0.3);
	background: -webkit-gradient(linear, 100% 0%, 0% 20%, from(rgba(255, 255, 255, 0.0)), to(rgba(255, 255, 255, 0.3)));
	background: -moz-linear-gradient(50% 0%, rgba(255, 255, 255, 0.0), rgba(255, 255, 255, 0.3));

	height: 20px; width: 45px;

	border-top-right-radius: 7px;
	border-top-left-radius: 7px;
	border-bottom-right-radius: 20px 10px;
	border-bottom-left-radius: 20px 10px;

	-webkit-border-top-right-radius: 7px;
	-webkit-border-top-left-radius: 7px;
	-webkit-border-bottom-right-radius: 20px 10px;
	-webkit-border-bottom-left-radius: 20px 10px;

	-moz-border-top-right-radius: 7px;
	-moz-border-top-left-radius: 7px;
	-moz-border-bottom-right-radius: 20px 10px;
	-moz-border-bottom-left-radius: 20px 10px;
	
	z-index: 2;
	position: absolute;

	box-shadow: inset 0px 2px 1px rgba(255, 255, 255, 0.6);
	-webkit-box-shadow: inset 0px 2px 1px rgba(255, 255, 255, 0.6);
	-moz-box-shadow: inset 0px 2px 1px rgba(255, 255, 255, 0.6);
}
#header-banner{
	width: 100%;
}

/* 開閉
-------------------------------------------------------------- */

/* アコーディオン */
.list6 dl.acordion{
 margin: 0 10px 0 10px;
 }
 .list6 dt.trigger {
 background: #ffeebb;
 background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#FFFAE9), to(#FFDAA0));
 background: -moz-linear-gradient(#FFFAE9, #FFDAA0);
 
 border-radius: 10px;
 -webkit-border-radius: 10px;
 -moz-border-radius: 10px;

 text-align: left;
 border: 1px solid #ccc;
 color: #000;
 margin-bottom: 0;
 padding: 10px;
 }
 .list6 dt.active{
  border-radius: 10px 10px 0 0;
  -webkit-border-radius: 10px 10px 0 0;
  -moz-border-radius: 10px 10px 0 0;
 }
 .list6 dt.trigger span.open-close {
 /*background: url(https://www.katuraonline.jp/spn/wp-content/themes/katuraonline_spn/images/spn-images/point_plus.png) no-repeat right top;*/
 background: url(../images/spn-images/point_plus.png) no-repeat right top;
 float: right;
 width: 20px;
 height: 20px;
 text-indent: -9999em;
 }
 .list6 dt.active span.open-close {
 /*background: url(https://www.katuraonline.jp/spn/wp-content/themes/katuraonline_spn/images/spn-images/point_none.png) no-repeat right top;*/
 background: url(../images/spn-images/point_none.png) no-repeat right top;
 float: right;
 width: 20px;
 height: 20px;
 }   
 .list6 dd.acordion_tree{
 padding: 10px;
 background: #f4f4f4;
 background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#fff), to(#f0f0f0));
 background: -moz-linear-gradient(#fff, #f0f0f0);
 border: 1px solid #ccc;
 border-top: none;
 }

/* ボタン
-------------------------------------------------------------- */
button.css3button {
	font-size: 28px;
	line-height: 1;
	color: #ffffff;
	padding: 15px 0;
	width:100%;
	height: auto;	
	margin: 8px 0;
	background:	#5AFF19;	
	background: -moz-linear-gradient(
		top,
		#5AFF19 0%,
		#DD711E);
	background: -webkit-gradient(
		linear, left top, left bottom, 
		from(#5AFF19),
		to(#008000));
	border-radius: 8px;
	-moz-border-radius: 8px;
	-webkit-border-radius: 8px;
	border: 0px solid #ffffff;
	-moz-box-shadow:
		0px 0px 5px rgba(000,000,000,0.5),
		inset 0px 0px 1px rgba(110,078,031,1);
	-webkit-box-shadow:
		0px 0px 5px rgba(000,000,000,0.5),
		inset 0px 0px 1px rgba(110,078,031,1);
	text-shadow:
		0px -1px 0px rgba(000,000,000,0.2),
		0px 1px 0px rgba(255,255,255,0.3);
}

.triangle {
	width: 0;
	height: 0;
	float: left;
	margin: 4px 0px 0px 10px;
	border-top: 6px solid transparent;
	border-bottom: 6px solid transparent; 
	border-left: 10px solid #FFFFFF;
}

/* フッターナビ
-------------------------------------------------------------- */
nav#footer-nav ul li { width:50%; height: auto; float:left; display:block; position:relative;
	margin: 0;
	padding: 0;
	text-align: center;
	}
nav#footer-nav h3,
nav#footer-nav ul li h3{
	padding:7px 0;
	font-size:15px;
	margin: 2px 0;
	}
nav#footer-nav ul li a{
	display:block;
	
	border-radius:2px; 
	-webkit-border-radius:2px; 
	-moz-border-radius:2px;  
	
	border: none;
	
	background: #f5f5f5;	
	background: -webkit-gradient(linear, center top, center bottom, from(white), color-stop(90%,#f3f2f2), color-stop(98%,#e2dedc), to(#9F9692)); 
	background: -moz-linear-gradient(50% 0%, white, #eFe6e2);	
	}
nav#footer-nav ul li a img { width:100%; margin:0; }


/* コンテンツ
-------------------------------------------------------------- */

section#main { width:100%; overflow: hidden; position: relative;}
section#main img { max-width:100%; height: auto;}
section#main h1.category-title, section#main h1.entry-title, section#main h1.post-title {
	font-size: 16px;
	padding: 5px 10px;
	margin: 5px 0;
	
	box-shadow: 0 1px 2px rgba(0,0,0,.3);
	-webkit-box-shadow: 0 1px 2px rgba(0,0,0,.3);
	-moz-box-shadow: 0 1px 2px rgba(0,0,0,.3);

	background: #f8f9fa;
	background: -webkit-gradient(linear, 50% 0%, 50% 100%, from(#f8f9fa), color-stop(15%,#f8f9fa), color-stop(80%,#dde3e6), color-stop(98%,#dde3e6), to(#fff)); 
	background: -moz-linear-gradient(50% 0%, #f8f9fa, #dde3e6);
}

section#top nav#main-nav ul li { width:33.3%;
	float:left; display:block; position:relative; margin-bottom:10px; }
section#top nav#main-nav ul li p.caption { position:absolute; bottom:-10px; text-align:center; width:98%; font-size:10px; }
section#top nav#main-nav ul li a { display:block; margin:10px; -webkit-border-radius:10px; border:3px solid #FF6633;
	background: -webkit-gradient(linear, center top, center bottom, from(white), color-stop(90%,#f3f2f2), color-stop(98%,#e2dedc), to(#9F9692)); }
section#main p{
	margin: 0;
}
/* entry-box
-------------------------------------------------------------- */
body.page section#main div.entry_box_01 {
	width: 100%;
	margin: 0px 0px 10px;
	overflow: hidden;
}
body.page section#main div.entry_box_01 div p.images img{
	margin: 0px; clear: none; float: left;
}
body.page v#main div.entry_box_01 div{
	width: 50%; float: right; position: relative;
	overflow: hidden;
}
body.page section#main div.entry_box_01 h3 ,
body.page section#main div.entry_box_01 h3 a{
	/*padding: 5px 0; font-size: 14px; font-weight: bold;*/
	font-size: 20px;
}
body.page section#main div.entry_box_01 div h3 a {
	color: rgb(0, 0, 0);
}
body.page section#main div.entry_box_01 div p {
	margin: 0px 0px 5px;
}
body.page section#main div.entry_box_01 div ul {
	margin: 0px 0px 5px;
}
body.page section#main div.entry_box_01 div ul li {
	margin: 0px 0px 0px 15px;
	list-style-type: disc;
}

section#main div.entry_box_01 p.images img{

}

/* 商品紹介ナビ
-------------------------------------------------------------- */
ul.product_nav {
	margin: 0px 0px 15px;
}
ul.product_nav li {
	margin: 0px; padding: 0px; width: 50%; float: left; list-style-type: none;
}
.common, nav#product ul li, #footer-nav h3 {
	
	box-shadow: 0 1px 2px rgba(0,0,0,.3);
	-webkit-box-shadow: 0 1px 2px rgba(0,0,0,.3);
	-moz-box-shadow: 0 1px 2px rgba(0,0,0,.3);

	border-radius: 5px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;

	background: #f8f9fa;
	background: -webkit-gradient(linear, 50% 0%, 50% 100%, from(#f8f9fa), color-stop(15%,#f8f9fa), color-stop(80%,#dde3e6), color-stop(98%,#dde3e6), to(#fff)); 
	background: -moz-linear-gradient(50% 0%, #f8f9fa, #dde3e6);
    border-left: none; /*solid 5px #e99b30;*/
    border-bottom: solid 3px #d7d7d7;	
	
}
/* 商品ボックス
-------------------------------------------------------------- */

div.product_box {
	margin: 0px 0px 5px;
}
div.product_box h2{
	border-top: none;
	border-bottom: 1px solid #dddddd;
	font-size: 16px;
	font-weight: bold;
	padding: 5px 0;
}
div.product_box div.box_left {
	width: 100%;
}
div.product_box div.box_left p {
	margin: 0px 0px 5px;
}
div.product_box div.box_left img {
	max-width: 100%;
}
div.product_box div.box_left select {
	margin: 0px 0px 0px 10px;
}
div.product_box div.box_right {
	width: 100%;
	margin: 0;
	padding: 0;
}
div.product_box div.box_right p {
	margin: 0px;
}
@media only screen and (max-width: 768px) {
	div.product_box div.box_left {
		/*display: none;*/
	}
	div.product_box div.box_right{
		max-width: 100%;
	}
}

/*----------------------------------------
	footer actions
----------------------------------------*/
nav#footer-actions {width:100%;  margin: 0; text-align: center;}
nav#footer-actions ul{
	max-width: 320px;
	margin: 0 auto;
}
nav#footer-actions ul li{
	float: left; width:30%; height:auto; z-index:1; position:relative; text-align: center; margin:1.6%;

	border-radius: 7px;
	-moz-border-radius: 10px;
	-webkit-border-radius: 7px;

	background: #ef533b;
	background: -moz-linear-gradient(50% 0%, #ef533b, #d93d25 48%, #dc503b 93%, #d13820);
	background: -webkit-gradient(linear, 50% 0%, 50% 100%, from(#ef533b), color-stop(48%,#d93d25), color-stop(93%,#dc503b), to(#d13820));
}
nav#footer-actions ul li img {width:70%; margin: 5% 0 25%;}
nav#footer-actions ul li p.action-button-text{ display: box; width: 100%; font-size: 14px; font-weight: bold; text-align: center; 
line-height: 1;  color: white; position: absolute; bottom: 10px;}
#footer-actions ul li .gloss, .call-action .gloss {

	background: rgba(255, 255, 255, 0.3);
	background: -webkit-gradient(linear, 100% 0%, 0% 20%, from(rgba(255, 255, 255, 0.0)), to(rgba(255, 255, 255, 0.3)));
	background: -moz-linear-gradient(50% 0%, rgba(255, 255, 255, 0.0), rgba(255, 255, 255, 0.3));

	height: 50%; width: 100%;

	border-top-right-radius: 7px;
	border-top-left-radius: 7px;
	border-bottom-right-radius: 20px 10px;
	border-bottom-left-radius: 20px 10px;

	-webkit-border-top-right-radius: 7px;
	-webkit-border-top-left-radius: 7px;
	-webkit-border-bottom-right-radius: 20px 10px;
	-webkit-border-bottom-left-radius: 20px 10px;

	-moz-border-top-right-radius: 7px;
	-moz-border-top-left-radius: 7px;
	-moz-border-bottom-right-radius: 20px 10px;
	-moz-border-bottom-left-radius: 20px 10px;
	
	z-index: 2;
	position: absolute;

	box-shadow: inset 0px 2px 1px rgba(255, 255, 255, 0.6);
	-webkit-box-shadow: inset 0px 2px 1px rgba(255, 255, 255, 0.6);
	-moz-box-shadow: inset 0px 2px 1px rgba(255, 255, 255, 0.6);
}

/*----------------------------------------
	footer
----------------------------------------*/
footer {
  width: 100%;
  float: left;
  margin: 0;
  padding: 10px 0;
  text-align: center;
}
footer div.second_bg {
  background-color: #F7F7F7;
  text-align: center;
  /*margin: 10px 0;
  padding: 10px 0;*/
}
footer div.second_bg p{
  line-height: 1.4;
}
footer div.second_bg p a{
  color: #20c;
  margin:  0 5px;
}
footer div.second_bg p a:link {
    color: #20c;
    text-decoration: none;
	line-height: 2em;
}
footer p.copyright {
  font-size: 12px;
}
footer span.right {
  float: right;
  margin-right: 15px;
}
footer span.right a {
  padding-left: 4px;
  padding-right: 4px;
}
footer img{
  max-width: 100%;
}


/*	ヘッダーナビ(トップ)
----------------------------------------*/

body.home nav#main-nav ul li { width:30%; height: auto; float:left; display:block; position:relative; margin: 0 0 0 2.5%; text-align: center;}
body.home nav#main-nav ul li p.caption { position:relative; text-align:center; width:100%; font-size:10px; }
body.home nav#main-nav ul li a { display:block; margin: 2px;
	border-radius:10px; 
	-webkit-border-radius:10px; 
	-moz-border-radius:10px;  
	
	border:2px solid #FF6633;
	
	background: #f5f5f5;	
	background: -webkit-gradient(linear, center top, center bottom, from(white), color-stop(90%,#f3f2f2), color-stop(98%,#e2dedc), to(#9F9692)); 
	background: -moz-linear-gradient(50% 0%, white, #eFe6e2);	
	}
body.home nav#main-nav ul li a img { width:100%; margin:0; }

/*	ヘッダーナビ(トップページ以外)
----------------------------------------*/
nav#main-nav ul li { width:15%; height: auto; float:left; display:block; position:relative; margin: 0 0 0 1.3%; text-align: center;}
nav#main-nav ul li p.caption { position:relative; text-align:center; width:100%; font-size:10px; }
nav#main-nav ul li a { display:block; margin: 2px;
	border-radius:10px; 
	-webkit-border-radius:10px; 
	-moz-border-radius:10px;  
	
	border:2px solid #FF6633;
	
	background: #f5f5f5;	
	background: -webkit-gradient(linear, center top, center bottom, from(white), color-stop(90%,#f3f2f2), color-stop(98%,#e2dedc), to(#9F9692)); 
	background: -moz-linear-gradient(50% 0%, white, #eFe6e2);	
	}
nav#main-nav ul li a img { width:100%; margin:0; }



/*	ヘッダーナビ(ログインなど)（トップページ）
----------------------------------------*/
body.home nav#info{
width:52%; 
position: relative;
margin: 0px 0 0;
}
body.home nav#info ul { height:18px; width:100%; margin:0 0 0 0; position: relative;}
body.home nav#info ul li { width:30%; height:18px; line-height:18px; text-indent: 0;
	margin:0 1% 0 0; 
	float:left;
	text-align: center; 
	border: 1px solid #dddddd;

	border-radius: 9px;
	-webkit-border-radius: 9px;
	-moz-border-radius: 9px;
	
	background: #f8f9fa;
	background: -webkit-gradient(linear, 50% 0%, 50% 100%, from(#f8f9fa), color-stop(15%,#f8f9fa), color-stop(80%,#dde3e6), color-stop(98%,#dde3e6), to(#fff));
	background: -moz-linear-gradient(50% 0%, #f8f9fa, #fff);	
}
body.home nav#info ul li a { color:#333; font-size:10px; font-weight:normal; text-decoration:none; padding:0 0 0 0px;
	display:block; width:100%; height:100%; 

}
/*	ヘッダーナビ(ログインなど)（トップページ以外）
----------------------------------------*/
nav#info{
	margin: 15px 0 0;
}
nav#info ul {height:18px; width:90%; margin:2px 0 2px 10%;}
nav#info ul li { width:32%; height:18px; line-height:18px;
	margin:0 1% 0 0; padding: 2px 0; float:left; text-align: center; text-indent: 0;
	
	border-radius: 5px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px; 
	
	background: #f8f9fa;
	background: -webkit-gradient(linear, 50% 0%, 50% 100%, from(#f8f9fa), color-stop(15%,#f8f9fa), color-stop(80%,#dde3e6), color-stop(98%,#dde3e6), to(#fff));
	background: -moz-linear-gradient(50% 0%, #f8f9fa, #fff);
	}
nav#info ul li a {color:#333; font-size:10px; font-weight:bold; text-decoration:none;
	display:block; width:100%; height:100%; }


/***********************************/
/* カスタマイズに記載されていたCSS */
/**********************************
body.home nav#main-nav ul li { 
width:48%; 
margin: 0.3rem 1% 0.3rem 1%;
}
body.home nav#main-nav ul li p.caption {
font-size:17px;
margin-top:-30px;
}

.single #main h1, .page #main h1 {
margin-left: 10px;
}
.single #main h2, .page #main h2 {
font-size: 16px;
background: url(https://test.katuraonline.jp/spn/wp-content/themes/katuraonline_spn/images/title/page_title_02.gif) no-repeat left top rgb(237, 237, 237);
padding: 5px 5px 5px 20px;
margin: 20px 0;
border: currentColor;
font-weight: bold;
}
.single #main h3, .page #main h3 {
border: none;
background: none;
font-size: 1rem;
font-weight: bold;
padding: 0 0 0 4px;
border-left: 6px solid #ffaa49;
color: #000000;
box-shadow: none;
-webkit-box-shadow: none;
-moz-box-shadow: none;
border-radius: 0px;
-webkit-border-radius: 0px;
-moz-border-radius: 0px;
background: none;
}
.single #main h3:after, .page #main h3:after{
content: "";
border-bottom: solid 1px #ababab;
display: block;
border-top: #fff solid 3px;
padding: 0px;
margin-left: -10px;
}
.single #main h4, .page #main h4 {
background: none;
border-bottom: solid 1px #ababab;
font-size: 16px;
font-weight: bold;
margin-bottom: 10px;
padding: 0 10px;
}

body.page section#main div.entry_box_01 h3 {
padding: 0 0 0 4px;
font-size: 1rem;
}

ul#fix-menu {
z-index: 1;
}
*/
/*スマホ*/
body.page nav#main-nav ul li, body.single nav#main-nav ul li, body.archive nav#main-nav ul li{
	width: 31%;
	margin: 3px 1% 4px 1.3%;
}
body.home nav#main-nav ul li {
	/*トップページ*/
    width: 48%;
    margin: .3rem 1%;
}
body.page nav#main-nav ul li p.caption, body.single nav#main-nav ul li p.caption, body.archive nav#main-nav ul li p.caption{
	margin-top: -22px;
	font-size: 14px;
}
body.page nav#main-nav ul li p.caption br, body.single nav#main-nav ul li p.caption br, body.archive nav#main-nav ul li p.caption br{
	display:none;
}

/*お客様の声
.testimonials h2{ color:#003c64; font-size:18px; }
*/
/*ヘッダー*/
div#intro-bar{
	background: #eb0000;
}
#intro-bar h2{
	text-align: center;
	float: none;
	margin: 0;
}
img.logo{
 width: 100%;
 height: auto;
 border-top: 1px solid #fff;
}
div#header-main{
 position: relative;
 /*height: 22.3vw;*/
 height: 23vw;
}
div#header-main hgroup{
 height: auto;
 width: 100%;
 position: relative;
}
div#header-main hgroup h1 ,div#header-main hgroup p.kasouTitle{
 font-size: 12px;
 font-weight: normal;
	white-space: nowrap;
    text-align: center;
}
h2.kasouTitle{
	background: none;
	border-left: none;
	padding:0;
	margin: 0;
}
nav#info {
 width: 42%;
 float: right;
 top: 0.6vw;
}
body.home nav#info ul ,nav#info div,nav#info ul{
 height: 29px;
	width: 100%;
	clear: both;
	margin:0;
}
body.home nav#info ul,nav#info ul {
	display: flex;
   justify-content: flex-end;
}
body.home nav#info ul li,nav#info ul li{
 width: 18vw;
 height: 25px;
 line-height: 20px;
 margin: 0 2% 3% 0;
	border: 1px solid #dddddd;
	border-radius: 9px;
	-webkit-border-radius: 9px;
	-moz-border-radius: 9px;
	box-shadow: 0 3px 5px rgb(0 0 0 / 30%);
	-webkit-box-shadow: 0 3px 5px rgba(0, 0, 0, .3);
}
nav#info div a{
 width: 18vw;
float: right;
 height: auto;
 margin: 0 2% 2% 0;
 line-height: 20px;
 text-indent: 0;
 text-align: center;
 border: 1px solid #dddddd;
 border-radius: 9px;
 -webkit-border-radius: 9px;
 -moz-border-radius: 9px;
 background: #f8f9fa;
 background: -webkit-gradient(linear, 50% 0%, 50% 100%, from(#f8f9fa), color-stop(15%,#f8f9fa), color-stop(80%,#dde3e6), color-stop(98%,#dde3e6), to(#fff));
 background: -moz-linear-gradient(50% 0%, #f8f9fa, #fff);
color: #333;
    font-size: 13px;
	font-weight:600;
    text-decoration: none;
    display: block;
	padding: 2px 0;
	box-shadow: 0 3px 5px rgb(0 0 0 / 30%);
	-webkit-box-shadow: 0 3px 5px rgba(0, 0, 0, .3);
}
/*nav#info div a img ,body.home nav#info ul li a img, nav#info ul li a img{
	width:100%;
	height:auto;
}*/
body.home nav#info ul li a,nav#info ul li a{
	font-size:13px;
	font-weight:600;
    line-height: 20px;

}
nav#header-actions{
	width: auto;
	right: auto;
  left: 3px;
  /*bottom: 4%;*/
	bottom: 0%;
}
nav#header-actions ul li{
	height: 17vw;
  width: 17vw;
	background:none
}
nav#header-actions ul li img{
	width:100%;
	height:auto;
	margin:0;
}
/*nav#header-actions ul li .gloss, .call-action .gloss {
	height: 7vw; width: 17vw;
}*/
body.home nav#info,nav#info{
	position: absolute;
  right: 0;
	top:6.7vw;
	width: 52%;
	margin:0;
}
@media only screen and (max-width: 768px) {
	div.breadcrumbs {
		display: none;
	}
}
body.home nav#main-nav ul li p.caption {
    font-size: 17px;
    margin-top: -30px;
}
h1#intro-bar-title,
#intro-bar-title {
    font-size: 14px;
    color: #fff;
    line-height: 20px;
    text-align: center;
    float: none;
    margin: 0;
    font-weight: 700;
	padding: 0;
}
div#header-main h2{
	background: none;
	border-left: none;
	margin: 0;
    padding: 0;
}
header#top-page h3 {
    font-size: 16px;
    line-height: 18px;
    padding: 6px 5px 6px 6px;
    margin: 2px 0;
    font-weight: 700;
    width: auto;
	border-left: none;
	
    box-shadow: 0 1px 2px rgb(0 0 0 / 30%);
    -webkit-box-shadow: 0 1px 2px rgb(0 0 0 / 30%);
    -moz-box-shadow: 0 1px 2px rgba(0,0,0,.3);
    border-radius: 5px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    background: #f8f9fa;
    background: -webkit-gradient(linear,50% 0%,50% 100%,from(#f8f9fa),color-stop(15%,#f8f9fa),color-stop(80%,#dde3e6),color-stop(98%,#dde3e6),to(#fff));
    background: -moz-linear-gradient(50% 0%,#f8f9fa,#dde3e6);
}	


/* SP TOPページ内 */
.home p.text.impact-box { 
	background: #333;
	background: -webkit-gradient(linear,center top, center bottom, from(#868686),color-stop(30%,#777),color-stop(95%,#444),to(#333));
	background: -moz-linear-gradient(50% 0%, #868686, #333);	

	font-size:15px; color:#f1f1f1; line-height:1.7em; font-weight:bold; 
    margin: 10px;
}
.phone-number img{
	margin-top: 10px;
}
.home p.text {
    font-size: 14px;
	color: #333333;
    line-height: 1.5em;
    font-weight: 700;
    margin: 10px 20px;
    padding: 10px;
}

/* SP TOPページ Slider 
.slider div {
text-align: center;
height: 300px;
width: 100%;
}
.slider img {
width: 200px;
height: auto;
vertical-align:middle;
display: -webkit-box;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
-webkit-justify-content: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
-webkit-align-items: center;
align-items: center;
}*/
/*.slider div {
	width: 400px;
}*/
.slider_sp .slider img {
	width: 200px;
	padding: 10px;
}
.slider_sp .slick-next.slick-arrow{
	right: 12vw;
	z-index: 10;
}
.slider_sp .slick-prev.slick-arrow{
	left: 3vw;
	z-index: 10;
}
.slick-slide{
	margin-right: 1vw!important;
	margin-left: 1vw!important;
}

.slider_pc .slick-next.slick-arrow{
	right: 1vw;
	z-index: 10;
}
.slider_pc .slick-prev.slick-arrow{
	left: -1vw;
	z-index: 10;
}


/************************************************
 * カレンダー
 * **********************************************/
#calender { width:350px; margin: 0 auto; margin-bottom: 20px; }
#calender .title { text-align: left; }
#calender .body  { text-align: center; }

/***********************************************
 * 商品一覧
 * *********************************************/
/*  トップページの商品リスト
------------------------------------------*/
nav#product-list ul li{ 
	border: 1px solid #A4A7A9;
	font-size:14px; font-weight:bold; /*padding:0 0 0 70px;*/
	line-height:1;
	margin:2px 5px;
	
	border-radius:5px;
	-webkit-border-radius:5px;
	-moz-border-radius:5px;  
}
	nav#product-list ul li a {
display: block;
width: 100%;
text-decoration: none;
color:#003c64;

height: 62px;
line-height: 62px;
padding: 0 !important;
}
nav#product-list ul li a:link {
	color:#003c64;
}
nav#product-list ul li a:visited {
	color:#003c64;
}
/*nav#product-list ul li.product1 { background: url(https://www.katuraonline.jp/spn/wp-content/themes/katuraonline_spn/images/spn-images/product_001.png) no-repeat 0px 10px;*/
nav#product-list ul li.product1 { background: url(../images/spn-images/product_001.png) no-repeat 0px 10px;
}
nav#product-list ul li.product2 { background: url(../images/spn-images/product_002.png) no-repeat 0px 10px;
}
nav#product-list ul li.product3 { background: url(../images/spn-images/product_003.png) no-repeat 0px 10px;
}
nav#product-list ul li.product4 { background: url(../images/spn-images/product_004.png) no-repeat 0px 10px;
}
nav#product-list ul li.product5 { background: url(../images/spn-images/product_005.png) no-repeat 0px 10px;
}
nav#product-list ul li.product6 { background: url(../images/spn-images/product_006.png) no-repeat 0px 10px;
}
nav#product-list ul li.product6 { background: url(../images/spn-images/product_006.png) no-repeat 0px 10px;
}
nav#product-list ul li.product7 { background: url(../images/spn-images/product_007.png) no-repeat 0px 10px;
}
nav#product-list ul li a{
padding-left: 95px !important;
}

a:link {
	color: rgb(34, 0, 204); text-decoration: none;
}
a:visited {
	color: rgb(85, 26, 139); text-decoration: none;
}
a:active {
	color: rgb(34, 0, 204); text-decoration: none;
}
a:hover {
	/*color: rgb(34, 0, 204); text-decoration: underline;*/
}
#main_contents a {
	color: rgb(34, 0, 204);
}

/*2022.11.23 ADD*/
@media only screen and (max-width: 600px){
	h1#intro-bar-title,
	#intro-bar-title{
		border-bottom: none;
	}
	div#header-main{
		height: 28vw;
	}
	div#header-main h2{
        font-size: 1em !important;
	}
	body.home nav#info, nav#info{
		top: 11vw;
	}
}