/* BASIC css start */
    @font-face {
     font-family: 'S-CoreDream';
     src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_six@1.2/S-CoreDream.woff') format('woff');
     font-weight: normal;
     font-style: normal;
    }
    
    body{
      width: 100%;
    }
    #wrap{
      width: 1200px;
      margin: 0 auto;
    }
    #planArea{ padding-top: 182px; margin: 0 auto;
      width:1200px; font-family: 'S-CoreDream', "Noto Sans KR", -apple-system,BlinkMacSystemFont,"Malgun Gothic","맑은 고딕",helvetica,"Apple SD Gothic Neo",arial,dotum,돋움,sans-serif;
    }

    /*상품리스트*/
    .item__bg{width:1200px; padding: 0px 74px 150px 74px; background:#fff;}
    .item__bg .items{width:1052px;}
    .item__bg .items__column{width:516px; display:inline-block; vertical-align: top;}
    .item__bg .items__column:last-child{margin-left:15px;}
    .items__tit{font-size:20px; line-height:20px; margin:55px 0px 20px 0px; border-bottom: 1px solid #ddd; color:#d1d1d2;
                display: flex; width: 100%; justify-content: center; padding-bottom: 50px;}
    .all{font-size: 24px; line-height: 24px; font-weight: 500; font-style: italic;}
    .spB{font-weight: bold; text-decoration: underline; text-underline-position:under; font-size: 22px;}
    .item__innerbg{width:100%;}
    .item__inner{display:inline-block; width:248px; background:#fff; border:1px solid #ececec; margin:0px 15px 20px 0px; padding:21px 21px 34px 21px; flex-wrap: wrap; transition: box-shadow ease-in-out 0.15s;}
    .item__inner:nth-child(4n){margin:0px 0px 20px 0px;}
    .items__column .item__inner:nth-child(4n){margin:0px 15px 20px 0px;}
    .items__column .item__inner:nth-child(2n){margin:0px 0px 20px 0px;}
    .item__inner:nth-child(4n) {
      margin-right: 0px;
    }
    .item__inner .itemInfo-imgz {
      position: relative;
    }
    .itemInfo-imgz img {
      width: 206px;
    }
    .itemInfo-titz {
      width: 206px;
      margin: 4px 0px 35px 0px;
      height: 36px;
      overflow: hidden;
    }
    .item__inner .sizeView {
      width: 206px;
      height: 25px;
      border: 1px solid #ececec;
      margin: 20px auto 0px auto;
    }


    /*상단 메인이미지*/
    .in1{
      width: 1200px; height: 790px;
    }
    .in1>img{
      width: 100%; height: 100%; object-fit: contain;
    }
    
    /*베스트*/
    .in2{
      width: 1200px; height: 2050px; background-image: url('http://winv007.img18.kr/crazy11web/plan/a_summer24/PC_summer24_in2_B.jpg');
    }
    .in2_T{
      text-align: center; padding-top: 300px; margin-bottom: 60px;
    }
    .in2_T>div:nth-child(1){ letter-spacing: -2px;
      font-size: 62px; line-height: 62px; color: #0455bf; font-weight: 800; font-style: italic;
    }
    .in2_T>div:nth-child(2){ letter-spacing: -1px;
      font-size: 28px; line-height: 28px; color: #0455bf; font-weight: 700; font-style: italic; margin-top: 6px;
    }
    .in2_de{ box-shadow: 2px 4px 10px #d9d7d2;
      width: 850px; margin: 0 auto; display: flex; margin-bottom: 25px;
    }
    .in2_deImg{ background-color: #f5f5f5;
      width: 390px; padding: 45px 0px 35px; display: flex; justify-content: center;
    }
    .in2_deWrap{ background-color: #fff;
      width: 460px;
    }
    .in2_name{
      width: 100%; height: 54%; padding: 65px 0 75px; text-align: center;
    }
    .in2_name>div:nth-child(1){
      font-size: 20px; line-height: 20px; color: #222; font-weight: 600;
    }
    .in2_name>div:nth-child(2){
      font-size: 30px; line-height: 34px; color: #222; font-weight: 600; padding: 20px 0 6px;
    }
    .in2_name>div:nth-child(3){
      font-size: 20px; line-height: 20px; color: #444; font-weight: 500;
    }

    .in2_botWrap{
      width: 100%; height: 46%; display: flex; align-items: flex-end; justify-content: center;
    }
    .in2_bot{
      width: 100%; margin: 0 45px;
    }
    .in2_price{
      display: flex; align-items: flex-end; justify-content: center;
    }
    .in2_price>div:nth-child(1){ padding-bottom: 5px;
      font-size: 22px; line-height: 22px; color: #969696; font-weight: 500; text-decoration: line-through;
    }
    .in2_DC{
      padding-left: 10px; text-align: right;
    }
    .in2_DC>div:nth-child(1){
      font-size: 24px; line-height: 24px; color: #000; font-weight: 700;
    }
    .in2_DC>div:nth-child(1)>span{
      font-size: 34px; line-height: 34px;
    }
    .in2_DC>div:nth-child(2){
      font-size: 42px; line-height: 42px; color: #0455bf; font-weight: 800;
    }
    .in2_go{
      background: #0455bf;  /* fallback for old browsers */
      background: -webkit-linear-gradient(to right, #427ecf, #0455bf);  /* Chrome 10-25, Safari 5.1-6 */
      background: linear-gradient(to right, #427ecf, #0455bf); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
      margin: 30px 0 35px; border-radius: 40px; width: 100%;
      transition-duration: 0.6s;
    }
    .in2_go:hover{
      filter: brightness(110%);
    }
    .in2_go>a{
      width: 100%; height: 100%; display: flex; justify-content: space-between;
      padding: 18px 30px; border-radius: 30px;
    }
    .in2_go>a>div:nth-child(1){
      font-size: 30px; line-height: 30px; color: #fff; font-weight: 600; font-style: italic;
    }
    .in2_go>a>div:nth-child(1)>span{
      font-size: 20px; line-height: 20px;
    }
    .in2_go>a>div:nth-child(2){
      display: flex; align-items: center;
    }
    .in2_go>a>div:nth-child(2)>img{
      width: 100%; height: 100%; object-fit: contain;
    }

    /*MD*/
    .in3{
      width: 1200px; position: relative; top: -78px;
    }
    .in3>div:nth-child(1){
      width: 100%; height: 744px;
    }
    .in3_a1{ position: absolute; top: 200px; left: 400px;
      width: 530px; height: 500px; display: block;
    }
    .in3deWrap{padding: 70px 120px; display: flex;
      width: 1200px; background-color: #003e8e;
    }
    .in3de{
      width: 290px;
    }
    .in3de_2{
      margin: 0 45px;
    }
    .in3de_top{ background-image: url('http://winv007.img18.kr/crazy11web/plan/a_summer24/PC_in3_img1.jpg');
      width: 100%; height: 367px; position: relative; transition-duration: 0.6s;
    }
    .in3de_top:hover{
      filter: brightness(110%);
    }
    .in3de_top2{ background-image: url('http://winv007.img18.kr/crazy11web/plan/a_summer24/PC_in3_img2.jpg');}
    .in3de_top3{ background-image: url('http://winv007.img18.kr/crazy11web/plan/a_summer24/PC_in3_img3.jpg');}

    .in3de_top>a{
      width: 100%; height: 100%; display: block;
    }
    .in3de_top>a>div{
      width: 50px; height: 50px; background-color: #0455bf;
      position: absolute; right: -5px; top: -5px;
      font-size: 20px; line-height: 50px; color: #fff; font-weight: 600; text-align: center;
      
    }
    .in3de_top>a>div>span{
      font-size: 14px;
    }
    .in3de_bot{
      width: 100%; padding: 30px 0 20px;
    }
    .in3de_bot>div{
      text-align: center;
    }
    .in3de_bot>div:nth-child(1){
      font-size: 22px; line-height: 25px; font-weight: 500; color: #fff;
    }
    .in3de_bot>div:nth-child(1)>span{
      font-size: 16px; font-weight: 400; color: #c0cdde;
    }
    .in3de_bot>div:nth-child(2){
      font-size: 16px; line-height: 16px; font-weight: 400; color: #969696;
      text-decoration: line-through; padding: 20px 0 10px;
    }
    .in3de_bot>div:nth-child(3){
      font-size: 30px; line-height: 30px; font-weight: 700; color: #ffff00;
    }

    /*수퍼세일*/
    .in4{ padding-bottom: 20px;
      width: 100%; position: relative; top: -78px;
      background: #000;  /* fallback for old browsers */
      background: -webkit-linear-gradient(to right, #252525, #000);  /* Chrome 10-25, Safari 5.1-6 */
      background: linear-gradient(to right, #252525, #000); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */

    }
    .in4_TOPT{ background-color: #000;
      width: 100%; padding: 25px 70px; display: flex; justify-content: space-between;
    }
    .in4_TOPT div{
      color: #fff; font-size: 25px; line-height: 25px; font-weight: 600;
    }
    .in4_TOPT div span{
      font-size: 22px; font-weight: 500; color: #e5e5e5;
    }
    .in4_T{
      margin: 110px 0 80px; width: 100%;
    }
    .in4_T div{
      color: #fff;
    }
    .in4_T>div:nth-child(1){
      text-align: center; font-size: 62px; line-height: 62px; font-weight: 800; font-style: italic;
    }
    .in4_T>div:nth-child(2){ margin-top: 6px; letter-spacing: -1px;
      text-align: center; font-size: 28px; line-height: 28px; font-weight: 700; font-style: italic;
    }
    .in4_Tbot{
      width: 100%; display: flex; justify-content: center; margin-top: 20px;
    }
    .in4_Tbot div{ padding: 5px 15px;
      color: #b0b0b0; text-align: center; margin: 0 4px; border: 2px solid #b0b0b0; border-radius: 50px;
      font-size: 15px; line-height: 15px; font-weight: 400;
    }
    .in4_Tbot div span {
      font-size: 13px;
    }

    .in4deWrap{ margin-bottom: 40px;
      width: 100%; display: flex; justify-content: center;
    }
    .in4deWrap>div{ background-color: #f5f5f5; transition-duration: 0.6s;
      width: 386px; height: 635px; margin: 0 25px; position: relative;
    }
    .in4deWrap>div:hover{
      filter: brightness(110%);
    }
    .in4deimg{background-color: #f5f5f5;
      width: 100%; height: 438px; position: relative;
    }
    .in4deimg>img{
      width: 100%; height: 100%; object-fit: contain;
    }
    .in4deimg>a{
      width: 100%; height: 100%; position: absolute; top: 0; left: 0;
    }
    .in4per{
      position: absolute; top: -10px; right: -10px;
      width: 90px; height: 90px;
      background: #0556bf;  /* fallback for old browsers */
      background: -webkit-linear-gradient(120deg, #427ecf, #0556bf);  /* Chrome 10-25, Safari 5.1-6 */
      background: linear-gradient(120deg, #427ecf, #0556bf); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
      font-size: 38px; line-height: 38px; font-weight: 800; color: #fff;
      display: flex; align-items: center; justify-content: center; 
    }
    .in4per>span{
      font-size: 22px; font-weight: 600;
    }
    .in4botWrap{background-color: #0455bf;
      width: 100%; height: 197px; display: flex; align-items: center;
    }
    .in4bot{
      width: 100%;
    }
    .in4bot>div:nth-child(1){
      font-size: 22px; line-height: 22px; font-weight: 400; color: #2f82ee;
      text-decoration: underline; text-align: center;
    }
    .in4bot>div:nth-child(2){ margin: 15px 0 25px; text-align: center;
      font-size: 30px; line-height: 30px; font-weight: 600; color: #fff;
    }
    .in4_price{
      width: 100%; display: flex; justify-content: center;
    }
    .in4_price>div:nth-child(1){
      font-size: 22px; line-height: 40px; font-weight: 500; color: #999; text-decoration: line-through;
    }
    .in4_price>div:nth-child(2){ padding-left: 10px;
      font-size: 40px; line-height: 40px; font-weight: 700; color: #ffff00;
    }
  
/* BASIC css end */