@charset "utf-8";

/*************************************************"
			default
*************************************************/
body {margin: 0px;padding: 0px;font-size:17px;color:#000;height:100%;background-color:#fff;letter-spacing:0.04em;line-height: 1.7;
			text-size-adjust: none;
			-webkit-text-size-adjust: none;/*iphoneの文字サイズの自動調整解除*/
			-webkit-font-smoothing: antialiased;	/*OSXでのフォントのレンダリング方法を調整*/
			/*Macでは普通の游ゴシックが適用され、Windowsでは「 游ゴシック Medium」になる--- "游ゴシック Medium", "Yu Gothic Medium", */
			font-family: "游ゴシック体", YuGothic, "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic", Roboto, Hiragino Kaku Gothic Pro, "ヒラギノ角ゴ Pro W3" , "メイリオ", sans-serif;
			/*font-family: "Times New Roman", "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", serif;*/
			-webkit-font-feature-settings: 'palt' 1;	/*fontの自動カーニング*/
			font-feature-settings: 'palt' 1;}

/*
@font-face {
	font-display:swap;	フォントが利用可能となるまでの間、そのフォントが適用されているテキストには代替フォントが適用
	font-family: "centurygothic";
	src: url("../webfont/centurygothic.woff") format('woff');
}
*/

.mincho{font-family: "Times New Roman", "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", serif;}


/*
font-family:YakuHanMP, 'Noto Serif JP', serif;font-weight:400;
font-family:YakuHanMP, 'Noto Serif JP', serif;font-weight:500;
font-family:YakuHanMP, 'Noto Serif JP', serif;font-weight:600;
font-family:YakuHanJP, 'Noto Sans JP', sans-serif;font-weight:700;
font-family:YakuHanJP, 'Noto Sans JP', sans-serif;font-weight:900;
*/

a         {color: #000;text-decoration:underline;transition: 0.8s;}/*hover ゆっくり変わる*/
a:link    {color: #000;text-decoration:underline;}
a:visited {color: #666;text-decoration:underline;}
a:active  {color: #000;text-decoration: underline;}
a:hover   {color: #b5262b;text-decoration: underline;}

h1,h2,h3,h4,h5,p,ol,ul,li,span,dl,dt,dd {margin:0;padding:0;font-weight:normal;}
	
img {border:none;margin:0;padding:0;vertical-align:middle;}
img{max-width:100%;height:auto;}

/*
a:hover img {opacity: 0.7;transition: 0.3s ease-in-out;}
*/

ul {margin:0px;padding:0px;list-style:none none outside;}
ol{margin:0;padding:0;}

p.clear		{clear:both;line-height:0px;display:block;}
div.clear {clear:both;}

hr{ border:none;border-top:1px solid #ccc;height:1px;}
/*hr{background:url(../img/hr_bg.png) repeat-x 0 0;height:10px;border: 0;}*/

.dotline{border-top: 1px dotted #aaa;line-height: 1px;height: 1px;}
.solidline{border-top: 1px solid #bbb;line-height: 1px;height: 1px;}

.strong{font-weight:bold;}

table{border-collapse: collapse;}


/*padding や border-width がwidth内に収まる*/
*, *:before, *:after {
    -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
         -o-box-sizing: border-box;
        -ms-box-sizing: border-box;
            box-sizing: border-box;
}



/*clearfix--------------------*/
.cf:before,
.cf:after {content: " ";display: table;} 
.cf:after {clear: both;} 
.cf{*zoom: 1;}


/*---電話番号用---768px以上の解像度だけpointer-eventsを無効にして、PCのときはTELクリックの反応なし---*/
@media screen and (min-width: 768px) {	
	a[href^="tel:"] {pointer-events: none;}
}



/* ページの各セクション-------------------*/
.section{padding-left:20px !important;padding-right:20px !important;padding-top:90px;padding-bottom:90px;}
.section-end{padding:70px 0 0 0;}



/*全ページ共通のテーブル構造　-------------------*/
#wrapper{position: relative;z-index:10;width:100%;margin-top: 105px;}
#main{}
.container {position: relative;max-width:1510px;width:100%;margin:0 auto;padding:0;line-height:1.8;padding:0 10px;}

/*TOPページ専用のテーブル構造　-------------------*/
body#page_homepage .ec-layoutRole .ec-layoutRole__contents{max-width: unset;}



/*ページ上部右の出てくるナビmenu---*/
#menubtn{display:none;}
#navi_sp{display:none;}


/*lozad.jによるアニメーション------*/
.fadein-			{opacity: 0;transition: opacity 0.5s linear,transform 1s ease-out;}
.fadein-left	{opacity: 0;transform: translate3d(-300px, 0, 0);transition: opacity 0.5s linear,transform 1s ease-out;}
.fadein-right	{opacity: 0;transform: translate3d(300px, 0, 0);transition: opacity 0.5s linear,transform 1s ease-out;}
.fadein-up		{opacity: 0;transform: translate3d(0, 100px, 0);transition: opacity 0.5s linear,transform 1s ease-out;}
.zoomin				{opacity: 0;transform: perspective(500px) translateZ(100px);transition: opacity 0.5s linear,transform 1s ease-out;}

.transition-delay1{transition-delay: 0.3s;}
.transition-delay2{transition-delay: 0.6s;}
.transition-delay3{transition-delay: 0.9s;}
.transition-delay4{transition-delay: 1.2s;}
.transition-delay5{transition-delay: 1.5s;}
.transition-delay6{transition-delay: 1.8s;}
.transition-delay7{transition-delay: 0.3s;}
.transition-delay8{transition-delay: 0.6s;}
.transition-delay9{transition-delay: 0.9s;}

*[data-loaded="true"]{opacity: 1;transform: none;}
/*big画像用*/
.transition-delay10{transition-delay: 1.5s;}
.transition-delay11{transition-delay: 2s;}
.transition-delay12{transition-delay: 2.5s;}




/*///////////////////////////////////////////////////////////////////////////////
 全ページ共通のheader
///////////////////////////////////////////////////////////////////////////////*/
#header {position: fixed;top: 0;z-index: 50;height: 105px;width: 100%;background-color: #fff;transition: 0.8s;border-bottom: 1px solid #fff;}
/* 縮小時のheader*/
#header.smaller {top:-45px;transition: 0.8s;border-bottom: 1px solid #d6d6d6;}
#header.smaller .ec-headerRole {top: 49px;}
#header.smaller .header_logo_area .header_logo a {width: 173px;height: 48px;}
		
.ec-headerNaviRole{position: relative;max-width: 1290px;margin:0 auto;padding:0 20px;top: 15px;}
.ec-headerRole {padding: 0;top: 26px;transition: 0.8s;}

.ec-headerNaviRole .ec-headerNaviRole__left {position: absolute;max-width: 320px;}
.ec-headerNaviRole .ec-headerNaviRole__right {max-width: 778px;width: 100%;margin: 0 0 0 auto;}

#header .header_logo_area {position: relative;z-index: 5;display: flex;align-items: center;}

.header_logo_area .header_logo a{background:url(../img/rogo.png) no-repeat;width:228px;height:64px;background-size: contain;text-indent:-8989px;display:block;overflow:hidden;}
.header_logo_area .header_logo a:hover{opacity:0.6;}

.header_logo_area .copy {display:none;}
.header_logo_area .cap {font-size: 85%;padding: 0 0 5px 7px;line-height:1.2;text-align: center;}

.ec-headerNav {margin-right: 1.3em;}
.ec-headerNav .ec-headerNav__itemIcon {font-size: 18px;margin-right: -5px;}

.ec-cartNavi {/*! border-radius:none; */min-width: unset;background: #fff;padding: 0;height: auto;}
.ec-cartNavi a{color:#333;}
.ec-cartNaviIsset.is-active {display: none;overflow-y: auto;height: 600px;}

.ec-cartNavi__label{display: none;}
.ec-cartNavi .ec-cartNavi__icon {font-size: 22px;}
.ec-headerNav .ec-headerNav__item {font-size: 19px;}

#header #category {padding: 0 0 0 0;}

/* ==================== 全ページ共通のPC用の横メニュー ==================== */
/*SP用の縦メニュー*/
.tatemenu-bg{display:none;}

.yokomenu-bg{position:relative;width:100%;text-align:center;margin-top:27px;max-width: 1290px;padding: 0 20px;margin: 18px auto 0 auto;}
.menu-yokomenu-container{width:700px;margin:0 0 0 auto;}

ul#yoko-menu {list-style-type: none;padding: 0;width:100%;display: table;}

ul#yoko-menu li{position:relative;float:left;margin: 0;padding: 0;text-align: center;font-family: YakuHanMP, 'Noto Serif JP', serif;font-weight: 500;}
ul#yoko-menu li.yokomenu1{width:10%;}
ul#yoko-menu li.yokomenu2{width:19%;}
ul#yoko-menu li.yokomenu3{width:22%;}
ul#yoko-menu li.yokomenu4{width:23%;}
ul#yoko-menu li.yokomenu5{width:26%;}


ul#yoko-menu li a{font-size:102%;color: #000;height:60px;width: inherit;text-decoration: none;display: table-cell;vertical-align: middle;}

/*ul#yoko-menu li.arrow > a{background:url(../img/arrow_9-5.png) no-repeat center 55px;}----未使用*/
ul#yoko-menu > li:first-child a{background:url(../img/home.png) no-repeat center center;overflow: hidden;color: rgba(255, 255, 255, 0);background-size: 14px;}
ul#yoko-menu li.current > a,
ul#yoko-menu li a:hover{background-color:#eee;}


/*TOPページのカレント表示用----------------*/


/*プルダウン部分 submenu*/
/*三角の表示用
ul#yoko-menu ul li:first-child a:after {content: '';position: absolute;width: 0;height: 0;left:45%;top: -9px;border-left: 7px solid transparent;border-right: 7px solid transparent;border-bottom: 10px solid #53912b;}
*/
ul#yoko-menu li ul {position: absolute;background-color:#aaa;z-index:200;width:100%;}
ul#yoko-menu li ul li {overflow: hidden;line-height:1.2;width: 100%;height: 0;transition: .2s;}
ul#yoko-menu li ul li a{font-size:85%;line-height:1.2;color:#fff;display:block;height:45px;padding:12px 0 0 0;border-top:1px dotted #ccc;}


ul#yoko-menu li:hover li > a:hover{background-color:#666;color:#fff;}
ul#yoko-menu li:hover > ul > li {overflow: visible;height:45px;}
ul#yoko-menu li:hover > ul > li:last-child{border-bottom:none;}


/*submenuのsub*/
ul#yoko-menu li ul li ul {top: 0;left: 100%;}
ul#yoko-menu li:last-child ul li ul {left: -100%;width: 100%;}
ul#yoko-menu li ul li ul li:first-child{border:none;}
ul#yoko-menu li ul li ul li:first-child a:after{border:none;}
ul#yoko-menu li ul li:hover > ul > li:first-child{height:45px;}
ul#yoko-menu li:hover ul li ul li:hover > a {}
ul#yoko-menu li ul li ul:before							{position: absolute;content: "";top:18px;left: -15px;width: 0;height: 0; border: 5px solid transparent;border-left-color:#fff;}/*三角の表示用*/
ul#yoko-menu li:last-child ul li ul:before	{position: absolute;content: "";top:18px;left: 200%;margin-left: -20px;border: 5px solid transparent; border-right-color:#fff;}




/*///////////////////////////////////////////////////////////////////////////////
 main
///////////////////////////////////////////////////////////////////////////////*/

/*色*/
.color1{color:#ff3300;}/*基本色 レッド*/
.color-red{color:#ff0000;}
.color2{color:#cc3333;}/*注意色*/


/*動画-----------*/
/*サーバー内埋め込み*/
#index-movie-box{max-width:780px;margin:0 auto 50px auto;}
.index-movie{position: relative;width:100%;height: 0;padding-bottom:56.3%;}/*padding-bottom:56.3%;padding-bottom:48.2%;*/
.index-movie video {position: absolute;top: 0;left: 0;width: 100% !important;height: auto !important;}

/*facebook動画のiframe埋め込み*/
.video-container{position: relative;text-align: center;max-width:780px;margin:0 auto 50px auto;}

/*先方担当者がUPするyoutubeなどの動画レスポンシブ*/
.responsive-video{position:relative;width: 100%;max-width:1000px;margin:15px auto 0 auto;} 
.responsive-video::before {content: "";display: block;width: 100%;padding-top: 56.27%;}
.responsive-video video, 
.responsive-video iframe, 
.responsive-video object, 
.responsive-video embed { position: absolute !important; top: 0; left: 0; width: 100%; height: 100%;}
.responsive-video .mce-preview-object{position: unset;}


/*TOPページ和らくのyoutube埋め込み動画*/
.movie-wrap-out{width: 1000px;margin:40px auto 0 auto;}
.movie-wrap {position: relative;padding-bottom: 56.25%;height: 0;overflow: hidden;} 
.movie-wrap iframe {position: absolute;top: 0;left: 0;width: 100%;height: 100%;}
.movie-wrap .player {position: absolute;top: 0;left: 0;z-index: 1;}
.movie-wrap .thumb{position:absolute;top:0;left:0;z-index:1;}
.movie-wrap .thumb:hover{cursor: pointer;opacity:0.8;}


/*全ページ共通のSNSボタン----------------このサイトでは未使用
#sns-box{margin-top:10px;text-align:center;}
#sns-box ul{margin:0 !important;padding:0;}
#sns-box ul li{display:inline-block;margin: 0 4px;width: 25px;height: 25px;padding:0 !important;}
#sns-box ul li a img{width:100%;height:100%;}
#sns-box ul li a:hover,
#sns-box ul li a:active{opacity:0.6;}
*/



/*このボタンは、中ページ全ページで使用*/
.naka-kuwashii{margin-top: 25px;text-align:center;line-height:1.1;}
/*
.naka-kuwashii a{position: relative;z-index: 2;cursor: pointer;width: 340px;height: 61px;color: #fff;text-decoration: none;display: table-cell;font-family:YakuHanMP, 'Noto Serif JP', serif;font-weight: 500;line-height:1;
																background:url(../img/arrow_white29-37.png) no-repeat , url(../img/naka_kuwashii_bg.png) no-repeat;background-size: 12px , 150px;background-position: right 15px center , left 7% center;background-color: #000;
																font-size:115%;transition: 0.8s;vertical-align: middle;padding-bottom: 2px;padding-right: 1em;border-radius: 0.4em;}
*/
.naka-kuwashii a{position: relative;z-index: 2;cursor: pointer;width: 340px;height: 61px;color: #fff;text-decoration: none;display: table-cell;font-family:YakuHanMP, 'Noto Serif JP', serif;font-weight: 500;line-height:1;
background:#000 url(../img/arrow_white29-37.png) no-repeat;background-size: 12px;background-position: right 15px center;border-radius: 0.4em;
																				font-size:115%;transition: 0.8s;vertical-align: middle;padding-bottom: 2px;padding-right: 1em;}

.naka-kuwashii a:hover{background-color: rgba(0,0,0, 0.6) !important;padding-right: 0.5em;}


/*全ページ共通のページ下部の上部へ戻る */
#pagetop {position:relative;width:100%;margin:0 auto;z-index:40;}
#pagetop a {position: fixed;bottom:20px;right:15px;display: block;background:url(../img/pagetop.png) no-repeat 0px top;background-size: contain;width:75px;height:75px;text-indent:-8989px;display:block;overflow:hidden;opacity:0.7;}
#pagetop a:hover {opacity:1;}


/*googlemap*/
.googlemap {margin: 30px calc(50% - 50vw) 0 calc(50% - 50vw);width: 100vw;}
.googlemap iframe{/*filter:grayscale(70%);-webkit-filter:grayscale(70%);*/width:100%;height:400px;}


/*メンテナンス中です*/
.mente-img{max-width: 660px;margin: 0 auto;padding: 0 30px;}




/*///////////////////////////////////////////////////////////////////////////////
 全ページ共通のフッター
///////////////////////////////////////////////////////////////////////////////*/
#footer{width:100%;background-color:#000;}
.ec-footerRole {margin-top: 45px;border: none;background: unset;padding: 0;}
.ec-footerRole .ec-footerRole__inner{color:#fff;font-family: YakuHanMP, 'Noto Serif JP', serif;font-weight: 400;text-align: center;}


#footer-menu{text-align:center;margin-bottom: 15px;}
ul#footer-menu > li{margin: 0 30px 15px 20px;font-size:100%;line-height:1.1;display: inline-block;text-align: left;}
ul#footer-menu li a{color:#fff;text-decoration: none;background:url(../img/arrow_white13-25.png) no-repeat left center / 4px;padding:0 0px 2px 8px;}
ul#footer-menu li a:hover{opacity: 0.6;}

ul#footer-menu li > ul.footer-sub{margin-top:5px;}
ul#footer-menu li > ul.footer-sub li{display:table;font-size:83%;margin-top: 8px;}

.footer_logo_area_wrap{display: inline-block;vertical-align: top;margin-top: 20px;margin-right: 4%;}
.footer_logo_area{position: relative;z-index: 5;display: flex;align-items: center;}
.footer_logo_area .header_logo a{background:url(../img/rogo_white.png) no-repeat;width:228px;height:64px;background-size: contain;text-indent:-8989px;display:block;overflow:hidden;}
.footer_logo_area .header_logo a:hover{opacity:0.6;}
.footer_logo_area .copy {display:none;}
.footer_logo_area .cap {font-size: 85%;padding: 0 0 5px 7px;line-height:1.2;text-align: center;}

.footer_zip_area{display: inline-block;margin-right: 4%;text-align: left;}
.footer-zip{font-size: 90%;line-height: 1.5;margin-top: 7px;}
.footer-zip span{}

.footer-tel{margin-top: 5px;}
.footer-tel a{background:url(../img/tel.png) no-repeat left top 17px;padding-left:36px;background-size:28px;text-decoration:none;color:#fff;font-size: 245%;letter-spacing: 0.02em;line-height: 1;font-family: YakuHanMP, 'Noto Serif JP', serif;font-weight: 400;}
.footer-tel a:hover{}

.mailmag-btn{display: inline-block;vertical-align: top;margin-top: 25px;}
.mailmag-btn a{font-family: YakuHanMP, 'Noto Serif JP', serif;font-weight: 400;border:1px solid #bbb;border-radius:5px;text-align:center;display: table-cell;color: #fff;text-decoration: none;height: 65px;width: 160px;vertical-align: middle;font-size: 90%;line-height: 1.3;}
.mailmag-btn a:hover{background-color:#555;}

.copyright{font-size:68%;line-height:1;text-align:center;color:#fff;padding: 30px 0 30px 0;}





/*///////////// メンテナンスモード表示の時 //////////////////*/
.rogo-mente{display:table;margin: 40px auto 0 auto;}
body.maintenance-mode .header_logo_area {position: relative;z-index: 5;display: flex;align-items: center;}
body.maintenance-mode .ec-reportHeading {border-top: none;}
body.maintenance-mode .ec-404Role {background-color: #fff;}
body.maintenance-mode .ec-404Role__icon{display: table;margin: 20px auto -12px auto;font-size: 60px;}
body.maintenance-mode .ec-icon img {max-height: 60px;}
body.maintenance-mode .ec-404Role .ec-404Role__title {font-size: 22px;}
body.maintenance-mode .ec-reportDescription {padding: 0 20px;}



/*印刷しない--------------------*/
@media print {
#pagetop,
#pagetop a{display:none;}
#header{position: absolute !important;}

.fadein-,
.fadein-left,
.fadein-right,
.fadein-up,
.zoomin{opacity: 1;transform: none !important;}
}