﻿@charset "utf-8"; 

.myButton {
	box-shadow:inset 0px 1px 0px 0px #cf866c;
	background:linear-gradient(to bottom, #d0451b 5%, #bc3315 100%);
	background-color:#d0451b;
	border-radius:3px;
	border:1px solid #942911;
	display:inline-block;
	cursor:pointer;
	color:#ffffff;
	font-family:Arial;
	font-size:13px;
	padding:6px 24px;
	text-decoration:none;
	text-shadow:0px 1px 0px #854629;
}
.myButton:hover {
	background:linear-gradient(to bottom, #bc3315 5%, #d0451b 100%);
	background-color:#bc3315;
}
.myButton:active {
	position:relative;
	top:1px;
}



:root{
  --hana_color: #009590;
  --color_hana: #009590;
  --txt_color: rgba(25,31,40,1);
  --pnt_color : rgba(255, 0, 0, 0.594);

    --color_red_a:#d0451b;
    --color_red_b:#e23434;
    --color-btn-a: #00c6ff;
    --color-btn-b: #2c04f7c0;
    --color-banner-bg: rgb(168, 58, 223);
    --color-main-light-100: rgba(54,194,186,0.1);
    --color-point: rgba(34,51,89,1);
    --color-m-1: rgb(5, 154, 253);
    --color-m-2: rgba(7, 175, 38, 0);
    --color-m-3: rgba(7, 175, 38, 0);
    --color-sub-point: rgba(81,136,245,1);

    --color-gray-100: rgba(245,247,249,1);
    --color-gray-200: rgba(239,240,242,1);
    --color-gray-300: rgba(222,223,226,1);
    --color-gray-500: rgba(182,187,197,1);
    --color-gray-700: rgb(139, 143, 151);
    --color-gray-900: rgba(98,108,121,1);
    --color-black-300: rgba(25,31,40,1);
    --color-red: rgba(248,52,70,1);
    --color-blue:blue;
    --txt-color-def: rgba(25,31,40,1);
    --txt-thin: 100;
    --txt-light: 300;
    --txt-regular: 400;
    --txt-medium: 500;
    --txt-semibold: 600;
    --txt-bold: 700;
    --txt-extrabold: 800}
    .buy_banner{width:70%}


    .material-icons {
        font-family: 'Material Icons';
        font-weight: normal;
        font-style: normal;
        font-size: 40px;  /* Preferred icon size */
        display: inline-block;
        line-height: 1;
        text-transform: none;
        letter-spacing: normal;
        word-wrap: normal;
        white-space: nowrap;
        direction: ltr;
      
        /* Support for all WebKit browsers. */
        -webkit-font-smoothing: antialiased;
        /* Support for Safari and Chrome. */
        text-rendering: optimizeLegibility;
      
        /* Support for Firefox. */
        -moz-osx-font-smoothing: grayscale;
      
        /* Support for IE. */
        font-feature-settings: 'liga';
      }

      
    @media screen and (max-width:960px){ .buy_banner{width:100%}}

.wh22 { width:22% !important}
.wh25 { width:25% !important}
.wh50 { width:50% !important; display: block;}
.wh75 { width:75% !important; display: block;}
.wh100 { width:100% !important}


/* 패딩 스타일 */
.p0 { padding:0em !important}
.pt025 { padding-top:0.25em !important}
.pt050 { padding-top:0.5em !important}
.pt075 { padding-top:0.75em !important}
.pt100 { padding-top:1em !important}
.pt125 { padding-top:1.25em !important}
.pt150 { padding-top:1.5em !important}
.pt200 { padding-top:2em !important}

.pr0 { padding-right:0em !important}
.pr5 { padding-right:5em !important}
.pr10 { padding-right:10em !important}
.pr15 { padding-right:15em !important}
.pr20 { padding-right:20em !important}
.pr25 { padding-right:25em !important}
.pr30 { padding-right:30em !important}
.pr35 { padding-right:35em !important}
.pr40 { padding-right:40em !important}
.pr45 { padding-right:45em !important}
.pr50 { padding-right:50em !important}

.pb0 { padding-bottom:0em !important}
.pb5 { padding-bottom:5em !important}
.pb10 { padding-bottom:10em !important}
.pb15 { padding-bottom:15em !important}
.pb20 { padding-bottom:20em !important}
.pb25 { padding-bottom:25em !important}
.pb30 { padding-bottom:30em !important}
.pb35 { padding-bottom:35em !important}
.pb40 { padding-bottom:40em !important}
.pb45 { padding-bottom:45em !important}
.pb50 { padding-bottom:50em !important}
.pb55 { padding-bottom:55em !important}
.pb60 { padding-bottom:60em !important}
.pb65 { padding-bottom:65em !important}
.pb70 { padding-bottom:70em !important}
.pb75 { padding-bottom:75em !important}
.pb80 { padding-bottom:80em !important}
.pb85 { padding-bottom:85em !important}
.pb90 { padding-bottom:90em !important}
.pb95 { padding-bottom:95em !important}

.pl0 {padding-left:0 !important}
.pl5 {padding-left:5em !important}
.pl10 {padding-left:10em !important}
.pl15 { padding-left:15em !important}
.pl20 { padding-left:20em !important}
.pl25 { padding-left:25em !important}
.pl30 { padding-left:30em !important}
.pl35 { padding-left:35em !important}
.pl40 { padding-left:40em !important}
.pl45 { padding-left:45em !important}
.pl50 { padding-left:50em !important}
.pl55 { padding-left:55em !important}
.pl60 { padding-left:60em !important}
.pl65 { padding-left:65em !important}
.pl70 { padding-left:70em !important}
.pl75 { padding-left:75em !important}
.pl80 { padding-left:80em !important}
.pl85 { padding-left:85em !important}
.pl90 { padding-left:90em !important}
.pl95 { padding-left:95em !important}

.p10 {padding:10em !important}
.p15 {padding:15em !important}
.p20 {padding:20em !important}


/* 마진 스타일 */
.mt0 { margin-top:0 !important}
.mt5 { margin-top:5px !important}
.mt10 { margin-top:10px !important}
.mt15 { margin-top:15px !important}
.mt20 { margin-top:20px !important}
.mt25 { margin-top:25px !important}
.mt30 { margin-top:30px !important}
.mt35 { margin-top:35px !important}
.mt40 { margin-top:40px !important}
.mt45 { margin-top:45px !important}
.mt50 { margin-top:50px !important}
.mt55 { margin-top:55px !important}
.mt60 { margin-top:60px !important}
.mt62 { margin-top:62px !important}
.mt65 { margin-top:65px !important}
.mt70 { margin-top:70px !important}
.mt75 { margin-top:75px !important}
.mt80 { margin-top:80px !important}
.mt85 { margin-top:85px !important}
.mt90 { margin-top:90px !important}
.mt95 { margin-top:95px !important}
.mt100 { margin-top:100px !important}


.mr0 { margin-right:0 !important}
.mr5 { margin-right:5px !important}
.mr8 { margin-right:8px !important}
.mr10 { margin-right:10px !important}
.mr15 { margin-right:15px !important}
.mr20 { margin-right:20px !important}
.mr25 { margin-right:25px !important}
.mr30 { margin-right:30px !important}
.mr35 { margin-right:35px !important}
.mr40 { margin-right:40px !important}
.mr45 { margin-right:45px !important}
.mr50 { margin-right:50px !important}
.mr55 { margin-right:55px !important}
.mr60 { margin-right:60px !important}
.mr65 { margin-right:65px !important}
.mr70 { margin-right:70px !important}

.mb0 { margin-bottom:0 !important}
.mb5 { margin-bottom:5px !important}
.mb10 { margin-bottom:10px !important}
.mb15 { margin-bottom:15px !important}
.mb20 { margin-bottom:20px !important}
.mb25 { margin-bottom:25px !important}
.mb30 { margin-bottom:30px !important}
.mb35 { margin-bottom:35px !important}
.mb40 { margin-bottom:40px !important}
.mb45 { margin-bottom:45px !important}
.mb50 { margin-bottom:50px !important}
.mb55 { margin-bottom:55px !important}
.mb60 { margin-bottom:60px !important}
.mb65 { margin-bottom:65px !important}
.mb70 { margin-bottom:70px !important}
.mb75 { margin-bottom:75px !important}
.mb80 { margin-bottom:80px !important}
.mb85 { margin-bottom:85px !important}
.mb90 { margin-bottom:90px !important}
.mb95 { margin-bottom:95px !important}
.mb100 { margin-bottom:100px !important}

.ml0 { margin-left:0 !important}
.ml5 { margin-left:5px !important}
.ml10 { margin-left:10px !important}
.ml15 { margin-left:15px !important}
.ml20 { margin-left:20px !important}
.ml25 { margin-left:25px !important}
.ml30 { margin-left:30px !important}
.ml35 { margin-left:35px !important}
.ml40 { margin-left:40px !important}
.ml45 { margin-left:45px !important}
.ml50 { margin-left:50px !important}
.ml55 { margin-left:55px !important}
.ml56 { margin-left:56px !important}
.ml57 { margin-left:57px !important}
.ml58 { margin-left:58px !important}
.ml59 { margin-left:59px !important}
.ml60 { margin-left:60px !important}
.ml65 { margin-left:65px !important}
.ml70 { margin-left:70px !important}
.ml75 { margin-left:75px !important}
.ml80 { margin-left:80px !important}
.ml85 { margin-left:85px !important}
.ml90 { margin-left:90px !important}
.ml95 { margin-left:95px !important}
.ml100 { margin-left:100px !important}

.m10 {margin:10px !important}
.m20 {margin:20px !important}
.m30 {margin:30px !important}

.ma0 {margin:0 auto !important}

/* 레이아웃 설정 */

/* clear */
.cb {clear:both !important}

/* float */
.fl {float:left !important}
.fr {float:right !important}

.flo_clear:after{display:block;clear:both;content:''}

/* display:block */
.db {display:block !important}
.di {display:inline !important}
.dib {display:inline-block !important}

.w100dib {width:100%;display:inline-block;}

/* position:relative */
.pos_rel{position:relative !important}
.pos_abs{position:absolute !important}
.pos_fix{position:fixed !important}
.pos_center { justify-content: center !important}


/* 텍스트 스타일*/

.fwhite {color:#ffffff !important}
.fblack {color:#252525 !important}
.forange{color:#f26522 !important}
.fred{color:#d70102 !important}
.fyellow{color:yellow !important}
.fblue{color:blue !important}
.c_main {color:#009590 !important}

/* font-size */
.f09{font-size:0.9em !important}
.f10{font-size:1em !important}
.f15{font-size:1.5em !important}
.f20{font-size:2.0em !important}
.f25{font-size:2.5em !important}
.f30{font-size:3.0em !important}
.f35{font-size:3.5em !important}
.fwn {font-weight:normal !important}
.fwb {font-weight:bold !important}

/* letter-spacing */
.ltt0{letter-spacing:0px !important}
.ltt1{letter-spacing:-1px !important}
.ltt2{letter-spacing:-0.05em !important}

/* underline */
.dec_line{text-decoration:underline !important}
.dec_line_none{text-decoration:none !important}

/* text-align */
.tal{text-align:left !important}
.tar{text-align:right !important}
.tac{text-align:center !important}

/* text vertical-align:middle */
.vat {vertical-align:top !important}
.vam {vertical-align:middle !important}
.vab {vertical-align:bottom !important}

/* line-height */
.lh90 {line-height:90%}
.lh100 {line-height:100%}
.lh110 {line-height:110%}
.lh120 {line-height:120%}
.lh130 {line-height:130%}
.lh135 {line-height:135%}


/* 배경보더 관련 스타일 */

/* background-image */
.bnone {background:none !important}

/* border */
.b0 {border:0 !important}
.bt0 {border-top:0 !important}
.bl0 {border-left:0 !important}
.br0 {border-right:0 !important}
.bb0 {border-bottom:0 !important}
.bb1 {border-bottom:1px solid #e1e1e1}
.bb2 {border-bottom:1px solid #252525}

.blind{position:absolute;left:-9999px;font-size:0;width:0;height:0;text-indent:-9999px;overflow:hidden}
/* button css */
.animation{
  }
.animation:hover{
    opacity:1; /* 투명도 조절 */
    background-color:#ba5ceb69;
    cursor:pointer; /* 마우스 올렸을 때 손모양 마우스 */
    transition: all 0.5s ease-out; /* 애니메이션 천천히 */ 
  }



  .item_end {align-items: end;}
  .item_center {align-items: center;}

