#home{margin:0 0 40px 0;}


#home .sect20{margin:70px 0 0 0;}
#home .sect20 .grid{display:grid;grid-template-columns:2fr 1fr;grid-gap:30px;}
#home .sect20 .grid .s{}
#home .sect20 .grid .s.s1{padding:20px;background:#e9e1c7;border-radius:10px;box-shadow:0 0 ;box-shadow:0 4px 10px rgba(0, 0, 0, 0.2);}
/*
#home .sect20 .grid .s.s1 .title{font-family:'fonttip2_italic',Arial,sans-serif;font-size:1.1rem;letter-spacing:1px;}
#home .sect20 .grid .s.s1 .textbox{margin:8px 0 0 0;}
#home .sect20 .grid .s.s1 .textbox textarea{
    display:block;width:100%;height:500px;padding:15px;box-sizing:border-box;
    background:#fefdf8;border:1px solid #ddd;border-radius:10px;
}
*/
#home .sect20 .grid .s.s1 .form{}
#home .sect20 .grid .s.s1 .formgrid{display:grid;grid-template-columns:1fr 1fr;column-gap:10px;row-gap:10px;}
#home .sect20 .grid .s.s1 .formgrids{display:grid;grid-template-rows:subgrid;grid-row: span 3;gap:5px;}
#home .sect20 .grid .s.s1 .formgrids.tip1{
    background:#f6f2e5;border-radius:10px;box-shadow:0 0 5px rgba(0,0,0,0.2);padding:20px;
}
#home .sect20 .grid .s.s1 .formgrids.tip1 .title{}
#home .sect20 .grid .s.s1 .formgrids.tip1 .item{}
#home .sect20 .grid .s.s1 .formgrids.tip1 .explain{color:#bfb289;}
#home .sect20 .grid .s.s1 .formgrids.tip2{align-self:end;justify-self:end;}


#home .sect20 .form input,
#home .sect20 .form select{
    font-size:1rem;padding:10px;border:1px solid #ccc;border-radius:5px;width:100%;box-sizing:border-box;outline:none;
    transition:all 0.3s ease;
}
#home .sect20 .form input::placeholder,
#home .sect20 .form select::placeholder{color:#999;font-style:italic;}
#home .sect20 .form input:focus,
#home .sect20 .form select:focus{border-color:#007BFF;box-shadow:0 0 5px rgba(0,123,255,0.5);background-color:#f0f8ff;}
#home .sect20 .form input:active,
#home .sect20 .form select:active{border-color:#0056b3;}
#home .sect20 .form input:disabled,select:disabled{background-color:#e9ecef;border-color:#ccc;color:#6c757d;cursor:not-allowed;}
#home .sect20 .form input.error,
#home .sect20 .form select.error{border-color:#dc3545;background-color:#f8d7da;color:#721c24;}
#home .sect20 .form input:valid,
#home .sect20 .form select:valid{border-color:#28a745;background-color:#fff;color:#155724;}
#home .sect20 .form input:hover,
#home .sect20 .form select:hover{border-color:#0056b3;}
#home .sect20 .form input:focus::placeholder,
#home .sect20 .form select:focus::placeholder{color:transparent;}
#home .sect20 .form select{padding-right:30px;}
#home .sect20 .form select:focus{border-color:#007BFF;box-shadow:0 0 5px rgba(0,123,255,0.5);}
#home .sect20 .form input[type="text"],
#home .sect20 .form input[type="number"],
#home .sect20 .form input[type="email"],
#home .sect20 .form select{width:100%;padding:10px;border-radius:5px;font-size:1rem;border:1px solid #ccc;}
#home .sect20 .form input:focus,
#home .sect20 .form select:focus{border-color:#007BFF;background-color:#f0f8ff;}


#home .sect20 .form button{
    font-size:1rem;padding:12px 24px;border-radius:8px;border:none;
    background-color:#0066a1;color:white;text-align:center;cursor:pointer;
    transition:all 0.3s ease-in-out;outline:none;
}
#home .sect20 .form button:hover{background-color:#007bff;box-shadow:0 4px 8px rgba(0,123,255,0.4);}


#home .sect20 .grid .s.s2{}
#home .sect20 .grid .s.s2 .box{
    padding:25px 20px;margin:0 0 20px 0;
    background-color:#0066a1;color:#eae2d1;text-align:center;border-radius:10px;
}
#home .sect20 .grid .s.s2 .box .title{font-size:1.1rem;}
#home .sect20 .grid .s.s2 .box .value{font-size:1.7rem;font-family:'fonttip1_semibold',Arial,sans-serif;}
@media only screen and (max-width:850px){
    #home .sect20{margin:20px 0 0 0;}
    #home .sect20 .grid{grid-template-columns:1fr;grid-template-areas:"s1" "s2";row-gap:25px;}
    #home .sect20 .grid .s.s1{grid-area:s1;}
    #home .sect20 .grid .s.s1 .textbox textarea{height:300px;padding:6px;}
    #home .sect20 .grid .s.s2{grid-area:s2;}
    #home .sect20 .grid .s.s2 .results{display:grid;grid-template-columns:1fr 1fr;gap:5px;}
    #home .sect20 .grid .s.s2 .box{padding:10px 10px;margin:0;}
    #home .sect20 .grid .s.s2 .box .title{font-size:1rem;}
    #home .sect20 .grid .s.s2 .box .value{font-size:2rem;}
}
@media only screen and (max-width:850px){
    #home .sect20{margin:30px 0 0 0;}
    #home .sect20 .grid{gap:25px;}
    #home .sect20 .grid .s.s1{padding:15px 10px;border-radius:10px;}
    #home .sect20 .grid .s.s2 .box .title{font-size:.9rem;}
    #home .sect20 .grid .s.s2 .box .value{font-size:1.6rem;}
    
    #home .sect20 .grid .s.s1 .form{}
    #home .sect20 .grid .s.s1 .formgrid{grid-template-columns:1fr;row-gap:7px;}
    #home .sect20 .grid .s.s1 .formgrids{gap:3px;}
    #home .sect20 .grid .s.s1 .formgrids.tip1{border-radius:10px;padding:10px;}
}
@media only screen and (max-width: 600px){
    #home .sect20 .grid .s.s2 .results{grid-template-columns:1fr;gap:5px;}
}



#home .sect40{margin:70px 0 0 0;}
#home .sect40 .content hr{border:1px solid #ddd;}
#home .sect40 .content b,
#home .sect40 .content strong{font-weight:normal;font-family:'fonttip1_semibold';}
#home .sect40 .content img{max-width:100%;height:auto!important;
    border-radius:15px;
    box-shadow: 0 0 5px 0px #aaa;
}
#home .sect40 .content p{padding:8px 0;}
#home .sect40 .content p:nth-of-type(1){padding-top:0;}
#home .sect40 .content table{border:none;max-width:100%!important;overflow:auto;}
#home .sect40 .content table tr{}
#home .sect40 .content table tr td{padding:4px 6px;border:1px solid #ddd;}
#home .sect40 .content h1{margin:0 0 8px 0;font-size:2.1rem;font-family:'fonttip2';}
#home .sect40 .content h2{margin:0 0 8px 0;font-size:1.9rem;font-family:'fonttip2';}
#home .sect40 .content h3{margin:0 0 8px 0;font-size:1.7rem;font-family:'fonttip2';}
#home .sect40 .content h4{margin:0 0 8px 0;font-size:1.5rem;font-family:'fonttip2';}
#home .sect40 .content h5{margin:0 0 8px 0;font-size:1.3rem;font-family:'fonttip2';}
#home .sect40 .content h6{margin:0 0 8px 0;font-size:1.1rem;font-family:'fonttip2';}
#home .sect40 .content h1 strong,
#home .sect40 .content h1 b,
#home .sect40 .content h2 strong,
#home .sect40 .content h2 b,
#home .sect40 .content h3 strong,
#home .sect40 .content h3 b,
#home .sect40 .content h4 strong,
#home .sect40 .content h4 b,
#home .sect40 .content h5 strong,
#home .sect40 .content h5 b,
#home .sect40 .content h6 strong,
#home .sect40 .content h6 b{
    font-weight:normal;font-family:'fonttip2';
}
#home .sect40 .content iframe{max-width: 100%;}
#home .sect40 .content:after{content:"";display:block;clear:both;}
@media only screen and (max-width: 900px){
    #home .sect40{margin:25px 0 0 0;}
}