@media (min-width: 769px) {
    /*--------------------------------------------------------------
    /*브랜드 메인 */
    body {
        /*font-family: 'Inter', sans-serif;*/
        margin: 0;
        padding: 0;
        background-color: #ffffff;
    }
    header {
        margin: 0 auto;
        display: flex;
        flex-direction: column;
        width:800px;
        height: auto;
        margin-bottom: 0 auto;
        background-color: #A1BAFF;
        background-size: cover;
        justify-content: center;
        align-items: center;
    }

    header h1 {
        margin-top:20px;
        margin-bottom: 0px;
        padding-right:520px;
        padding-bottom:95px;
        position: absolute;
        font-size: 32px;  /* 텍스트를 크게 하여 시각적으로 강렬한 인상을 줌 */
        font-family: 'Itim', sans-serif;
        line-height: 1.2;  /* 줄 간격을 조정하여 텍스트를 더 시각적으로 균형있게 만듦 */
        text-transform: uppercase;  /* 모든 글자를 대문자로 변환하여 더 모던한 느낌 */
        color: #0F4FFF;  /* 흰색 텍스트로 대비를 강화 */
    }

    header h2 {
        margin-top:20px;
        margin-bottom: 0px;
        display: flex;
        font-size: 65px;  /* 텍스트를 크게 하여 시각적으로 강렬한 인상을 줌 */
        font-family: 'Itim', sans-serif;
        letter-spacing: 2px;
        font-weight: 100;
        line-height: 1.2;  /* 줄 간격을 조정하여 텍스트를 더 시각적으로 균형있게 만듦 */
        text-transform: uppercase;  /* 모든 글자를 대문자로 변환하여 더 모던한 느낌 */
        color: #ffffff;  /* 흰색 텍스트로 대비를 강화 */
    }

    .phrase h2  {
        margin-top:0px;
        margin-bottom: 0px;
        padding-bottom: 10px;
        font-family: 'Itim', sans-serif;
        font-size: 24px;
        color: #ffffff;
        margin-bottom: 10px;
        text-align: center;
        letter-spacing: 10px;

    }

    /*-----------------------------------------------------------------*/   
 
    .Home {
        display:flex;
        width: 40px;
        height: 20px;
        margin-left: auto; /* 버튼을 오른쪽으로 밀착 */
        text-align: center;
        justify-content: center;
        align-items: center;
        background-color: #ffffff;
        color: black;
        border: 1px solid black;
        border-radius: 5px;
        cursor: pointer;
        font-family: 'Itim', sans-serif;
        font-size: 12px;
    }
    
    .login:hover {
        background-color: gray;
    }
    .main{
        width:800px;
        height: auto;
        margin: 0 auto;
        background-color: white;
    }
    section.brand_descript{
        background-color: white;
        display:flex;
        justify-content: space-between;
        width:800px;
        padding-top: 10px;
        margin:0 auto;
        position: relative;
        align-items: center;
    }
    button.brand_tap{
        width: 150px;
        height: 40px;
        background-color: #A1BAFF;
        border: 1px solid #0F4FFF;
        border-radius: 0px 10px 10px 0px;
        color: #0F4FFF;
        cursor: pointer;
        font-size: 18px;
        font-family: 'Itim', sans-serif;
        letter-spacing: 20%;
    }
    /* 사이드 탭 스타일 */
    .side-tab {
        padding-top:20px;
        padding-bottom: 20px;
        display: none;
        position: absolute; 
        top : 50px;
        left : 0px;
        height: auto;
        width: 150px;
        border-radius: 0px 10px 10px 0px;
        background-color: rgba(193, 209, 254, 0.9);
        border : 1px #0f4fff solid;
        z-index: 9999;
        flex-direction: column;
    }
    .side1{
        display: flex;
        margin: 0 auto;
        font-family: 'Itim', sans-serif;
        font-size: 20px;
        color: #0f4fff;
        border-bottom: 2px #0f4fff dashed;
        padding-bottom: 10px;
    }
    .side-tab a {
        display: flex;
        margin-top : 10px;
        margin-left : 10px;
        font-family: 'Itim', sans-serif;
        font-size: 12px;
        color: #0f4fff;
        display: block;
        transition: 0.3s;
    }
    .side-tab a:hover {
        display: flex;
        color: #f1f1f1;
    }
    .Instar {
        display: flex;
        padding-top : 50px;
        margin: 0 auto;
        font-family: 'Itim', sans-serif;
        font-size: 12px;
        color: #0f4fff;
        display: block;
        transition: 0.3s;
        border-top: 2px #0f4fff dashed;
    }
    .site_description{
        display: flex;
        width: 65%;
        font-size: 13px;
        font-family: 'itim', sans-serif;
        margin-top: 10px;
        margin-left: 20px;
    }
    .section_phrase{
        background-color: white;
        display:flex;
        width:800px;
        padding-top: 10px;
        margin:0 auto;
        position: relative;
        align-items: center;
    }
    .section_phrase h2{
        margin-top: 10px;
        margin-left: 30px;
        font-size: 14px;
        font-family: 'itim', sans-serif;
    }

    .section_phrase blockquote{
        margin-top: 0px;
        font-size: 14px;
        font-family: 'itim', sans-serif;
    }
    footer {
        display:flex;
        margin: 0 auto;
        width: 800px;
        background-color: #333;
        color: white;
        text-align: center;
        margin-top: 10px;
    }

    footer p {
        margin: 10px 10px;
    }
/* ------------------------------------------- */

    .ID_section{
        width: 100%;
        height: auto;
        background-color: white;
        display: flex;
        justify-content: center;
        align-items: center;
    }
    .ID_div{
        width: 500px;
        height: 500px;
        flex-direction: column;
        background-color: white;
        border-radius: 10px;
        border: 1px solid black;
        justify-items: center;
        align-content: center;
    }
    .find_span{
        display: flex;
        justify-self: center;
        font-size: 30px;
        font-family: 'itim', sans-serif;
        margin-bottom: 30px;
    }
    .name_span,.Email_span{
        width: 300px;
        display: flex;
        font-size: 15px;
        font-family: 'itim', sans-serif;
        margin-top: 10px;
        margin-bottom: 5px;
    }
    .name_input,.Email_input{
        display: flex;
        width: 300px;
        height: 30px;
        border-radius: 10px;
        border : 1px solid black;
    }
    .find_button{
        display: flex;
        width: 300px;
        height: 40px;
        border-radius: 10px;
        border : 1px solid black;
        margin-top: 30px;
        align-items: center;
        justify-content: center;
        font-size: 20px;
        font-family: 'itim', sans-serif;
    }

/*----------------------------------------------*/
    .left_ad{
        display: flex;
        position: absolute;
        width:170px;
        height: 610px;
        top:10px;
        left:-270px;
        background-color:gray;
        align-items: center;
        justify-content: center;
        background-repeat: no-repeat;
        background-position: center center;
        background-size: cover;
        opacity: 1;
        overflow: hidden;
    }
    .bottom_ad{
        display:flex;
        background-color: gray;
        margin: 0 auto;
        margin-top: 10px;
        margin-bottom: 0px;
        width:728px;
        height:90px;
        align-items: center;
        justify-content: center;
        background-repeat: no-repeat;
        background-position: center center;
        background-size: cover;
        opacity: 1;
        overflow: hidden;
    }
    .bottom_adM{
        display: none;
    }

}
@media (max-width: 768px) {
/*--------------------------------------------------------------
/*브랜드 메인 */
    body {
        /*font-family: 'Inter', sans-serif;*/
        margin: 0;
        padding: 0;
        background-color: #ffffff;
    }
    header {
        margin: 0 auto;
        display: flex;
        flex-direction: column;
        width:390px;
        height: auto;
        margin-bottom: 0 auto;
        background-color: #A1BAFF;
        background-size: cover;
        justify-content: center;
        align-items: center;
    }

    header h1 {
        margin-top:10px;
        margin-bottom: 0px;
        padding-right:260px;
        padding-bottom:47.5px;
        position: absolute;
        font-size: 16px;  /* 텍스트를 크게 하여 시각적으로 강렬한 인상을 줌 */
        font-family: 'Itim', sans-serif;
        line-height: 1.2;  /* 줄 간격을 조정하여 텍스트를 더 시각적으로 균형있게 만듦 */
        text-transform: uppercase;  /* 모든 글자를 대문자로 변환하여 더 모던한 느낌 */
        color: #0F4FFF;  /* 흰색 텍스트로 대비를 강화 */
    }

    header h2 {
        margin-top:10px;
        margin-bottom: 0px;
        display: flex;
        font-size: 32.5px;  /* 텍스트를 크게 하여 시각적으로 강렬한 인상을 줌 */
        font-family: 'Itim', sans-serif;
        letter-spacing: 1px;
        font-weight: 100;
        line-height: 1.2;  /* 줄 간격을 조정하여 텍스트를 더 시각적으로 균형있게 만듦 */
        text-transform: uppercase;  /* 모든 글자를 대문자로 변환하여 더 모던한 느낌 */
        color: #ffffff;  /* 흰색 텍스트로 대비를 강화 */
    }

    .phrase h2  {
        margin-top:0px;
        margin-bottom: 0px;
        padding-bottom: 5px;
        font-family: 'Itim', sans-serif;
        font-size: 12px;
        color: #ffffff;
        margin-bottom: 5px;
        text-align: center;
        letter-spacing: 5px;

    }

    /*-----------------------------------------------------------------*/   
    .Home {
        display:flex;
        width: 40px;
        height: 15px;
        margin-left: 20px;
        text-align: center;
        justify-content: center;
        align-items: center;
        background-color: #ffffff;
        color: black;
        border: 1px solid black;
        border-radius: 2.5px;
        cursor: pointer;
        font-family: 'Roboto Mono', monospace;
        font-size: 10px;
    }
    .main{
        width:390px;
        height: auto;
        margin: 0 auto;
        background-color: white;
    }
    section.brand_descript{
        background-color: white;
        display:flex;
        width:390px;
        padding-top: 5px;
        margin:0 auto;
        align-items: center;

    }
    button.brand_tap{
        width: 75px;
        height: 20px;
        background-color: #A1BAFF;
        border: 1px solid #0F4FFF;
        border-radius: 0px 5px 5px 0px;
        color: #0F4FFF;
        font-size: 9px;
        font-family: 'Itim', sans-serif;
        letter-spacing: 20%;
    }
    /* 사이드 탭 스타일 */
    .side-tab {
        padding-top:20px;
        padding-bottom: 20px;
        display: none;
        position: absolute; 
        top : 100px;
        left : 0px;
        height: auto;
        width: 150px;
        border-radius: 0px 10px 10px 0px;
        background-color: rgba(193, 209, 254, 0.9);
        border : 1px #0f4fff solid;
        z-index: 9999;
        flex-direction: column;
    }
    .side1{
        display: flex;
        margin: 0 auto;
        font-family: 'Itim', sans-serif;
        font-size: 20px;
        color: #0f4fff;
        border-bottom: 2px #0f4fff dashed;
        padding-bottom: 10px;
    }
    .side-tab a {
        display: flex;
        margin-top : 10px;
        margin-left : 10px;
        font-family: 'Itim', sans-serif;
        font-size: 12px;
        color: #0f4fff;
        display: block;
        transition: 0.3s;
    }
    .side-tab a:hover {
        display: flex;
        color: #f1f1f1;
    }
    .Instar {
        display: flex;
        padding-top : 50px;
        margin: 0 auto;
        font-family: 'Itim', sans-serif;
        font-size: 12px;
        color: #0f4fff;
        display: block;
        transition: 0.3s;
        border-top: 2px #0f4fff dashed;
    }
    .site_description{
        display: flex;
        width: 60%;
        font-size: 6px;
        font-family: 'itim', sans-serif;
        justify-content: center;
        align-items: center;
        margin-top: 5px;
        margin-left: 5px;
    }
    .section_phrase{
        background-color: white;
        display: flex;
        width:390px;
        margin:0 auto;
        margin-top: 5px;
        margin-bottom: 5px;
        flex-direction: row;
        align-items: center;
        justify-content: center;
    }
    .section_phrase h2{
        font-size: 8px;
        font-family: 'itim', sans-serif;
    }
    .section_phrase blockquote{
        font-size: 7px;
        font-family: 'itim', sans-serif;
    }
    footer {
        display:flex;
        margin: 0 auto;
        width: 390px;
        background-color: #333;
        color: white;
        text-align: center;
        margin-top: 20px;
    }

    footer p {
        margin: 5px 5px;
        font-size: 10px;
    }
/* ------------------------------------------- */
    .ID_section{
        width: 100%;
        height: auto;
        background-color: white;
        display: flex;
        justify-content: center;
        align-items: center;
    }
    .ID_div{
        width: 350px;
        height: 450px;
        flex-direction: column;
        background-color: white;
        border-radius: 10px;
        border: 1px solid black;
        justify-items: center;
        align-content: center;
    }
    .find_span{
        display: flex;
        justify-self: center;
        font-size: 30px;
        font-family: 'itim', sans-serif;
        margin-bottom: 30px;
    }
    .name_span,.Email_span{
        width: 300px;
        display: flex;
        font-size: 15px;
        font-family: 'itim', sans-serif;
        margin-top: 10px;
        margin-bottom: 5px;
    }
    .name_input,.Email_input{
        display: flex;
        width: 300px;
        height: 30px;
        border-radius: 10px;
        border : 1px solid black;
    }
    .find_button{
        display: flex;
        width: 300px;
        height: 40px;
        border-radius: 10px;
        border : 1px solid black;
        margin-top: 30px;
        align-items: center;
        justify-content: center;
        font-size: 20px;
        font-family: 'itim', sans-serif;
    }

    /*--------------------------------------------*/
    .left_ad{
        display: none;
    }
    .bottom_ad{
        display:none;
    }
    .bottom_adM{
        display:flex;
        background-color: gray;
        margin: 0 auto;
        margin-top: 10px;
        width:320px;
        height:100px;
        align-items: center;
        justify-content: center;
        background-repeat: no-repeat;
        background-position: center center;
        background-size: cover;
        opacity: 1;
        overflow: hidden;
    }
}