﻿body {
    margin: 0;    background: #efedea; font-family: "SelectaTrial", sans-serif;font-weight:normal;
}







.RhymesDisplayTrial {
    font-family: "RhymesDisplayTrial", sans-serif;
    font-weight:normal;
}
.RhymesDisplayTrial_L {
    font-family: "RhymesDisplayTrial", sans-serif;
    font-weight:100;
}
.RhymesDisplayTrial_b {
    font-family: "RhymesDisplayTrial", sans-serif;
    font-weight:bold;
}





.SelectaTrial {
    font-family: "SelectaTrial", sans-serif;
    font-weight:normal;
}
.SelectaTrial_L {
    font-family: "SelectaTrial", sans-serif;
    font-weight:100;
}
.SelectaTrial_b {
    font-family: "SelectaTrial", sans-serif;
    font-weight:bold;
}




.RhymesTextTrial {
    font-family: "RhymesTextTrial", sans-serif;
    font-weight:normal;
}

.RhymesTextTrial_L {
    font-family: "RhymesTextTrial", sans-serif;
    font-weight:100;
}
.RhymesTextTrial_b {
    font-family: "RhymesTextTrial", sans-serif;
    font-weight:bold;
}

.w100 {
    font-weight:100;
}
.normal {font-weight:normal;
}
.bold {font-weight:bold;
}




 /****************** header *******************/
.header.po {
   width: 100%;
    box-sizing: border-box;
    z-index: 9997;
    position: relative;
    padding: 0px 0vw 0px;
    text-transform: uppercase; 
}

.header.po.is-fixed {
    position: fixed;
    top: 0; 
       left: 2.5%;
       padding-top:20px;
    width: 95%;
}
.header-placeholder {
  margin: 0;
  padding: 0;
  border: 0;
}
/* fixed 적용 시 헤더의 원래 공간을 유지 */
.header-placeholder {
    width: 100%;
    height: 0;
}
/* 배경 */
.my-menu-dim {
    position: fixed;
    inset: 0;
    z-index: 9998;
    background: rgba(0, 0, 0, 0.35);

    opacity: 0;
    visibility: hidden;
    pointer-events: none;

    transition: opacity 0.35s ease, visibility 0.35s ease;
}

.my-menu-panel {
    position: fixed;
    top: 0;
    right: 0;
    z-index: 9999;
        text-align: right;
    width: 600px;
    max-width: 90vw;
    height: 100vh;

    box-sizing: border-box;
    background: #F5F3EF;

    transform: translate3d(100%, 0, 0);
    transition: transform 0.45s cubic-bezier(0.77, 0, 0.175, 1);

    padding: 40px 50px 40px 40px;
}

.my-menu-panel.is-open {
    transform: translate3d(0, 0, 0);
}

.my-menu-dim.is-open {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
}

.my-menu-close {
        display: inline-block;
    padding: 0;
    border: 0;
    background: none;
    cursor: pointer;
    font-size: 24px;
}

.my-menu-content {
    margin-top: 80px;    text-align: left;position: relative;
    height:calc(100% - 80px);
}

.my-menu-content p {
        margin: 0px 0 50px;  font-size: 22px;
}

.my-menu-content ul {
    margin: 0;
    padding: 0;
    list-style: none;
}

.my-menu-content li {
    margin-bottom: 30px;
}

.my-menu-content li a {
    color: #282623;
    text-decoration: none;    font-size: 46px;

}

.my-menu-content > a { 
     display: inline-block;
    vertical-align: middle;
    position: absolute;
    font-size: 22px;
    color: #282623;
    text-decoration: none;
    border-radius: 31px;
    border: 1px solid rgba(0, 0, 0, .3);
    padding: 19px 24px 21px;
    line-height: 1;
    bottom: 40px;
    right: 0px;
}

.my-menu-content > a img {
      width: auto;
    height: 18px;
    vertical-align: middle;
    margin-left: 9px;
} 
img {
    max-width:100%;
}

.header {
    font-size: 24px;    display: flex;
    justify-content: space-between;
}
.header .logo{
}
.header .logo a{color: #000;
    text-decoration: none;
} 
.header .logo + div{
}
.header .logo + div a{    color: #000;
    text-decoration: none;
}



/****************** footer ******************/


/* ******************** section08 ******************** */
#section08 {padding:100px 30px 30px;
    background:#232323;
}
#section08 > .box {
}
#section08 .footer-inner {
    display:flex;    justify-content: space-around;
      gap: 414px;
    padding-bottom: 100px;
}
#section08 .footer-inner ul{
    min-width:244px;
}
#section08 .footer-inner ul li{    font-weight: normal;
    margin-bottom: 17px;
    font-size: 24px;letter-spacing: -2%;
}
#section08 .footer-inner ul li a{color:#EFEDEA;
}
#section08 .footer-inner ul.left{
}
#section08 .footer-inner ul.right{
}


#section08 .footer-inner + div {
}
#section08 .footer-inner + div img {
}
 #wrap  #section08 .footer-inner + div p {
    text-align:right;color:#EFEDEA;
    font-size:30px; margin-top:20px;
        text-align: right;
    color: #EFEDEA; 
    font-weight: 400; 
}


 @media (max-width: 768px) {


      
      #section01 .intro-scroll-stage > .intro-final-header {
    top: -15px; 
}
    .header{
        font-size: 20px;
    }




    /********** footer   **********/
    
     #section08 .footer-inner { 
        gap: 0; 
    }

    #section08 .footer-inner ul {
        min-width: 50%;
    }

    #wrap #section08 .footer-inner ul li {
        font-weight: normal;
        margin-bottom: 10px;
        font-size: clamp(12px, 1.2500vw, 24px);
    }
    .my-menu-panel { 
    padding: 30px 35px 40px 30px;    max-width: 80vw;
}
    .my-menu-close {
    display: inline-block;
    padding: 0;
    border: 0;
    background: none;
    cursor: pointer;
    font-size: clamp(12px, 2.1333vw, 16px);
}
    .my-menu-content {
    margin-top: 40px; 
}
    .my-menu-content li {
    margin-bottom: 17px;
}
    .my-menu-content p { 
    font-size: clamp(12px, 2.6667vw, 20px);
}
 .my-menu-content li a {
    color: #282623;
    text-decoration: none;
    font-size: clamp(14px, 4.0vw, 26px);
}
 .my-menu-content > a {
    display: inline-block;
    vertical-align: middle;
    position: absolute;
    font-size: clamp(14px, 4.0vw, 26px);
    color: #282623;
    text-decoration: none;
    border-radius: 31px;
    border: 1px solid rgba(0, 0, 0, .3);
    padding: 15px 20px 16px;
    line-height: 1;
    bottom: 25px;
    right: 0px;
}
 .my-menu-content > a img { 
    height: 12px; 
}

 #wrap  #section08 {
    padding: 0px 30px 30px;
    background: #232323;
} 
 #wrap #section08 .footer-inner ul {
    min-width: auto;    width: 50%;
}
    #wrap #section08 .footer-inner ul li {
        margin-bottom: 8px;
        font-weight: 400;
    }
 #wrap  #section08 .footer-inner {
    justify-content: left;
    gap: 0;
    padding-bottom: 50px;
}

 #wrap #section08 .footer-inner + div p {
    text-align: right;
    color: #EFEDEA;
    font-size: clamp(18px, 5.3333vw, 40px);
    font-weight: 400;
    margin-top: 5px;
}

        }