@charset "UTF-8";
/* Global Navigation
-----------------------------------------*/
/*! #######################################################################
MeanMenu 2.0.7
--------
To be used with jquery.meanmenu.js by Chris Wharton (http://www.meanthemes.com/plugins/meanmenu/)
####################################################################### */

/* Basic CSS + Original CSS */
header{
position: fixed;
top:0;
width:100%;
height:72px;
z-index: 60;
display: block;
background:#fff;
}
header nav {position: relative;}
header nav ul li:first-child {margin-left: 0;}
header nav ul{
box-sizing: border-box;
width: 100%;
display:flex;
justify-content: flex-end;
align-items: center;
background:#fff;
}
header nav ul li a {
text-decoration: none;
color: #161616;
display: block;
padding:24px 15px;
font-size:1.4rem;
}
header nav ul li a:hover{color:#D82425;}
header nav ul li.current a span{color:#161616;font-weight:600;}
header nav ul li.current_page_item a{font-weight:600;}
header nav ul li.subbtn a{display: block;padding:15px 13px;}
header nav ul li.subbtn a.en{
font-size:1.4rem;
color:#D82425;
font-weight: 600;
background:#EFEFEF;
width: 72px;
height: 72px;
display: flex;
align-items: center;
justify-content: center;
}
header nav ul li.subbtn a.en:hover{color:#ccc;text-decoration: underline;}
header nav ul li.subbtn a.en .fa-globe-americas{font-size:2rem;margin-bottom:5px;}
header nav ul li.subbtn div.search-open{
background: #EFEFEF;
color: #D82425;
text-align: center;
font-size:1.2rem;
font-weight: 600;
width: 72px;
height: 72px;
display: flex;
align-items: center;
justify-content: center;
}
header nav ul li.subbtn div.search-open:hover{color:#ccc;}
header nav ul li.subbtn div.search-open span{display: block;}
.logo{
position: absolute;
top: 0;
bottom: 0;
z-index: 70;
padding: 0 20px;
max-width: 145px;
overflow: hidden;
align-items: center;
display: flex;
}
.logo img{width:100%;display: block;}
.logo a{display: block;}
/* when under viewport size, .mean-container is added to body */
.mean-container{width:100%;}
.mean-container .mean-bar{
position: relative;
width: 100%;
z-index:1;
}

.meanmenu-reveal,
.meanmenu-reveal span{
display: inline-block;
transition: all .4s;
box-sizing: border-box;
}
.meanmenu-reveal {
position: absolute;
z-index: 9;
text-align: center;
font-size: 2.4rem;
}
.meanmenu-reveal span {
color: #161616;
padding:20px;
}
.meanmenu-reveal span::before{
font-family: 'Material Symbols Sharp';
content: "\e5d2";
}
/*Close Animation*/
.meanmenu-reveal.meanclose span::before{
font-family: 'Material Symbols Sharp';
content: "\e5cd";
}
/* .meanmenu-reveal.meanclose{
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
} */

.mean-container .mean-nav {
position: fixed;
width: 100%;
top:72px;
z-index: 50;
overflow-y: scroll;
overflow-x: hidden;
-webkit-overflow-scrolling: touch;
-overflow-scrolling: touch;
box-sizing: border-box;
background:#fff;
margin:0;
z-index:1000000;
}

.mean-container .mean-nav ul {
padding: 0 0 75px;
margin: 0;
display: block;
}

.mean-container .mean-nav ul li.sublist_navi a.mean-expand{display: none !important;}
.mean-container .mean-nav ul li ul.navsub{
display: grid !important;
grid-template-columns: auto 1fr auto!important;
}

.mean-container .mean-nav ul li  ul {display: block;padding:0;}

.mean-container .mean-nav ul li {
position: relative;
width: 100%;
border-top: 1px solid #cccccc;
line-height:1.6;
}
.mean-container .mean-nav ul li a {
display: block;
padding: 25px 0px;
margin: 0;
text-align: left;
color: #161616;
text-decoration: none;
text-transform: uppercase;
z-index: 8;
font-size: 1.6rem;
}

.mean-container .mean-nav ul li a span.naviname{
padding-left: 15px;
}

.mean-container .mean-nav ul li.subbtn{
display:-webkit-box;
display:-ms-flexbox;
display:flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
}

.mean-container .mean-nav ul li.subbtn.s_bt{
height:72px;
background:#EFEFEF;
}

.mean-container .mean-nav ul li.subbtn a{padding:0;}
.mean-container .mean-nav ul li.subbtn a:hover{background:#EFEFEF;}

.mean-container .mean-nav ul li li a {
display: block;
width: auto;
padding:25px 30px;
opacity: 0.85;
filter: alpha(opacity=85);
text-shadow: none !important;
visibility: visible;
color: #161616;
z-index: 10;
}
.mean-container .mean-nav ul li li a{display: block;}
.mean-container .mean-nav ul li.mean-last a {
border-bottom: none;
margin-bottom: 0;
}

.mean-container .mean-nav ul li a:hover {
background: #252525;
background: rgba(255,255,255,0.1);
}

.mean-container .mean-nav ul li a.mean-expand {
text-align: center;
position: absolute;
right: 0;
top: 0;
z-index: 0;
font-weight: 700;
background:#efefef;
width: 60px;
border-left: 1px solid #cccccc;
line-height: 1.4;
}

.mean-container .mean-nav ul li a.mean-expand::after{
font-family: 'Material Symbols Sharp';
content: "\e145";
font-size:1.8rem;
font-weight:600;
}

.mean-container .mean-nav ul li a.mean-expand.mean-clicked::after{
font-family: 'Material Symbols Sharp';
content: "\e15b";
font-size:1.8rem;
font-weight:600;
}

.mean-container .mean-push {
float: left;
width: 100%;
padding: 0;
margin: 0;
clear: both;
}

.mean-nav .wrapper {
width: 100%;
padding: 0;
margin: 0;
}

/* Fix for box sizing on Foundation Framework etc. */
.mean-container .mean-bar, .mean-container .mean-bar * {
-webkit-box-sizing: content-box;
-moz-box-sizing: content-box;
box-sizing: content-box;
}

/*/ Contact area */

header nav ul li.subbtn .contact_icon a{
color:#D82425;
background:#EFEFEF;
width: 72px;
height: 72px;
display: flex;
align-items: center;
justify-content: center;
}
header nav ul li.subbtn .contact_icon a:hover{color:#ccc;}
header nav ul li.subbtn div.contact_icon a::before{
font-family: 'Material Symbols Sharp';
content: "\e158";
font-size:2em;
}

/*/ SEARCH area */
header nav ul li.subbtn div.search-open{
cursor: pointer;
}
header nav ul li.subbtn div.search-open::before{
font-family: 'Material Symbols Sharp';
content: "\e8b6";
font-size:2em;
}
header nav ul li.subbtn div.search-open.btnactive::before{
font-family: 'Material Symbols Sharp';
content: "\ea76";
font-size:2em;
}
#search-wrap{
position:absolute;
top:150px;
right:0px;
z-index: -1;
opacity: 0;
width:0;
transition: all 0.4s;
}
#search-wrap.panelactive{
opacity: 1;
z-index: 3;
width:600px;
padding:20px;
top:72px;
right:0;
background:#eee;
}
#search-wrap #searchform{
display: none;
}
#search-wrap.panelactive #searchform{
display:flex;
justify-content: center;
align-items: center;
background: #161616;
border-radius: 8px;
}
#search-wrap input{
outline: none;
cursor: pointer;
color: #161616;
}
#search-wrap input[type="text"] {
width: 100%;
border: none;
border-bottom:2px solid #ccc;
transition: all 0.5s;
letter-spacing: 0.05em;
height:60px;
padding: 10px;
background: #fff;
text-align: left;
}
#search-wrap input[type="text"]:focus {color:#161616;}
#search-wrap input[type="submit"] {
background:url("../img/common/search.svg") no-repeat right;
background-size: 20px 20px;
background-position: center center;
width: 60px;
height: 60px;
}



/* footer Navigation */
#page_top{
position: fixed;
bottom:3%;
right: 20px;
z-index: 5;
}
#page_top a.page_btn{
width:60px;
height:60px;
line-height: 60px;
background: #D82425;
box-shadow: 1px 1px 8px -3px #c0c0c0;
text-align: center;
text-decoration: none;
color:#fff;
border-radius:50%;
display: block;
position: relative;
}

#page_top a.page_btn::before{
font-family: 'Material Symbols Sharp';
content: "\e25a";
font-size:2.8rem;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
}

#page_top a.page_btn:hover{
background:#7c7c7c;
}

#page_top a.snsb1,
#page_top a.snsb2{
display: block;
width:40px;
height:auto;
}

#page_top a.snsb1:hover,
#page_top a.snsb2:hover{
opacity:0.7;
}

#page_top a.snsb1 img,
#page_top a.snsb2 img{
display: block;
width:100%;
}

#page_top a.snsb1{
margin:0 auto 15px;

}
#page_top a.snsb2{
margin:0 auto 15px;
border-bottom: 2px solid #ccc;
padding: 0 0 15px;
}

footer{
width:auto;
padding:40px 0;
margin:0 40px;
border-top:1px solid #CCCCCC;
}

#footer .footer_copy{
padding:20px 0;
text-align: center;
border-top:1px solid #CCCCCC;
border-bottom:1px solid #CCCCCC;
}

#footer .footer_copy small{
color:#161616;
font-size:1.4rem;
}

#footer .footer_sitemap_2 .ft_box div.tit02{
margin-bottom:10px;
font-size:1.2rem;
line-height:1.4;
}
#footer .footer_sitemap_2 .ft_box div.tit02 a{
font-size:1.4rem;
color:#161616;
display: block;
}
#footer .footer_sitemap_2 .ft_box div.tit02 a:hover{text-decoration: underline;}
#footer .footer_Bnr ul li{margin-bottom:20px;}
#footer .footer_Bnr ul li a{
display: block;
position: relative;
z-index: 0;
-webkit-transition: all .3s;
transition: all .3s;
}
#footer .footer_Bnr ul li:nth-child(2) a{border:1px solid #ccc;}
#footer .footer_Bnr ul li a:hover{opacity: 0.7;}
#footer .footer_Bnr ul li a img{display: block;height:70px;}


/* breadcrumbs */
.breadcrumbs{
font-size: 1.4rem;
margin: 20px 40px;
display: flex;
align-items: center;
flex-wrap: wrap;
gap: 10px;
}
.breadcrumbs span a{
color:#666666;
display: inline-block;
font-weight:400;
}
.breadcrumbs span a:hover{text-decoration: underline;}
.breadcrumbs span.current-item{font-weight:600;}
.breadcrumbs .material-symbols-sharp{color:#D82425;}

/* SideNavi layout
-----------------------------------------*/
.page_ft_con{
width:auto;
height:1px;
background:#CCCCCC;
margin:0 40px;
}

.page_ft_con .page_navi{
font-size:1.4rem;
max-width:1180px;
margin:0 auto 50px;
}

.page_ft_con .page_navi .navitit{display: none;}

.page_ft_con .page_navi ul{
display: flex;
flex-wrap: wrap;
justify-content: center;
}

.page_ft_con .page_navi ul li{
width:100%;
margin:0 0 20px;
}

.page_ft_con .page_navi ul li a{
position: relative;
display: block;
background:#FFFFFF;
padding:20px 35px 20px 20px;
display:-webkit-box;
display:-ms-flexbox;
display:flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
height:100%;
border: 3px solid #7c7c7c;
}

.page_ft_con .page_navi ul li a::before{
font-family: 'Material Symbols Sharp';
content: "\eaaa";
position: absolute;
right:10px;
font-size:2.4rem;
}
.page_ft_con .page_navi ul li ul.sub-menu{display: none;}


/* SP Layout
-----------------------------------------*/
@media print, screen and (max-width:1023px) {
#page_top a.page_btn{width:40px;height:40px;line-height: 40px}
#page_top a.page_btn::before{font-size:2.0rem;}

/* Global Navigation */
header{width:100%;margin:0;}
.logo{}
.mean-container .mean-nav .search-open{display: none;}
.mean-container .mean-nav #search-wrap{
position: static;
top: 0;
right: 0;
z-index: 0;
opacity: 1;
width: 100%;
margin:0 20px;
}
.mean-container .mean-nav #search-wrap #searchform{
display: flex;
border-radius: 8px;
background:#161616;
}
#search-wrap input[type="text"]{
width:80%;
font-size: 1.6rem;
height:auto;
padding: 10px 20px;
}
.mean-container .mean-nav ul li.subbtn.s_bt,
header nav ul li.subbtn .contact_icon a,
header nav ul li.subbtn a.en{height:90px;}

/* footer Navigation */
footer{margin:0 20px;}
#footer .footer_sitemap{display: none;}
#footer .footer_Bnr{padding:0 0 40px;}
#footer .footer_Bnr ul{
display: flex;
flex-wrap: wrap;
gap:10px;
justify-content: center;
}
#footer .footer_Bnr ul li a img{
height: 60px;
width: auto;
object-fit: contain;
display: block;
}
#footer .footer_sitemap_2{padding:40px 0;}
#footer .footer_sitemap_2 .ft_box{
display: grid;
gap: 10px;
grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
justify-content: center;
text-align: center;
}

/* breadcrumbs */
.breadcrumbs{margin:20px;}
}


/* PC Layout
-----------------------------------------*/
@media print, screen and (min-width:1024px) {
/* Global Navigation */
header nav ul li ul {display: none;}
header nav ul li{position: relative; z-index:1;}
header nav ul li ul li a{padding:15px 20px;}
header nav ul li.c_navi ul.c_subnv,
header nav ul li.m_navi ul.m_subnv,
header nav ul li.b_navi ul.b_subnv,
header nav ul li.p_navi ul.p_subnv,
header nav ul li.i_navi ul.i_subnv,
header nav ul li.n_navi ul.n_subnv{
display: block;
width:auto;
margin:0;
padding: 10px 20px;
background:#EFEFEF;
position: fixed;
visibility: hidden;
opacity: 1;
box-sizing: border-box;
z-index: 3;
display:-webkit-box;
display:-ms-flexbox;
display:flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
position:flex;
left:0;
right:0;
z-index: 6;
}
header nav ul li.c_navi a.navtit::before,
header nav ul li.m_navi a.navtit::before,
header nav ul li.b_navi a.navtit::before,
header nav ul li.p_navi a.navtit::before,
header nav ul li.i_navi a.navtit::before,
header nav ul li.n_navi a.navtit::before{
content:"";
border-right: 10px solid transparent;
border-left: 10px solid transparent;
border-bottom: 10px solid #EFEFEF;
position: absolute;
bottom:0px;
left:40%;
visibility: hidden;
opacity: 1;
}

header nav ul li:hover.c_navi a.navtit::before,
header nav ul li:hover.m_navi a.navtit::before,
header nav ul li:hover.b_navi a.navtit::before,
header nav ul li:hover.p_navi a.navtit::before,
header nav ul li:hover.i_navi a.navtit::before,
header nav ul li:hover.n_navi a.navtit::before{
visibility: visible;
opacity: 1;
}

header nav ul li:hover.c_navi ul.c_subnv,
header nav ul li:hover.m_navi ul.m_subnv,
header nav ul li:hover.b_navi ul.b_subnv,
header nav ul li:hover.p_navi ul.p_subnv,
header nav ul li:hover.i_navi ul.i_subnv,
header nav ul li:hover.n_navi ul.n_subnv{
visibility: visible;
opacity: 1;
}

header nav ul li:hover.c_navi ul.c_subnv li a,
header nav ul li:hover.m_navi ul.m_subnv li a,
header nav ul li:hover.b_navi ul.b_subnv li a,
header nav ul li:hover.p_navi ul.p_subnv li a,
header nav ul li:hover.i_navi ul.i_subnv li a,
header nav ul li:hover.n_navi ul.n_subnv li a{
text-align: left;
color:#161616;
}

header nav ul li:hover.c_navi ul.c_subnv li a:hover,
header nav ul li:hover.m_navi ul.m_subnv li a:hover,
header nav ul li:hover.b_navi ul.b_subnv li a:hover,
header nav ul li:hover.p_navi ul.p_subnv li a:hover,
header nav ul li:hover.i_navi ul.i_subnv li a:hover,
header nav ul li:hover.n_navi ul.n_subnv li a:hover{
text-decoration: underline;
}

header nav ul li.current_page_item a,
header nav ul li.current-page-ancestor a{text-decoration: underline;}

header nav ul li ul li a span.navinamesub{font-size:1.4rem;}
header nav ul li ul li a span.navinamesub::before {
font-family: "Font Awesome 5 Free";
content: "\f105";
font-weight: 900;
font-size: 1.6rem;
margin-right: 3px;
color: #161616;
display: inline-block;
}
header nav ul li ul.navsub{
display: grid;
/*grid-template-columns: repeat(3, 1fr);*/
grid-template-columns: repeat(2, 1fr);
}

/* footer Navigation */
#footer .ft_sitemapInner{
max-width:1180px;
margin:0 auto;
display: grid;
grid-template-columns:auto 35%;
gap:20px;
padding:60px 0;
}
#footer .footer_sitemap_lt{
display: flex;
flex-wrap: wrap;
gap:40px;
}

#footer .footer_sitemap .ft_box{margin-bottom:30px;}
#footer .footer_sitemap .ft_box div.tit,
#footer .footer_sitemap .ft_box div.tit a{
font-size:1.4rem;
line-height:1.4;
margin-bottom:15px;
display: block;
font-weight:600;
}
#footer .footer_sitemap .ft_box div.tit a:hover{
text-decoration: underline;
}
#footer .footer_sitemap .ft_box ul.ft_list{
display: flex;
gap:20px;
flex-wrap: wrap;
}
#footer .footer_sitemap .ft_box ul.ft_list li{margin-bottom:10px;}
#footer .footer_sitemap .ft_box ul.ft_list li a{
font-size:1.2rem;
color:#161616;
display: block;
line-height:1.4;
}
#footer .footer_sitemap .ft_box ul.ft_list li a:hover{
text-decoration: underline;
}

/* SideNavi layout
-----------------------------------------*/
.page_ft_con .page_navi ul li{
width:31%;
margin:0 10px 20px;
}
}