﻿/* main_css.css */

    @charset "utf-8";
 
    html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {
      margin: 0 ;
      padding: 0 ;
      border: 0 ;
      outline : 0 ; 
      font-weight : inherit ;
      font-style : inherit ;  /* font-size : 100 % ;  */      
      font-family : inherit ;
      vertical-align : baseline ;
    }
    
    body { 
        color: #E46C0A; 
        /*  font-family: "Nanum Gothic", "Malgun Gothic", Gulimche, "Times New Roman", serif ; */   /* font-size: 20px; */ 
        line-height: 14px;  
        /* font-size: 20px; */
        font-weight: bold;  
        /* background-color: #ffffff;   deepskyblue - #00BFFF, skyblue - #87CEEB, lightskyblue - #87CEFA  #f7f4eb;*/
        background: #ffffff ;   /* url('index/20220506_samhwaplaza.jpg') no-repeat ;  */
    }

    /* responsive web font size design area */
    @media screen and ( min-width: 1025px){ html { font-size: 16px; } }
    @media screen and ( max-width: 1024px){ html { font-size: 16px; } }
    @media screen and ( max-width:  800px){ html { font-size: 14px; } }
    @media screen and ( max-width:  500px){ html { font-size: 12px; } } 
    
    input, select { font-size: 1rem; }   
    input:focus { box-shadow: inset 0 0 2px rgba(255, 0, 0, .8); }
    
    /* responsive web font size design area 
    @media screen and ( min-width: 1281px){ html { font-size: 26px; } }
    @media screen and ( max-width: 1280px){ html { font-size: 24px; } }
    @media screen and ( max-width: 1024px){ html { font-size: 22px; } }
    @media screen and ( max-width:  768px){ html { font-size: 20px; } }
    @media screen and ( max-width:  600px){ html { font-size: 16px; } }
    @media screen and ( max-width:  480px){ html { font-size: 14px; } } 
    */


    h1  { display: none; }
    
    a { text-decoration: none; color: #474747; }  
    /*       a:hover { color: #31859C; border-bottom: 1px solid #31859C; }      a:active { color: #2E2A54; }  */   
    
    img { max-width: 100%;}
    
    hr { 
    	display: block;
        margin-top: 0;
        margin-bottom: 0;        
        margin-left: auto;
        margin-right: auto;
        border-style: inset;
        border-width: 1px;
    } 

    .contents_title { 
        color: #0f0f0f; 
        text-align: left; 
        font-weight: normal; 
        padding-bottom: 6px; 
        margin-top: 16px;     margin-left: 2%;    margin-right: 2%;    margin-bottom: 4px; 
        border-bottom: 1px solid #e6e6e6;  }
    .contents_title span { margin: 10px 10px;   }
    .contents_title span:nth-child(1) { font-size: 1.6rem;   }
    .contents_title span:nth-child(2) { font-size: 1.2rem; letter-spacing: -1px;  }
    /*
    @media screen and ( max-width:  480px ) { 
        .contents_title span:nth-child(1) { font-size: 1.0rem; } 
        .contents_title span:nth-child(2) { font-size: 0.8rem; } 
    }  */

    .contents_title_center { 
        color: #0f0f0f; 
        text-align: center;   /* display: flex ; justify-content: center; text-align: center; */
        font-weight: normal; 
        padding-bottom: 6px; 
        margin-top: 16px;     margin-left: 2%;    margin-right: 2%;    margin-bottom: 4px;    /* border-bottom: 1px solid #e6e6e6; */   }
    .contents_title_center span { margin: 10px 10px;   }
    .contents_title_center span:nth-child(1) { font-size: 2.0rem; font-weight: bold;   }
    /*
    @media screen and ( max-width:  480px ) { 
        .contents_title_center span:nth-child(1) { font-size: 1.0rem; } 
    }     */    


    ul { list-style: none; } 
    ul li { display: inline;  float: left; }

    #call_number  { display: none; }
    #main_header  { display: block; }
    #main_header_smartphone  { display: none; } 
    #call_notice  { display: none; } 
    #main_footer  { display: none; } 
    #space { display: none; }  
    #wrap { 
        margin:0 auto; 
        background-color: white ; 
	    /* width: 1000px;  */ 
        /* outline: rgba(135, 127, 107, .06) 1px solid;  */  
    }        
    /* responsive web design area */
    @media screen and ( min-width: 1225px ) { #wrap, #main_logo { width: 1224px; }  }
    @media screen and ( max-width: 1224px ) { #wrap, #main_logo { width: 100%; }    }
    @media screen and ( max-width:  768px ) { 
        #call_number { display: block; } 
        #main_header_smartphone  { display: block; } 
        #call_notice { 
            display: flex;
            flex-direction: row;
            position: fixed;
            left: 0;
            bottom: 0;
            width: 100%;  } 
        #main_header  { display: none; }
        #main_footer  { display: block; }
        #main_footer4  { display: none; }
        #space { display: block; }    }
    @media screen and ( max-width:  600px ) {   }
    @media screen and ( max-width:  480px ) { #wrap { min-width: 300px; }    }
    
    .good_img {
    	border-radius: 20px 20px 0 20px; 
    } 
    
    #call_notice a {
        margin-top: auto;
        width: 50%;
    }

    form { font-size: 1rem; }
    th { width: 100px; font-size: 0.9rem; } 
    
    .table_comments {
        border:5px solid #F3F3F3; padding: 1.5em 3.0em; color: #000; 
        font-size: 0.8rem; font-weight: normal;
    }    
    @media screen and ( max-width:  768px ) { 
        form { font-size: 0.7rem;  }
        th { width: 58px; } 
        .table_comments {  font-size: 0.5rem; }    
    }  

        
    #main_logo { position: relative; line-height: 90%; margin-left: 16px; margin-top: 16px; }
    #main_number {   
        color: #ff671d;  /* #951e1e; */ 
        /*  font-family: 'Nanum Gothic', 'Malgun Gothic', 'Noto Sans KR', 'Nanum Gothic', Gulimche, 'Times New Roman';  */
        font-size: 20px; 
        font-weight: bold; 
        position: absolute; 
        padding: 1px 0 0 0;
        top: 60px; left: 160px;  
    }
    #main_message {   
        font-size: 1.2rem; 
        font-weight: bold; 
        position: absolute; 
        right: 3rem;
        bottom: -50%;  
        color: #6f6f6f;   /* 0c0c0c;  e75000   */
    }
    #main_message2 {   
        font-size: 16px; 
        font-weight: normal;  
        position: absolute; 
        top: 30px; right: 10%;
        color: #0c0c0c;  
    }
    .main_logo_img1 { 
        position: absolute; 
        top: 2px;   left: 1px;
        width: 80px;  /* 10%;    */
        padding: 1px 0;
        background-color: transparent;
    } 
    #main_logo_img2 { 
        position: absolute; 
        top: 8px;   left: 1px;
        left: 16px;
        width: 128px;   
    } 
    #main_link {    
        color: #000000;
        position: absolute; 
        left: 160px; 
        font-size: 32px; 
        font-weight: bold; 
        letter-spacing : 0px; 
        transition: all 1.0s ;
    }
    #main_link:hover {
        color: #ff671d; /* #981c1e  #801214;     #961e1f - rgba(150,30,31,1)  #e75000   264677  */
	    /*
	    text-shadow: 1px  2px 0 rgba(150,30,31,0.4),  2px  4px 0 rgba(150,30,31,0.4) ; */  /*  #e75000  rgba(231, 80, 0, 0.8) */
    }

    #main_menu2 ul { 
        display: flex ; justify-content: space-evenly; text-align: center; 
        font-size: 16px; 
        background: #120846; padding: 16px 0;   }   /* #3f4045   #672322  #666259 */
    @media screen and ( max-width:  768px ) { #main_menu2 ul { font-size: 12px;  } }  
    #main_menu2 ul li { 
         flex-basis: auto; flex-grow: 1; color: #ffffff; line-height: 1.0;  }   /* #FFFFFF */
    
    #submenu {
        display: flex ; justify-content: space-evenly; text-align: center; 
        font-size: 16px; font-weight: bold; 
        background: #dfdfdf; padding: 16px 0.5rem;     /* #dfdfdf */
    } 
    #submenu a { flex-basis: auto; flex-grow: 1; flex-shrink: 1;  } 
    
    .contents_last {
        text-align: left;  word-break: keep-all; 
        font-size: 0.9rem; font-weight: normal;    /* letter-spacing: -1px;    0.9rem; */
        color: #000000; line-height: 1.5;
        margin-left: 2%;  
    }
    @media screen and ( max-width:  768px ) { .contents_last { font-size: 0.5rem;  } }  


    .bank_number {
        display: block;           position: relative; 
        background: #3a3a3a;    text-align: center; 
    }
    .bank_number span { 
        position: absolute; 
        left: calc(50% - 16rem); top: 26%; 
        font-size: 1.1rem; color: #323947; line-height: 1.5;
    }

    .button_attempt {
        font-size: 16px;        
        background: #120846;  color: #fff;  /* #6f6f6f;  #7e522f;  264677;  8f0108;  */
        border-radius: 6px;    border: 0.1rem solid #6f6f6f;
        padding: 0.6rem 0.8rem;  margin: 0.5rem;
        position: relative;    z-index: 1;  overflow: hidden;    
    }
    /* .button_attempt:hover { color: #543b12;  background: #ecf0f1;  }   */

    .container { width: 80%; margin: 0 auto; }
    .container-box { padding: 56.25% 0 0 0; position: relative; }  
    .container-target {
        position: absolute;  
        top: 0;    left: 0;    width: 100%;    height: 100%; 
        border: 0;
    }

    
    #business_info { margin-left: 5%; border-top:1px solid #e3e4e5; font-size: 1rem; font-weight: normal; line-height: 1.2; }
    #business_info th { 
        padding: 0.5rem 1.0rem;    background-color:#dfdfdf;    border-bottom: 1px solid #ffffff;    color:#000;  }  /* 3b4045  e3e4e5 */
    #business_info td { 
        width: 75%; padding: 0.5rem 2.0rem;    border-bottom: 1px solid #e3e4e5;    color:#222;   text-align: left;   }
    
    .last_menu_div {  margin: 0 auto;   padding: 8px;   text-align: center;   color: #0c2843;   font-size: 8px;  }
    .last_menu { background-color: white; padding: 6px; border: 1px solid #000; border-radius: 4px; }
    .last_menu:hover { background-color: darksalmon;}

    .page02_header { text-align: center;     line-height: 1.5;     margin: 10px;  }
    .page02_header_sub1 { font-size: 1.4rem;  }
    .page02_header_sub2 { font-size: 1.8rem;  }
    @media screen and ( max-width:  768px ) { 
        .page02_header_sub1 { font-size: 0.7rem;  }
        .page02_header_sub2 { font-size: 0.8rem;  }
     }  

    .page05_header {
        border: 5px;           padding: 10px;         OVERFLOW: auto;            WIDTH: 100%; 
        font-size: 24px;     color: #474747;      text-align: left;           line-height: 1.5;  
        font-weight: bold;     word-break: keep-all;  
    }
    @media screen and ( max-width:  768px ) { .page05_header { font-size: 16px;  } }  
