@charset "utf-8";

/*
 TBは、pc.css　を読み込んでいます。
 打ち消したいスタイルを以下に書き込んでください。
*/


/*  ================================================================================================

    TB 打ち消しスタイル

    ============================================================================================  */


@media screen and (min-width: 768px) and (max-width: 820px){

	.overFlowHid {
		overflow-y:hidden;
	}
	/* header　ヘッダー
	------------------------------------------------------------------ */
	#commonHeader {
		position: fixed;
		top: 0;
		left: 0;
		z-index: 9999;
		width: 100%;
		background: #FFFFFF;
		font-family: Noto Sans JP,sans-serif!important;
	}
	/* TOPのみ */
	body.officialTop #commonHeader {
		margin-top: -71px!important;
		top: -1px;
	}
	body.officialTop #commonHeader.is-animation {
		margin-top: -1px!important;
	}

	/* / TOPのみ */

	#commonHeader a {
		text-decoration: none;
	}
	#commonHeader #commonHeaderWrap  {
		position: relative;
		padding: 0;
	}	
	#commonHeader #commonHeaderWrap .logo {
		margin: 0 0 0 12px;
		z-index: 1;
		top: -5px;
	} 
	body #wrapper #commonHeader #commonHeaderWrap{
		display: block;
		position: relative;
		height: auto;
	}
	body.officialTop #wrapper #commonHeader #commonHeaderWrap{
		height: 71px;
	}

	#commonHeader #commonHeaderWrap.is-anime,
	#commonHeader #commonHeaderWrap.out-anime {
		animation: none
	}
	.globalNavi li .megaMenuWrap {
		padding-top: 0;
		backdrop-filter: none;
	}
	#commonHeader #commonHeaderWrap .logo {
		text-align: left;
		margin: 0 0 0 12px;
	}
	#headerInner .logo img {
		padding: 0;
	}
	#commonHeader .megaMenuWrap .megaMenuLink {
		position: static;
		display: block;
		margin: 0;
		margin: 0;
	}
	#commonHeader #headerInner .megaMenuWrap .megaMenuLink ul.linkBlock li a {
		pointer-events: all;
	}
	#commonHeader #headerInner .megaMenuWrap .megaMenuLink ul.linkBlock.spNone {
		display: none;
	}
	.megaMenuLink .megaMenuLinkInner {
		width: 100%;
		display: block;
		/* padding: 1.2rem 0; */
		position: relative;
	}
	#wrapper #commonHeader #headerInner,
	body.categoryEnjoy #commonHeader #headerInner {
		height: auto;
		display: block;
	}
	#wrapper #commonHeader #headerInner .logo .logoTextImg,
	body.categoryEnjoy #commonHeader #headerInner .logo .logoTextImg{
		display: block;
		width: 170px!important;
		transition: none;
		padding-left: 0;
	}
	/* header　ヘッダー縮小 クリア */
	#wrapper #commonHeaderWrap {
		display: block;
	}
	#wrapper #headerInner .logoImg{
		width: 60px;
	}

	/* globalNaviSp グローバルナビ（バーガーメニュー）
	------------------------------------------------------------------ */
	body.overFlowHid header#commonHeader {
		background: none;
		backdrop-filter: unset;
	}
	body.overFlowHid .globalNavi {
		background: rgba(255,255,255,.95);
		backdrop-filter: blur(12px);
		-webkit-backdrop-filter: blur(12px);
	}
	.globalNavi.active {
		width: 100vw;
		margin: 0 calc(50% - 50vw);
		/* padding: 0!important; */
	}
	.globalNavi .globalNaviList > ul {
		flex-direction: column;
		width: 100%;
	}
	.is-animation .globalNaviList {
		display: block;
		flex-direction: column;
	}
		
	
	/* megamenu メガメニュー
	------------------------------------------------------------------ */
	#commonHeader #commonHeaderWrap {
		margin: 0;
	}
	#wrapper header#commonHeader .logo a,
	body.categoryEnjoy header#commonHeader .logo a{
		padding: 10px 16px;
		display: block;
	}
	header#commonHeader a {
		padding: 2.45rem 16px;
		display: block;
	}
	.headerInner {
		display: flex;
	}
	.globalNavi {
		overflow: auto;
		display: none;
		transition: .3s;
	}
	.globalNavi.active {
		display: block;
	}
	.globalNavi li .megaMenuWrap {
		position: relative;
		background: none;
	}
	.megaMenuLink figure {
		display: none;
	}

	.globalNavi .acc .megaMenuWrap {
		display: none;
		position: relative;
		padding: 0;
	}
	.globalNavi .acc .megaMenuWrap.active {
		display: block;
	}
	.globalNaviList .acc a:before {
		transition: .3s;
	}
	.globalNaviList .acc.active > a:before {
		transform: rotate(90deg);
		top: 1.3rem;
	}
	#commonHeader .arrow,
	#commonHeader .acc {
		position: relative;
	}
	#commonHeader .arrow::after {
		content: '';
		position: absolute;
		top: 48%;
		right: 16px;
		width: 30px;
		height: 30px;
		display: inline-block;
		padding: 10px;
		border: 2px solid #107A4B;
		border-radius: 50%;
		transform: translateY(-50%);
	} 
	#commonHeader .acc::after {
		content: '';
		position: absolute;
		top: 36px;
		right: 20px;
		width: 30px;
		height: 30px;
		display: inline-block;
		padding: 10px;
		border: 2px solid #107A4B;
		border-radius: 50%;
		transform: translateY(-50%);
		z-index: 1;
	} 
	.globalNaviList .acc:after {
		top: 1.6rem;
	}
	#commonHeader .acc > a {
		position: relative;
	}
	#commonHeader .acc > a::before,
	#commonHeader .acc > a::after  {
		content: '';
		display: inline-block;
		position: absolute;
		transform: translateY(-50%);
		width: 2px;
		height: 16px;
		background-color: #107A4B;
	}
	#commonHeader .globalNaviList .acc > a::after {
		top: 39%;
		transform: rotate(90deg) translateY(-50%);
		right: 42px;
		left: auto;
		border: none;
	}
	#commonHeader .globalNaviList .acc.m_hover > a::after {
		top: 47%;
	}
	#commonHeader .globalNaviList .acc a:before {
		top: 50%;
    right: 34px;
	}
	#commonHeader .globalNaviList .acc > a::before {
		transform: translateY(-50%) rotate(0deg);
	}
	#commonHeader .globalNaviList .acc.m_hover > a::before,
	#commonHeader .globalNaviList .acc.active > a::before {
		transform: translateY(-50%) rotate(90deg);
		/* top: 38px; */
	}
	#commonHeader .acc > a {
		position: relative;
	}
	#commonHeader #headerInner .megaMenuWrap .megaMenuLink ul.linkBlock.spNone {
		display: block!important;
	}
	.is-animation .globalNavi li .megaMenuWrap {
		padding: 0;
	}
	#commonHeader .globalNaviList .acc a.btnA,
	#commonHeader .globalNaviList .acc a.btnB,
	#commonHeader .globalNaviList .acc a.btnC {
		padding-left: 24px!important;
	}
	#commonHeader .globalNaviList .acc a.btnA:before,
	#commonHeader .globalNaviList .acc a.btnB:before,
	#commonHeader .globalNaviList .acc a.btnC:before {
		width: 18px;
		transform: translateY(-50%);
	}
	#commonHeader .globalNaviList .acc a.btnA:before,
	#commonHeader .globalNaviList .acc a.btnB:before{
		height: 18px;
	}
	#commonHeader .globalNaviList .acc a.btnC:before {
		height: 30px;
	}
	.globalNavi .globalNaviList .linkBtn a.btnC:before {
		height: 100%;
	}
	.language a,
	.customer a {
		padding: 20px 0 20px 20px!important;
	}
	.language a span,
	.customer a span{
		padding-left: 12px;
	}
	.onLine:before,
	.language a:before,
	.customer a:before {
		width: 10px;
		width: 10px;
		left: 17px;
	}
	.globalNaviList a span.onLine:before,
	.globalNaviList .language a:before,
	.globalNaviList .customer a:before {
		width: 20px;
		height: 20px;	
	}
	#headerInner .globalNaviList a span.onLine {
		padding: 0 0 0 20px;
		display: inline-block;
		font-size: 16px;
	}
	.language a span:before,
	.customer a span:before {
		display: none!important;
	}
	.otherLink {
		font-size: 14px;
	}
	.otherLink button {
		display: none;
	}
	.globalNavi li .megaMenuWrap {
		margin-top: 0!important;
	}
	.globalNaviList {
		font-size: 16px;
		font-weight: bold;
		max-height: calc(100vh - 77px);
    overflow-y: scroll;
	}
	.globalNavi.active {
		top: 0;
		padding-top: 77px;
		position: fixed;
	}
	.globalNavi .globalNaviList > ul li.current a, .globalNavi .globalNaviList > ul li a:hover,
	.globalNavi .globalNaviList > ul li a {
		border-bottom: none;
	}
	.globalNaviList a {
		color: #151818;
		display: block;
		padding:22px 16px;
	}
	#commonHeader #headerInner .globalNaviList a {
		text-align: left;
		padding: 24px;
		font-size: 16px;
	}
	#commonHeader #headerInner .globalNaviList ul li > a {
		border-bottom: 1px solid #ccc;
    background: #efefef;
	}
	#commonHeader #headerInner .globalNaviList .megaMenuWrap .megaMenuLink .megaMenuLinkInner a {
		border-bottom: none;
		background: none;
		padding: 12px 24px;
	}
	#commonHeader #headerInner .globalNaviList .acc > a {
		pointer-events: none;
	}
	#commonHeader.is-animation #headerInner .globalNaviList a {
		text-align: left;
	}
	.globalNavi .globalNaviList ul li {
		position: relative;
		width: 100%;
		font-size: 16px;
	}
	.globalNavi .globalNaviList .otherLink ul li {
		width: 50%;
		text-align: left;
		padding: 0 0.94vw;
	}
	#commonHeader .globalNavi .globalNaviList .otherLink ul li.language {
		border-right: 1px solid #ccc ;
	}

	.globalNavi .otherLink a span.onLine,
	.globalNavi .otherLink .language a span,
	.globalNavi .otherLink .customer a span {
		position: relative;
		padding: 0 0 0 25px;
	}
	#headerInner .globalNaviList #slideToggle span {
		font-size: 16px;
		text-align: left;
		line-height: 2;
		padding: 0 0 0 26px;	
	}
	.language a span:before {
		background: url(/lib/img/common/ico_english.png) left center no-repeat;
	}
	.customer a span:before {
		background: url(/lib/img/common/ico_customer.png) left center no-repeat;
	}
	a span.onLine:before {
		background: url(/lib/img/common/ico_shop.png) left center no-repeat;
	}
	a span.onLine:before{
		position: absolute;
		top: 50%;
		left: 0;
		transform: translateY(-50%);
		content: "";
		display: inline-block;
		background-size: contain;
		width: 10px;
		height: 10px;
	}
	.linkBtn {
		border: none;
	}
	.linkBtn a.btnA,
	.linkBtn a.btnB,
	.linkBtn a.btnC {
		display: flex!important;
		justify-content: end;
		align-items: center;
	}
	.linkBtn a.btnA:before {
		content:"";
		background: url(/lib/img/common/megamenu/ico_product.png) left center no-repeat;
		background-size: contain;
		width: 15px;
		height: 15px;
		margin-right: 10px;
		display: inline-block;
	}
	.linkBtn a.btnB:before {
		content:"";
		background: url(/lib/img/common/megamenu/ico_list.png) left center no-repeat;
		background-size: contain;
		width: 15px;
		height: 15px;
		margin-right: 10px;
		display: inline-block;
	}
	.linkBtn a.btnC:before {
		content:"";
		background: url(/lib/img/common/megamenu/ico_brand.png) left center no-repeat;
		background-size: contain;
		width: 15px;
		height: 25px;
		margin-right: 10px;
		display: inline-block;
	}
	.linkBtn a span {
		display: inline-block;
		width: 100%;
		text-align: left;
	}
	#headerInner .globalNaviList span{
		font-size: 15px;
	}
	.otherList {
		display: none;
	}
	/* ハンバーガー */
	.menuBtn {
		position: absolute;
		top: 0;
		right: 0;
		z-index: 1;
	}
	
	.menuBtn .btnGlobal{
		position: relative;
		cursor: pointer;
		width: 70px;
		height:70px;
		display: block;
	}

	/*ボタン内側*/
	.menuBtn .btnGlobal span{
		display: inline-block;
		transition: all .4s;
		position: absolute;
		left: 0;
		height: 3px;
		border-radius: 2px;
		background: #333;
		width: 30px;
	}
	.menuBtn .btnGlobal span:nth-of-type(1) {top: 24px;}
	.menuBtn .btnGlobal span:nth-of-type(2) {top: 37px;}
	.menuBtn .btnGlobal span:nth-of-type(3) {top: 50px;}
	.menuBtn .btnGlobal.active span:nth-of-type(1) {
		top: 25px;
		transform: translateY(6px) rotate(-45deg);
		width: 40px;
	}
	.menuBtn .btnGlobal.active span:nth-of-type(2) {
		opacity: 0;
	}
	.menuBtn .btnGlobal.active span:nth-of-type(3){
		top: 38px;
		transform: translateY(-6px) rotate(45deg);
		width: 40px;
	}
/**/


.menuBtn .globalNavi li .megaMenuWrap {
		background: none;
	}
	.menuBtn .globalNavi .globalNaviList {
		background: rgba(255,255,255,.85);
		flex-direction: column;
	}
	#headerInner .globalNavi .globalNaviList .otherLink {
		display: block;
		border-bottom: 1px solid #ccc;
		background: #efefef;
		right: 0;
		top: 0!important;
		position: relative;
	}
	#headerInner .globalNavi .globalNaviList .otherLink button {
		display: none;
	}
	#headerInner .globalNaviList .otherLink ul#slideToggle {
		position: relative;
		width: 100%;
    left: 0;
		top: 0;
		display: flex;
		max-height: none;
	}
	
	#headerInner .globalNaviList .otherLink ul#slideToggle li {
		margin-right: 0;
		background: none;
	}
	#headerInner .globalNaviList .otherLink ul#slideToggle li a {
		border: none;
	}
	.globalNavi .globalNaviList .otherLink ul {
		display: flex;
		justify-content: space-between;
		width: 100%;
	}
	.globalNavi .globalNaviList .linkBlock li {
		border-top: none;
	}
	.megaMenuLinkInner ul li {
		margin-bottom: 0;
	}
	#commonHeader .globalNavi li.m_hover > a {
		border-bottom: none;
	}
	#commonHeader .arrow {
		position: relative;
	}
	#commonHeader .arrow::after {
		content: '';
		position: absolute;
    top: 37px;
    right: 20px;
    width: 30px;
    height: 30px;
		display: inline-block;
		padding: 10px;
		border: 2px solid #107A4B;
		border-radius: 50%;
		transform: translateY(-50%);
		z-index: 1;
	}
	#commonHeader .arrow::before {
		content: '';
		width: 10px;
		height: 10px;
		border-top: solid 2px #107A4B;
		border-right: solid 2px #107A4B;
		position: absolute;
		top: 36px;
		right: 35px;
		transform: rotate(45deg) translateY(-50%);
		z-index: 2;
	}
	#commonHeader .linkBtn {
		text-align: right;
		font-size: 14px;
		padding: 0 0 0 0;
		margin: 0;
		width: 100%;
		display: flex;
    justify-content: end;
	}
	#commonHeader .linkBtn ul {
		width: 50%;
	}
/* contents
------------------------------------------------------------------ */
#g-contents {
	padding: 71px 0 0;
}
#wrapper{
	padding: 60px 0 0px;
}
#wrapper{
	padding: 60px 0 0px;
}

.siteStructureWrap{
	display:none;
}

/* footer
------------------------------------------------------------------ */
#commonFooter {
	font-family: Noto Sans JP,sans-serif!important;
}
#commonFooter #commonFooterWrap {
	margin: 0;
}
#commonFooter #commonFooterWrap #footer {
	width: 100%;
}
#commonFooter .footerLogoArea {
	margin-bottom: 0;
	align-items: center;
}
#commonFooter #commonFooterWrap #footer .footerLink {
	display: block;
	width: 100%;
	margin: 0 auto;
	text-align: center;
}
#commonFooter #commonFooterWrap #footer .footerLink li {
	display: inline-block;
	text-align: center;
	margin: 0 1%;
}
#commonFooter .footerLogo {
	font-size: 20px;
	padding: 20px;
}
.footerOtherLink {
	padding: 20px;
}
.footerOtherLinkList {
	margin-top: 0;
}
/* #commonFooter .siteLink {
	padding: 20px;
} */
.footerOtherLinkListPc {
	padding-right: 20px;
}

.siteLink{
	margin-left: 20px;
}


/* official top footer */


/*  ================================================================================================

    SP ページごと個別スタイル

    ============================================================================================  */
/*新着情報一覧  
-----------------------------------------------------*/
.news .newsIndexTitle{
	margin-top:35px;
}

/*新着情報一覧  
-----------------------------------------------------*/
.newsIndex .newsIndexTitle{
	margin-top:35px;
}
/*ニュースリリース一覧*/
body.news .newsWrap #dateBox {
	position:static;
	width:auto!important;
}
body.news .cp_ipselect select{
	margin-right:0;
}
body.news #news-contents ul {
	position: relative;
	width:100%!important;
	line-height: 1.2em;
	margin-bottom: 10px;
	margin-top: 5px;
}
body.news .cp_ipselect.cp_sl01 {
	display: inline-block;
	width: 30%;
	position: relative;
	border: 1px solid #bbbbbb;
	border-radius: 2px;
	background: #ffffff;
}
body.news .newsWrap #dateBox .selectBottomText {
	position: absolute;
	font-size: 13px;
	text-indent: -1em;
	padding-left: 1em;
	width: -webkit-calc( 100% - 33% );
	width: calc( 100% - 33% );
	display: inline-block;
	top: 30px;
	right: 1%;
}
body.news #news-contents #whatsnew ul li .newsBoxWrap .newsTextBox{
	width: 100%;
}

/*ニュース詳細 
-----------------------------------------------------*/
.newsdetail .newsIndexTitle{
	margin-top:35px;
}
.newsdetail .btnArea{
	display:-webkit-flex;
	display:flex;
	justify-content: center;
	width: 100%;
	margin: 0 auto 0px auto;
}
.newsdetail .btnList,
.newsdetail .btnBackTop{
	width:40%;
}
.newsdetail .btnList{
	margin-right:5%;
}
.newsdetail .btnList a,
.newsdetail .btnBackTop a {
	font-size: 16px;
	text-align: center;
	padding: 11px 0 9px 0px;	
	margin: 0 auto;
	border: 2px solid #107a4b;
	border-radius: 30px;
	text-decoration: none;
	display:block;
}

.newsdetail .btnBackTop a {
	text-decoration: none;
	color: #064d2e;
	color: #064d2e;
	background: url("/lib/img/top/news/icon_arrow.png") 92% 50% no-repeat ;
	background-size: 20px;
	display:block;
}
.newsdetail .btnList a{
	text-decoration: none;
	color: #064d2e;
	color: #ffffff;
	background: url("/lib/img/top/news/icon_arrow_l.png") 92% 50% no-repeat #107a4b;
	background-size: 20px;
	display:block;		
	}	
.newsdetail .tbBody{
	margin:0 13px;
}
.newsdetail .tbfoot{
	margin:1.0rem 13px 0;;
}
/*管理画面ニュース詳細プレビュー
-----------------------------------------------------*/
body.newsdetail.preview .previewTableArea th,
body.newsdetail.preview .previewTableArea td{
	display:block;
	font-size:14px;
}
}
	
/* アコーディオン */
.accordionBox .accordionContents{
	display: none;
}

.pLR0 #wrapper {
	padding-left: 0;
	padding-right: 0;
}