

.textEffect {overflow:hidden;}
/*  ============ // header START ~ ============*/
html, p, div {
	font-family: "helvetica-lt-pro"!important; font-weight:400;
}


header#header {
    width: 100%;
    position: fixed;
    top: 0;
    padding: 0 8rem;
    background: #FFF;
    min-height: 12.5rem;
}
.headerInner {
    width: 100%;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
}
.headerLeft {display:flex;  align-items: flex-start;}
.headerLogo {
    width: 16rem;
    margin-right: 4.5rem;
    margin-top: 4.5rem;
}
.headerLogo img {width:100%; height:auto;}


.hMenu {display:flex;}
.hMenu li {width: 17.5rem; padding: 5.5rem 0 0; transition: all 0.3s ease-in-out;}
.hMenu li .hmenuT {
    font-family: "helvetica-lt-pro";
    font-size: 2.2rem;
    letter-spacing: -0.02em;
    color: #222;
    font-weight: 400;
    text-align: center;
    padding-bottom: 3rem;
	position:relative;
}

.hMenu li .hmenuT::before {
    content: '';
    width: 0%;
    height: 2px;
    background: #f14950;
    left: 50%;
    bottom: 0;
    position: absolute;
    transform: translateX(-50%);
	transition: all 0.3s ease-in-out;

}
.hMenu li:hover .hmenuT::before {width:100%;}
.hMenu li .hmenuT {font-family: "helvetica-lt-pro"; font-weight:500;}

.hMenu li:hover .menuDepth02 {height:100%; 	transition: all 0.3s ease-in-out;}


header#header:hover {box-shadow: 0 5px 13px rgb(198 198 198 / 70%);}

.hMenu li:hover:nth-child(1) {padding-bottom:0;}
.hMenu li:hover:nth-child(4) {padding-bottom:0;}


.menuDepth02 p:hover {
    color: #f0454c;
    font-weight: 400;
}


.menuDepth02 {
    text-align: center;
    height: 0;
    overflow: hidden;
	padding-top: 1.25rem;
}

.menuDepth02 p {
	color:#7d7d7d;
	font-weight:300;
	font-size:1.8rem;
	letter-spacing:-0.05em;
	padding:1.25rem 0;
}

.headerRight {
    display: flex;
    align-items: center;
    gap: 2.5rem;
    margin-top: 3.7rem;
}

.homeSearch {position:relative;}
.homeSearch input {
    background: #eeeeee;
    border-radius: 30px;
    border: none!important;
    height: 5.097rem;
    width: 22.801rem;
    padding: 1rem 6rem 1rem 2rem;
    font-size: 1.8rem;
}


.searchBtn {
    width: 6rem;
    height: 100%;
    position: absolute;
    right: 0;
    top: 50%;
	border:none!important;
    transform: translateY(-50%);
    background: url(../himg/searchIcon.png) no-repeat center / contain;
	background-size:2.4rem;
}

.homePBtn {
	padding:1.8rem 3rem 2rem;
	background:#f14950;
	border-radius:30px;
	color:#fff;
	height: 5.097rem;
}


.homePBtn .homePBtnT {color:#fff; font-size: 1.7rem; text-align: center; word-break: keep-all;}
.hMenu li:hover {padding-bottom: 3.5rem; text-align: center;}
.mo_only {display: none!important;}

@media (max-width:768px) {
	.pc_only {display: none!important;}
	.mo_only {display: block!important;}
}
@media (max-width:1400px) and (min-width:678px) {
	header#header {padding:0 2rem;}
}


@media (max-width:768px) {
	header#header {padding: 0 3.91vw; min-height: unset;}
	.headerInner {padding: 5.73vw 0;}
	.headerLogo {width: 28.65vw; margin-right: 0; margin-top: 0;}
	.headerRight {gap: 4.82vw; margin-top: 0;}
	.headerRight .homeSearch  {display:none;}
	.homePBtn {padding: 2.60vw 4.30vw; height: auto;}
	.homePBtn .homePBtnT {font-size: 2.60vw;}
	.hMenu {display:none!important;}
	.moMenuBtn {width:5.99vw; cursor:pointer;}
	.moMenuBtn img {width:100%; height:auto;}
	
	
	.moMenuWrapBg {right: 0; width: 100%; position: fixed; top: 0; background: rgb(0 0 0 / 40%); height: 100vh;}
	.moMenuWrap {
		right: 0;
		width: 100%;
		position: fixed;
		top: 0;
		background: #fff;
		height:85vh;
		overflow:hidden;
		transition:all 0.5s ease-in-out;
	}
	.moMenuInner {
		padding: 15.05vw 4.95vw 14.06vw;
		height: 100%;
		overflow-y: scroll;
		position:relative;
	}
	
	.moMenuCloseBtn {
		width: 3.91vw;
		height: 4.04vw;
		position: fixed;
		top: 4.69vw;
		right: 4.95vw;
	}
	.moMenuCloseBtn img {width:100%; height:100%;}
	
	.moMenuWrapBg.mo_only, .moMenuWrap.mo_only {display:none!important;}
	.moMenuWrapBg.open, .moMenuWrap.open {display:block!important;}
	
	p.hmenuT {
		position: relative;
		font-size: 4.56vw;
		padding: 5vw 0;
		transition: all 0.3s ease-in-out;
		cursor: pointer;
		text-transform: uppercase;
	}
	.menuDepth02 {text-align: center; height: auto; overflow: hidden; padding-top:0; height:0;}
	.menuDepth02.on {padding-top: 1.25rem; height:auto;}
	.menuDepth02 p {color: #7d7d7d; font-weight: 300; font-size: 3.13vw; letter-spacing: -0.05em;  padding: 1.5vw 0; text-align: left;}
	.meMenuDepth {margin: 0;}
	.meMenuDepth:nth-child(1) {margin-top: 0;}
	
	
	.meMenuDepth:nth-child(2) .hmenuT::before, 
	.meMenuDepth:nth-child(5) .hmenuT::before	{display:none!important;}
	
	
	p.hmenuT::before {
		content: '';
		width: 3.91vw;
		height: 2.08vw;
		position: absolute;
		background: url(../himg/moMenuArrow.png) no-repeat center / contain;
		right: 0;
		top: 50%;
		transform: translateY(-50%);
		transition:all 0.3s ease-in-out;
	}
	.hmenuT.on::before {transform: translateY(-50%) rotate(180deg);}
	p.hmenuT:hover::before {transform: translateY(-50%) rotate(180deg);}
}
/*  ============ ~ header END // ============*/


/*  ============ // Footer START ~ ============*/

/*  ============ ~ Footer END // ============*/





