#banner{position:relative;}
#banner .slick-slide { min-width: 100vw; }
#banner:after{content:url(/images/01/bannerBg.png);position: absolute;top: 35%;z-index: -1;}
#banner_box , #banner_box .item , #banner_box .img_box { position: relative; }
#banner_box .item{display:grid;grid-template-columns: 17% 75%;align-items: center;justify-content: end;}
#banner_box .img_box img {height: 97vh;width: 100%;}
#banner_box .img_box iframe , #banner_box .img_box video {position: absolute;width: auto;height: 100%;top: 0;left: 0;}
#banner_box .slick-dotted .slick-track { min-width: 100vw; }
#banner_box .atag_item { position: absolute; }
#banner_box .info_box {height: 100%;display: flex;order: -1;flex-direction: column;justify-content: center;}
#banner_box .info_box p{font-family: "Nunito Sans", serif;text-transform: uppercase;font-size: 15px;font-weight: 600;letter-spacing: .5px;margin-top: 50px;margin-bottom: 10px;}
#banner_box .info_box h3{color:var(--primary);word-spacing: 100vw;font-size: 55px;line-height: 1.4;letter-spacing: 5px;}
#banner_box .info_box article{margin-top:20px;font-size: 20px;letter-spacing: 1px;}

#banner .rightBox{position:absolute;width: 100px;height: 100%;right: 0;bottom: 0;background: white;display: flex;flex-direction: column;justify-content: flex-end;padding-bottom: 30px;gap: 40px;}
#banner .rightBox a{display:flex;flex-direction: row;writing-mode: vertical-lr;align-items: center;font-size: 17px;}
#banner .rightBox a:hover, #banner .rightBox a:hover svg{color:var(--primary);fill:var(--primary)}
#banner .rightBox a svg{width:20px;height: 20px;margin-bottom: 10px;}
#banner #scrollDown{cursor:pointer;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;flex-direction:column;-webkit-box-align:center;align-items:center;z-index:2;position: relative;}
#banner .upDown{width:100%;height: 100%;bottom: 0;left: 0;z-index: 2;position: absolute;}
#banner #scrollDown span.text{display:block;color: #2b2b2b;-webkit-writing-mode:vertical-lr;-ms-writing-mode:tb-lr;writing-mode:vertical-lr;letter-spacing:0.5px;margin-bottom: 20px;font-family: "Kanit", sans-serif;font-size: 15px;font-family: "Nunito Sans", serif;text-transform: uppercase;font-weight: 500;}
#banner #scrollDown span.scrollBtn{width:25px;height:44px;border-radius:12.5px;background-color: #eaeaea;position:relative;overflow:hidden;margin-bottom:12px}
#banner #scrollDown:hover span.scrollBtn:after{background-color:#292d74;top:65%;width:7px;height:7px;}
#banner #scrollDown span.scrollBtn:after{content:"";width:5px;height:5px;background-color: #414141;border-radius:50%;position:absolute;top:20%;left:50%;-webkit-transform:translateX(-50%);transform:translateX(-50%)}
#banner #scrollDown span.scrollArrow{width:10px;height:10px;border-right: 2px solid #414141;border-bottom: 2px solid #414141;-webkit-transform:rotate(45deg);transform:rotate(45deg);display:block}

@media screen and (max-width: 1440px){
	#banner_box .item{gap: 40px;}
}
@media screen and (max-width: 1400px){
    #banner_box .item{grid-template-columns: 20% 70%;}
}
@media screen and (max-width: 1160px){
    #banner_box .item{grid-template-columns: 25% 65%;}
    #banner .rightBox{display:none;}
}
@media screen and (max-width: 980px){
    #photo_list{display:flex;flex-direction: column;align-items: center;}
    #photo_list h3{text-align:center}
    #banner_box .info_box h3{word-spacing:unset;font-size: 40px;}
    #banner_box .info_box{width: 90%;margin: 0 auto;}
    #banner_box .info_box p{margin-top:0}
    #banner_box .item{grid-template-columns: 1fr;}
    #banner_box .img_box {order: -1;}
    #banner_box .img_box img{height: 50vh;}
}