/*# PC用メニュー　全体 */

.pc-nav-w {
    width: 100%;
	background-color: #fff;
	position:fixed;
	z-index: 1000;
	top: 0;
}

.pc-nav {
    width: 100%;
	height: 116px;
	background-color: #fff;
	position:relative;
}

@media screen and (max-width:1300px) {
	
.pc-nav {
	height: 95px;
}
	
}

@media screen and (max-width:1100px) {
	
.pc-nav {
	height: 70px;
}
	
}

/*# PC用メニュー、細かい設定 */

.pc-nav01 {
	font-size: 0;
	position:absolute;
	left: 35px;
	top: 50%;
	transform: translateY(-50%);
	-webkit- transform: translateY(-50%);
}

.pc-nav01 h1.p-h-logo1 {
    width: 136px;
	display: inline-block;
	vertical-align:middle;
}

@media screen and (max-width:1200px) {
	
.pc-nav01 {
	left: 20px;
}

.pc-nav01 h1.p-h-logo1 {
    width: 100px;
}
	
}

@media screen and (max-width:992px) {
	
.pc-nav01 {
	left: 20px;
	top: 12px;
	transform: none;
	-webkit- transform: none;
}
	
}

ul.pc-nav02 {
	position:absolute;
	top: 25px;
	right: 600px;
}

ul.pc-nav02 li {
	display: inline-block;
	font-family: 'Noto Sans JP', sans-serif;
	font-size: 1.4rem;
	letter-spacing: 1px;
	font-weight: 300;
}

ul.pc-nav02 li a {
	padding: 10px 20px;
}

ul.pc-nav02 li a span {
	position:relative;
}

ul.pc-nav03 {
	position:absolute;
	top: 70px;
	right: 10px;
}

ul.pc-nav03 li {
	display: inline-block;
	font-family: 'Noto Sans JP', sans-serif;
	font-size: 1.6rem;
	letter-spacing: 2px;
	font-weight: 400;
}

ul.pc-nav03 li a {
	padding: 10px 30px;
}

ul.pc-nav03 li a span {
	position:relative;
}

.pc-nav04 {
	position:absolute;
	top: 20px;
	right: 260px;
}

.pc-nav05 {
	position:absolute;
	top: 22px;
	right: 107px;
}

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

ul.pc-nav02 {
	top: 25px;
	right: 600px;
}

ul.pc-nav02 li {
	font-size: 1.3rem;
}
	
ul.pc-nav02 li a {
	padding: 5px 10px;
}

ul.pc-nav03 {
	top: 70px;
	right: 10px;
}

ul.pc-nav03 li {
	font-size: 1.4rem;
}
	
ul.pc-nav03 li a {
	padding: 8px 20px;
}
	
}

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

ul.pc-nav02 {
	top: 20px;
	right: 550px;
}
	
ul.pc-nav02 li a {
	padding: 5px 7px;
}
	
ul.pc-nav03 {
	top: 58px;
	right: 0px;
}
	
ul.pc-nav03 li a {
	padding: 8px 15px;
}
	
.pc-nav04 {
	top:13px;
	right: 230px;
}
	
.pc-nav05 {
	top: 17px;
	right: 80px;
}
	
}

@media screen and (max-width:1100px) {
	
ul.pc-nav02 {
	display: none;
}
	
ul.pc-nav03 {
	display: none;
}
	
.pc-nav04 {
	display: none;
}
	
.pc-nav05 {
	display: none;
}
	
}

.pn-mod {
    width: 180px;
	height: 30px;
	display: inline-block;
	position:relative;
	transition: .7s;
	background-color: var(--thema-color01);
	border-radius: 15px;
}

.pn-on {
    width: 140px;
	height: 30px;
	display: inline-block;
	position:relative;
	transition: .7s;
	background-color: var(--thema-color01);
	border-radius: 15px;
	margin-left: 10px;
}

.pn-mod .img,
.pn-on .img {
    /* アイコンを白に */
    filter: invert(100%) sepia(0%) saturate(7492%) hue-rotate(120deg) brightness(107%) contrast(101%);
    width: 18px;
	position:absolute;
	right: 10px;
	top: 50%;
	transform: translateY(-50%);
	-webkit- transform: translateY(-50%);
  fill: #fff;
}

.pn-mod span,
.pn-on span {
	position:absolute;
	left: 10px;
	top: 50%;
	transform: translateY(-50%);
	-webkit- transform: translateY(-50%);
	color: #ffffff;
	font-family: 'Noto Sans JP', sans-serif;
	font-weight: 700;
	font-size: 1.2rem;
	line-height: 1.2;
	letter-spacing: 1px;
}

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

.pn-mod {
    width: 170px;
	height: 25px;
}

.pn-on {
    width: 130px;
	height: 25px;
	margin-top: 5px;
}

.pn-mod .img,
.pn-on .img {
    width: 16px;
	right: 8px;
}

.pn-mod span,
.pn-on span {
	font-size: 1.1rem;
}
	
}

.pn-ref {
	width: 117px;
	text-align: center;
	position:relative;
	font-size: 0;
}

.pn-ref img {
	display: block;
	margin: 0px;
	padding: 0px;
}

.pn-ref span {
	display: inline-block;
	line-height: 1;
	font-size: 1.2rem;
	color: #e5002c;
	border : solid 1px #e5002c;
	padding: 3px 13px;
	border-radius: 10px;
	margin-top: 10px;
}

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

.pn-ref {
	width: 130px;
}
	
.pn-ref span {
	font-size: 1.1rem;
	padding: 3px 8px;
}
	
}

/* レスポンシブ調節不要 */

/* マウススクロールで下線出す */
ul.pc-nav02 li a span:after,
ul.pc-nav03 li a span:after {
position: absolute;
left: 0;
content: '';
width: 100%;
height: 1px;
background: #999999;
bottom: -3px;               /*アンダーラインがaタグの下端から現れる*/
transform: scale(0, 1);     /*アンダーラインの縮尺比率。ホバー前はx方向に0*/
transform-origin: left top; /*変形（アンダーラインの伸長）の原点がaタグ（各メニュー）の左端*/
transition: transform 0.3s; /*変形の時間*/
}

ul.pc-nav03 li + li {
	border-left-width: 1px;
	border-left-style: solid;
	border-left-color: #E8E6DF;
}

ul.pc-nav02 a:link,
ul.pc-nav02 a:visited,
ul.pc-nav02 a:active,
ul.pc-nav03 a:link,
ul.pc-nav03 a:visited,
ul.pc-nav03 a:active {color: #595959; text-decoration: none;} 

ul.pc-nav02 a:hover,
ul.pc-nav03 a:hover {}

ul.pc-nav02 li a span:hover:after,
ul.pc-nav03 li a span:hover:after {
transform: scale(1, 1);     /*ホバー後、x軸方向に1（相対値）伸長*/
}

.pn-mod a,
.pn-on a {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 2; /* 必要であればリンク要素の重なりのベース順序指定 */
}

.pn-mod:hover,
.pn-on:hover {
    opacity:0.7;
}

.pn-mod:hover span,
.pn-on:hover span {
	color: #fff;
}

.pn-mod:hover .img,
.pn-on:hover .img {
    /* アイコンを赤に
    filter: invert(14%) sepia(65%) saturate(3684%) hue-rotate(337deg) brightness(100%) contrast(96%); */
}

.pn-ref a {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 2; /* 必要であればリンク要素の重なりのベース順序指定 */
}

.pn-ref:hover span {
	color: #fff;
	background-color: #e5002c;
}


/*# スマホ、下メニュー */

.sp-nav {
	display: none;
}

@media screen and (max-width:1100px) {
	
.sp-nav {
	display: block;
    width: 100%;
	font-size: 0;
}
	
.sp-nav01 a {
    width: 25%;
	display: inline-block;
	vertical-align:middle;
	text-align: center;
	padding: 10px 2px;
	position:relative;
	font-family: 'Noto Sans JP', sans-serif;
	font-size: 1.3rem;
	line-height: 1.3;
	font-weight: 300;
	letter-spacing: 1px;
	color: #595959;
	background-color: #E8E6DF;
}

.sp-nav01 a:before {
  content: "";
	position:absolute;
	top: 15px;
	bottom: 15px;
	left: 0px;
	border-left-width: 1px;
	border-left-style: solid;
	border-left-color: #b2b2b2;
}
	
.sp-nav01 a:first-child:before {
	border-left-width: 0px;
	border-left-style: none;
}


.sp-nav01 a:link,
.sp-nav01 a:visited,
.sp-nav01 a:active {
	color: #595959;
	text-decoration: none;
} 

.sp-nav01 a:hover {opacity:0.7;}
	
}

@media screen and (max-width:768px) {
	
.sp-nav01 a {
	padding: 10px 1px;
	font-size: 1.2rem;
}
	
}

@media screen and (max-width:568px) {
	
.sp-nav01 a {
	font-size: 1rem;
}
	
}




/*# ハンバーガークリック後のメニュー */

body.is-fixed .nav--typeA {
	position: fixed;
	top: 0;
	left: 0;
	z-index: 1000;
}
	
.fullscreenmenu{
    display: block;
	margin-top: 0px;
	margin-bottom: 0px;
}

.nav-erea{
	position:relative;
    width: 100%;
	background-color: #fff;
	vertical-align:top;
	border-top-width: 1px;
	border-top-style: solid;
	border-top-color: #000000;
	font-size: 0;
	padding: 70px 70px;
}

.nav1{
	position:relative;
    width: 70%;
	display: inline-block;
	vertical-align:top;
}

.nav2{
	position:relative;
    width: 28%;
	display: inline-block;
	vertical-align:top;
	margin-left: 2%;
}

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

.nav-erea{
	padding: 30px 50px;
}
	
.nav1{
    width: 78%;
}

.nav2{
    width: 20%;
}
	
}

@media screen and (max-width:1100px) {
	
.nav-erea{
	padding: 20px 30px 110px;
  height:100%;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
}
	
.nav1{
    width: 100%;
	height: auto;
}

.nav2{
    width: 60%;
	height: auto;
	margin-top: 20px;
	margin-bottom: 100px;
	margin-left: 0;
}
	
}

@media screen and (max-width:768px) {
	
.nav2{
    width: 100%;
	margin-top: 20px;
	margin-bottom: 50px;
}
	
}

ul.hm-main1{
    width: 23%;
	position:relative;
	display: inline-block;
	vertical-align:top;
}

ul.hm-main1 + ul.hm-main1 {
	margin-left: 50px;
}

ul.hm-main1 li{
	color: #000000;
	font-size: 1.5rem;
	line-height: 2.5;
	position:relative;
	letter-spacing: 1px;
	font-weight: 300;
}

ul.hm-main1 li:after {
  content: "";
  display: inline-block;
  width: 40px;
  height: 6px;
  background: url(../img/arrow-3.svg) no-repeat;
  background-size: contain;
  position: absolute;
  right: 0;
	top: 50%;
	transform: translateY(-50%);
	-webkit- transform: translateY(-50%);
}

ul.hm-main1 li.logo {
	padding-top: 0px;
	padding-bottom: 20px;
}

ul.hm-main1 li .hm-sub1 li:after,
ul.hm-main1 li.logo:after,
ul.hm-main1 li.sub:after {
  background: url(../img/non.png) no-repeat;
  width: 0px;
  height: 0px;
}

ul.hm-main1 li a {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 2; /* 必要であればリンク要素の重なりのベース順序指定 */
}

ul.hm-main1 li a:hover {
    filter:alpha(opacity=70);/* IE 6,7*/
    -ms-filter: "alpha(opacity=70)";/* IE 8,9 */
    -moz-opacity:0.7;/* FF , Netscape */
    -khtml-opacity: 0.7;/* Safari 1.x */
    opacity:0.7;
    zoom:1;/*IE*/
}

ul.hm-main1 li .hm-sub1 li{
	color: #666666;
	font-size: 1.4rem;
	line-height: 2;
	position:relative;
	letter-spacing: 1px;
	font-weight: 300;
}

.nav1 .l1,
.nav1 .l2{
	display: inline-block;
    width: 1px;
	height: 300px;
	background-color: #000000;
	margin-right: 50px;
	margin-left: 50px;
}

@media screen and (max-width:1500px) {
	
ul.hm-main1{
    width: 23%;
}

ul.hm-main1 + ul.hm-main1 {
	margin-left: 30px;
}
	
ul.hm-main1 li{
	font-size: 1.4rem;
}

ul.hm-main1 li:after {
  width: 27px;
  height: 4px;
  right: 0;
	top: 50%;
	transform: translateY(-50%);
	-webkit- transform: translateY(-50%);
}

.nav1 .l1,
.nav1 .l2{
    width: 1px;
	height: 300px;
	background-color: #000000;
	margin-right: 30px;
	margin-left: 30px;
}

}

@media screen and (max-width:1100px) {
	
ul.hm-main1{
    width: 28%;
}
	
ul.hm-main1 li.logo {
    width: 80%;
}
	

	
.nav1 .l1{
    width: 1px;
	height: 300px;
	background-color: #000000;
	margin-right: 30px;
	margin-left: 30px;
}
	
.nav1 .l2{
	display: none;
}
	
}

@media screen and (max-width:768px) {
	
ul.hm-main1{
    width: 100%;
}
	
ul.hm-main1 + ul.hm-main1 {
	margin-top: 0px;
	margin-left: 0px;
}
	
ul.hm-main1 li{
	font-size: 1.5rem;
	line-height: 1.2;
	position:relative;
	padding-top: 15px;
	padding-bottom: 15px;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #000000;
}
	
ul.hm-main1 li .hm-sub1 li,
ul.hm-main1 li.logo,
ul.hm-main1 li.sub {
	border-bottom-width: 0;
	border-bottom-style: none;
	border-bottom-color: #000000;
}
	
ul.hm-main1 li.sub {
	display: none;
}
	
ul.hm-main1 li.logo {
	padding-top: 15px;
	padding-bottom: 0px;
}

ul.hm-main1 li:after {
  content: "";
  display: inline-block;
  width: 40px;
  height: 6px;
  background: url(../img/arrow-3.svg) no-repeat;
  background-size: contain;
  position: absolute;
  right: 0;
	top: 50%;
	transform: translateY(-50%);
	-webkit- transform: translateY(-50%);
}
	
ul.hm-main1 li .hm-sub1 li{
	color: #666666;
	font-weight: 400;
	font-size: 1.4rem;
	line-height: 2;
	position:relative;
}
	
ul.hm-main1 li.logo {
    width: 30%;
}
	
.nav1 .l1{
    width: 100%;
	height: 1px;
	background-color: #ffffff;
	margin-top: 30px;
	margin-right: 0px;
	margin-left: 0px;
}
	
}

.hm-model-t{
	font-size: 1.5rem;
	letter-spacing: 1px;
	font-weight: 300;
}

ul.hm-model1{
    width: 100%;
	position:relative;
	display: block;
	vertical-align:top;
	margin-top: 10px;
}

ul.hm-model1 li{
    width: 28%;
	position:relative;
	display: inline-block;
	vertical-align:top;
}

ul.hm-model1 li:nth-child(2),
ul.hm-model1 li:nth-child(3){
	margin-left: 8%;
}

ul.hm-model1 li:nth-child(4),
ul.hm-model1 li:nth-child(7){
	margin-top: 10px;
}

ul.hm-model1 li:nth-child(5),
ul.hm-model1 li:nth-child(6),
ul.hm-model1 li:nth-child(8),
ul.hm-model1 li:nth-child(9){
	margin-top: 10px;
	margin-left: 8%;
}

ul.hm-model1 img.ph{
	border-radius: 10px;
}

ul.hm-model1 img.logo{
	width: 80%;
	margin-right: auto;
	margin-left: auto;
}

ul.hm-model1 li a {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 2; /* 必要であればリンク要素の重なりのベース順序指定 */
}
ul.hm-model1 li:hover {
    filter:alpha(opacity=70);/* IE 6,7*/
    -ms-filter: "alpha(opacity=70)";/* IE 8,9 */
    -moz-opacity:0.7;/* FF , Netscape */
    -khtml-opacity: 0.7;/* Safari 1.x */
    opacity:0.7;
    zoom:1;/*IE*/
}

@media screen and (max-width:1500px) {
	
ul.hm-model1 li{
    width: 32%;
	position:relative;
	display: inline-block;
	vertical-align:top;
}

ul.hm-model1 li:nth-child(2),
ul.hm-model1 li:nth-child(3){
	margin-left: 2%;
}

ul.hm-model1 li:nth-child(4),
ul.hm-model1 li:nth-child(7){
	margin-top: 10px;
}

ul.hm-model1 li:nth-child(5),
ul.hm-model1 li:nth-child(6),
ul.hm-model1 li:nth-child(8),
ul.hm-model1 li:nth-child(9){
	margin-top: 10px;
	margin-left: 2%;
}
	
}

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



}


/* ハンバーガーのボタン部分と開閉アニメーション*/

.navimenu,
    .navimenu span {
    display: inline-block;
    -webkit-transition:all .4s;
    transition: all .4s;
    }

    .navimenu {
      position: fixed;
      top: 12px;
      right:  30px;
      width: 43px;
      height: 43px;
      z-index: 15000;
	cursor: pointer;
	background-color: #E8E6DF;
	border-radius: 5px;
    }

    .navimenu span {
    position: absolute;
    left: 8px;
    right: 8px;
    width: 27px;
    height: 1px;
    background-color: #595959;
    z-index: 1500;
    }

    .navimenu span:nth-of-type(1) {
    top: 12px;
    }

    .navimenu span:nth-of-type(2) {
    top: 21px;
    }

    .navimenu span:nth-of-type(3) {
    top: 30px;
    }

    .navimenu.active span:nth-of-type(1) {
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    background-color: #595959;
    top: 21px;
    }

    .navimenu.active span:nth-of-type(2) {
    opacity: 0;
    background-color: #fff;
    }

    .navimenu.active span:nth-of-type(3) {
    -webkit-transform: rotate(135deg);
    transform: rotate(135deg);
    background-color: #595959;
    top: 21px;
    }

@media screen and (max-width:1300px) {
	
    .navimenu {
      top: 11px;
      right:  10px;
      width: 43px;
      height: 43px;
    }
	
}

@media screen and (max-width:1100px) {
	
    .navimenu {
      width: 70px;
      height: 70px;
      top: 0px;
      right:  0px;
	background-color: #fff;
    }
	
    .navimenu span {
    left: 21px;
    right: 21px;
    width: 28px;
    }

    .navimenu span:nth-of-type(1) {
    top: 25px;
    }

    .navimenu span:nth-of-type(2) {
    top: 34px;
    }

    .navimenu span:nth-of-type(3) {
    top: 43px;
    }

    .navimenu.active span:nth-of-type(1) {
    top: 34px;
    }

    .navimenu.active span:nth-of-type(3) {
    top: 34px;
    }
	
}

/* ハンバーガークリック後、開閉する動き */

    #nav {
    position: fixed;
    top: 116px;
    right: 0;
    z-index: 14000;
    width: 100%;
    height: 100vh;
    opacity: 0;
    background: rgba(0,0,0,0.5);
    transition: all 0.3s ease-in-out;
    visibility:hidden;
    }

    #nav.active{
    right: 0;
    opacity: 1;
    -moz-transform: translateX(0);
    -webkit-transform: translateX(0);
    transform: translateX(0);
    visibility: visible;
    }


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

    #nav {
    top: 95px;
    }
	
}

@media screen and (max-width:1100px) {
	
    #nav {
    top: 70px;
    }
	
}