echajoa/design/staff/assets/css/layout.css

@charset "utf-8";


header{
  height:81px;
}
header .header--wrapper{
  width:100%;
  position:fixed;
  top:0px;
  left:0px;
  z-index: 10;
  border-bottom:1px solid #eee;
  display:flex;
  align-items:center;
  justify-content:center;
  background:#fff;
  height:81px;
}
header .header--wrapper .header--contents{
  width:100%;
  max-width:1200px;
  display:flex;
  align-items:center;
  justify-content:flex-start;
}
header .header--wrapper .header--contents .logo{
  width:132px;
  min-width:132px;
  height:40px;
  background:url(../img/logo.png) no-repeat center;
}

header .header--wrapper .header--contents .gnb--wrapper{
  margin-left:110px;
  width:100%;
  display: flex;
}

header .header--wrapper .header--contents .gnb--wrapper > a{
  font-weight: 500;
  font-size: 17px;
  text-align: center;
  letter-spacing: -0.03em;
  color: #222222;
  margin-right:50px;
}
header .header--wrapper .header--contents .gnb--wrapper > a:last-child{
  margin-right:0px;
}

header .header--wrapper .header--contents .gnb--wrapper > a.actv{
  color:#417FFA;
  font-weight:bold;
}

header .header--wrapper .header--contents .log--menu--wrap{
  display: flex;
}
header .header--wrapper .header--contents .log--menu--wrap a{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width:100px;
  height:43px;
  border: 1px solid rgba(145, 161, 193, 0.3);
  border-radius: 50px;
  margin-right:15px;

  font-weight: 400;
  font-size: 14px;
  text-align: center;
  letter-spacing: -0.03em;

  color: #5C6A85;
}

header .header--wrapper .header--contents .log--menu--wrap a.on{
  border: 1px solid rgba(65, 127, 250, 0.3);
  color: #417FFA;
  font-weight:500;
}

header .header--wrapper .header--contents .log--menu--wrap a:last-child{
  margin-right:0px;
}

.home--contents{
  background:url(../img/main_bg.png) no-repeat center 148px;
}

.main--search{
  padding-top:155px;
}
.main--search .main--search--wrap h2{
  font-weight: 700;
  font-size: 55px;
  text-align: center;
  letter-spacing: -0.03em;
  color: #333333;
  line-height: 1.5;
}
.main--search .main--search--wrap .main--search--form{
  display: flex;
  align-items: center;
  justify-content: center;
  margin-top:70px;
}
.main--search .main--search--wrap .main--search--form input{
  width:100%;
  max-width:450px;
  height: 72px;
  background: #FFFFFF;
  border: 2px solid #EEEEEE;
  border-radius: 12px;
  padding-left:30px;
}

.main--search .main--search--wrap .main--search--form input::placeholder{
  font-weight: 400;
  font-size: 17px;
  letter-spacing: -0.03em;
  color: #B7B7B7;
}

.main--search .main--search--wrap .main--search--form .search--btn{
  width: 150px;
  height: 72px;
  background: #417FFA;
  border-radius: 12px;
  display: flex;
  align-items: center;
  justify-content: center;

  font-weight: 700;
  font-size: 17px;
  text-align: center;
  letter-spacing: -0.03em;
  color: #FFFFFF;
  margin-left:20px;
}



.middle--contents{
  margin-top:228px;
  padding-bottom:160px;
}
.middle--contents .middle--contents--wrap{
  width:100%;
  display:flex;
  justify-content:center;
}
.middle--contents .middle--contents--wrap .step--wrap{
  width:100%;
  max-width:1200px;
  background: url(../img/phone_bg.png) no-repeat right center;
  padding-top:58px;
  padding-bottom:98px;
}
.middle--contents .middle--contents--wrap .step--wrap > h2{
  font-weight: 300;
  font-size: 40px;
  line-height: 100%;
  letter-spacing: -0.03em;
  color: #111111;
}

.middle--contents .middle--contents--wrap .step--wrap > h2 span{
  font-weight: 700;
}

.middle--contents .middle--contents--wrap .step--wrap > ul{
  position: relative;
  margin-top:80px;
}
.middle--contents .middle--contents--wrap .step--wrap > ul:after{
  content:'';
  display: block;
  width:1px;
  height:100%;
  position: absolute;
  top:0px;
  left:24px;
  z-index: -1;
  background: #eee;
}
.middle--contents .middle--contents--wrap .step--wrap > ul > li{
  display: flex;
  align-items: center;
  justify-content:flex-start;
  margin-bottom:55px;
}
.middle--contents .middle--contents--wrap .step--wrap > ul > li:last-child{
  margin-bottom:0px;
}

.middle--contents .middle--contents--wrap .step--wrap > ul > li .numb{
  width: 50px;
  height: 50px;
  border-radius: 50px;
  background: #EEEEEE;
  display: flex;
  align-items: center;
  justify-content: center;


  font-weight: 500;
  font-size: 13px;
  letter-spacing: -0.03em;
  color: #A0A0A0;
}

.middle--contents .middle--contents--wrap .step--wrap > ul > li .numb.on{
  color:#fff;
  background: #417FFA;
}

.middle--contents .middle--contents--wrap .step--wrap > ul > li .desc{
  margin-left:25px;
}
.middle--contents .middle--contents--wrap .step--wrap > ul > li .desc h2{
  font-weight: 500;
  font-size: 18px;
  line-height: 100%;
  letter-spacing: -0.03em;
  color: #111111;
  padding:0px;
  margin:0px;
}
.middle--contents .middle--contents--wrap .step--wrap > ul > li .desc p{
  font-weight: 350;
  font-size: 16px;
  line-height: 100%;
  letter-spacing: -0.03em;
  color: #777777;
  margin-top:12px;
}


footer{
  width:100%;
  background: #FAFAFA;
  display: flex;
  justify-content:center;
}
footer > div{
  width:100%;
  max-width:1200px;
  display:flex;
  justify-content:flex-start;
  padding-top:35px;
  padding-bottom:45px;
}

footer > div .logo{
  width:161px;
  height:50px;
  background: url(../img/foot_logo.png) no-repeat center;
  margin-right:104px;
}
footer > div > div p span{
  font-weight: 350;
  font-size: 15px;
  letter-spacing: -0.03em;
  color: #333333;
  line-height:100%;
  padding-right:24px;
  position: relative;
}
footer > div > div p span:after{
  content:'';
  display: block;
  width:1px;
  height:13px;
  background:#c4c4c4;
  position: absolute;
  top:50%;
  transform: translateY(-50%);
  right:11px;
  margin-top:1px;
}
footer > div > div p span:last-child:after{
  display:none;
}

footer > div > div p.copy--right{
  margin-top:35px;
  font-weight: 350;
  font-size: 15px;
  line-height: 100%;
  text-transform: uppercase;
  color: #333333;
}



.main--visual{
  width:100%;
  height:350px;
  background:url(../img/main_slide.jpg) no-repeat center;
}

.main--visual .main--visual--title--wrap{
  width:100%;
  max-width:1200px;
  margin:0 auto;
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  flex-direction: column;
}
.main--visual .main--visual--title--wrap > h2{
  font-weight: 700;
  font-size: 35px;
  letter-spacing: -0.03em;
  color: #FFFFFF;
  padding-top:182px;
}

.main--visual .main--visual--title--wrap > p{
  font-weight: 300;
  font-size: 15px;
  letter-spacing: -0.03em;
  line-height: 2;
  color: #EBEBEB;
  margin-top:35px;
}

.main--visual .main--visual--title--wrap .main--visual--contents{
  display:flex;
  align-items: center;
  justify-content: flex-end;
  /*margin-top:134px;*/
  width:100%;
}

.main--visual .main--visual--title--wrap .main--visual--contents .box--01{
  width: 76px;
  height: 76px;
  background: #00C2FF;
  box-shadow: 0px 10px 10px rgba(11, 33, 69, 0.5);
  border-radius: 15px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
}
.main--visual .main--visual--title--wrap .main--visual--contents .box--02{
  width: 76px;
  height: 76px;
  background: #1E75FF;
  box-shadow: 0px 10px 10px rgba(11, 33, 69, 0.5);
  border-radius: 15px;
  margin-left:15px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
}

.main--visual .main--visual--title--wrap .main--visual--contents .box--01 h2,
.main--visual .main--visual--title--wrap .main--visual--contents .box--02 h2{
  font-weight: 400;
  font-size: 13px;
  line-height: 100%;
  text-align: center;
  letter-spacing: -0.03em;
  color: #FFFFFF;
  padding:0px;
  margin:0px;
}


.main--visual .main--visual--title--wrap .main--visual--contents .box--01 div,
.main--visual .main--visual--title--wrap .main--visual--contents .box--02 div{
  font-weight: 700;
  font-size: 15px;
  line-height: 100%;
  text-align: center;
  color: #FFFFFF;
  padding:0px;
  margin:0px;
  margin-top:12px;
}

.main--visual .main--visual--title--wrap .main--visual--contents .car--find{
  width: 570px;
  height: 76px;
  background: #FFFFFF;
  box-shadow: 0px 10px 10px rgba(11, 33, 69, 0.5);
  border-radius: 12px;
  margin-left:45px;
  display: flex;
  align-items:center;
  justify-content: flex-start;
  position:relative;

}
.main--visual .main--visual--title--wrap .main--visual--contents .car--find > div:nth-of-type(1){
  width:157px;
  padding-left:30px;
  padding-right:30px;
  box-sizing: border-box;
  border-right:1px solid #eee;
  height:76px;
  display: flex;
  align-items: flex-start;
  justify-content: center;
  flex-direction: column;
}
.main--visual .main--visual--title--wrap .main--visual--contents .car--find > div:nth-of-type(2){
  padding-left:30px;
}
.main--visual .main--visual--title--wrap .main--visual--contents .car--find > div >h2{
  font-weight: 400;
  font-size: 13px;
  line-height: 100%;
  letter-spacing: -0.03em;
  color: #7B838A;
  padding:0px;
  margin:0px;
}

.main--visual .main--visual--title--wrap .main--visual--contents .car--find > div > div{
  font-weight: 400;
  font-size: 15px;
  line-height: 100%;
  color: #000000;
  margin-top:12px;
}

.main--visual .main--visual--title--wrap .main--visual--contents .car--find .car--find--btn{
  position: absolute;
  top:50%;
  transform: translateY(-50%);
  right:20px;

  width: 120px;
  height: 59px;
  background: #1E75FF;
  border-radius: 8px;

  font-weight: 700;
  font-size: 14px;
  color: #FFFFFF;
}
.main--visual .main--visual--title--wrap .main--visual--contents .car--find .car--find--btn .zoom--icon{
  display: inline-flex;
  min-width:13px;
  width:13px;
  height:13px;
  background:url(../img/sch_icon.png) no-repeat center;
  margin-left:9px;
  position: relative;
  top:1px;
}

.car--list--wrap{
  max-width:1200px;
  margin:0 auto;
  padding-top:80px;
}

.car--list--wrap .title--wrapper{
  display:flex;
  align-items: center;
  justify-content: space-between;
}

.car--list--wrap .title--wrapper h2{
  font-weight: 700;
  font-size: 22px;
  line-height: 100%;
  letter-spacing: -0.03em;
  color: #000000;
}
.car--list--wrap .title--wrapper .more--btn{
  font-weight: 700;
  font-size: 15px;
  line-height: 100%;
  letter-spacing: -0.03em;
  color: #8B919C;
}

.car--list--wrap .title--wrapper select,
.car--list--wrap .title--wrapper input{
  height:45px;
  border: 1px solid #D8DEE8;
  border-radius:10px;
}
.car--list--wrap .title--wrapper button{
  border-radius:10px;
}

.car--list--wrap > ul{
  display: flex;
  align-items:center;
  gap : 45px;
  margin-top:40px;
  flex-wrap:wrap;
}
.car--list--wrap > ul > li{}

.car--list--wrap > ul > li .car--box--wrap{
  background: #F8F8FA;
  border-radius: 40px;
  padding:40px 0px;
  width: 266px;
  height: 420px;
  display: flex;
  align-items:center;
  justify-content:flex-start;
  flex-direction:column;
}
.car--list--wrap > ul > li .car--box--wrap .car--name{
  width:186px;
  max-width:186px;
  text-overflow: ellipsis;
  white-space: nowrap;

  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 700;
  font-size: 18px;
  line-height: 100%;
  color: #333237;
  text-align: left;
}

.car--list--wrap > ul > li .car--box--wrap.on{
  border: 1px solid #1E75FF;
  box-sizing: border-box;
  background:#fff;
}
.car--list--wrap > ul > li .car--box--wrap .thumb--wrap{
  height:160px;
  min-height:160px;
  width:186px;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow:hidden;
}




.car--list--wrap > ul > li .car--box--wrap .car--info{
  width:186px;
}
.car--list--wrap > ul > li .car--box--wrap .car--info dl{
  display: flex;
  justify-content: flex-start;
  margin-bottom:15px;
}
.car--list--wrap > ul > li .car--box--wrap .car--info dl:last-child{
  margin-bottom:0px;
}

.car--list--wrap > ul > li .car--box--wrap .car--info dl dt,
.car--list--wrap > ul > li .car--box--wrap .car--info dl dd{
  font-weight: 350;
  font-size: 14px;
  line-height: 100%;
  color: #5C5B63;
}
.car--list--wrap > ul > li .car--box--wrap .car--info dl dt{
  margin-right:3px;
}
.car--list--wrap > ul > li .car--box--wrap .status--wrap{
  width:186px;
  margin-top:30px;
}
.car--list--wrap > ul > li .car--box--wrap .status--wrap span{
  height: 30px;
  display: inline-flex;
  align-items: center;
  background: #333237;
  border-radius: 50px;
  padding:0 15px;
  text-align: center;

  font-weight: 500;
  font-size: 13px;
  color: #FFFFFF;

}

.car--list--wrap > ul > li .car--box--wrap .status--wrap span.tr--delay{
  background: #ACBCCF;
  border-radius: 50px;
}
.car--list--wrap > ul > li .car--box--wrap .status--wrap span.tr--fail{
  background: #E12544;
  border-radius: 50px;
}
.car--list--wrap > ul > li .car--box--wrap .status--wrap span.sell--fail{
  background: #FB4F29;
  border-radius: 50px;
}

.car--list--wrap > ul > li .car--box--wrap .status--wrap span.ready{
  background: #A5AEBC;
}
.car--list--wrap > ul > li .car--box--wrap .btn--wrapper{
  margin-top:15px;
}
.car--list--wrap > ul > li .car--box--wrap .btn--wrapper button{
  width:186px;
  height: 50px;
  display:flex;
  align-items:center;
  justify-content:center;
  background: #1E75FF;
  border-radius: 15px;

  font-weight: 500;
  font-size: 14px;
  text-align: center;
  letter-spacing: -0.03em;
  color: #FFFFFF;

}
.car--list--wrap > ul > li .car--box--wrap .btn--wrapper .arrow--ic{
  display: inline-flex;
  min-width:14px;
  width:14px;
  height:14px;
  background:url(../img/button_arrow_ic.svg) no-repeat center;
  margin-left:10px;
  position: relative;
  top:1px;
}

.car--list--wrap.ty2 > ul{
  gap:34px;
}
.car--list--wrap.ty2 > ul > li .car--box--wrap{
  padding:0px;
  border-radius:0px;
  background:transparent;
  width:274px;
}
.car--list--wrap.ty2 > ul > li .car--box--wrap .thumb--wrap{
  background: #F7F7F7;
  width:100%;
  height:190px;
  position: relative;
}
.car--list--wrap.ty2 > ul > li .car--box--wrap .thumb--wrap img{
  position: absolute;
  top:50%;
  left:50%;
  transform:translate(-50%, -50%);
  max-width:274px;
  max-height:190px;
  width:auto;
  height:auto;
}

.car--list--wrap.ty2 > ul > li .car--box--wrap .car--name{
  width:100%;
  max-width:100%;
  text-align: left;
  padding-top:35px;
  padding-bottom:25px;
}

.car--list--wrap.ty2 > ul > li .car--box--wrap .car--info{
  width:100%;
}

.car--list--wrap.ty2 > ul > li .car--box--wrap .status--wrap{
  width:100%;
  justify-content: flex-start;
}
.car--list--wrap.ty2 > ul > li .car--box--wrap .status--wrap span{
  min-width:64px;
  justify-content: center;
}

.car--list--wrap.vertical--type > ul{
  flex-wrap:wrap;
}
.car--list--wrap.vertical--type > ul > li{
  width:calc(50% - 22.5px);
}
.car--list--wrap.vertical--type > ul > li .car--box--wrap{
  width:100%;
  height:auto;
  display:flex;
  align-items:flex-start;
  flex-direction: row;
  padding:25px;
}

.car--list--wrap.vertical--type > ul > li .car--box--wrap .thumb--wrap{
  width:230px;
  min-width:230px;
  min-height:230px;
  height:230px;
  background: #fff;
  border-radius: 15px;
  margin-right:45px;
}
.car--list--wrap.vertical--type > ul > li .car--box--wrap .car--name{
  margin-bottom:20px;
}


/** 서브 페잊 **/
.sub--top--visual{
  height:150px;
  width:100%;
  background:url(../img/top_banner.jpg) no-repeat center;
  background-color: #1E75FF;
  display: flex;
  align-items:center;
  justify-content:center;
}

.sub--top--visual .contents--inner{
  width:100%;
  max-width:1200px;
  margin:0 auto;
}

.sub--top--visual .contents--inner > h2{
  font-weight: 700;
  font-size: 25px;
  line-height: 100%;
  letter-spacing: -0.02em;
  color: #FFFFFF;
}
.sub--top--visual .contents--inner > p{
  font-weight: 350;
  font-size: 15px;
  line-height: 100%;
  letter-spacing: -0.02em;
  color: #FFFFFF;
  margin-top:25px;
}


.top--nav--wrap{
  width:100%;
  border-bottom:1px solid #eee;
}
.top--nav--wrap .contents--inner{
  width:100%;
  max-width:1200px;
  margin:0 auto;
}
.top--nav--wrap .contents--inner .breadcrumbs--wrap{
  display: flex;
  align-items:center;
}
.top--nav--wrap .contents--inner .breadcrumbs--wrap > span{
  padding-left:20px;
  padding-right:30px;

  font-weight: 500;
  font-size: 14px;
  line-height: 100%;
  letter-spacing: -0.03em;
  color: #333333;

  background:url(../img/arrow_right_ic.svg) no-repeat right center;
}
.top--nav--wrap .contents--inner .breadcrumbs--wrap > span:nth-of-type(1){
  display:inline-flex;
  min-width:54px;
  width:54px;
  height:54px;
  border-right:1px solid #eee;
  border-left:1px solid #eee;
  background:url(../img/home_ic.svg) no-repeat center;
  padding:0px;
}
.top--nav--wrap .contents--inner .breadcrumbs--wrap > span:last-child{
  font-weight: 500;
  font-size: 14px;
  letter-spacing: -0.03em;
  color: #1E75FF;
  padding-right:0px;
  background: none;
}

.owner--information--wrap{
  width:100%;
  display: flex;
  align-items:center;
  justify-content:flex-start;
  flex-direction: column;
  padding-top:60px;
}
.owner--information--wrap .title--wrapper{
  max-width:1200px;
}
.bidding--count{
  white-space:nowrap;
  font-weight:700;
}
.owner--information--wrap .title--wrapper > h2,
.owner--information--wrap > h2{
  text-align: left;
  width:100%;
  max-width:1200px;
  margin:0 auto;

  font-weight: 700;
  font-size: 18px;
  line-height: 100%;
  letter-spacing: -0.02em;
  color: #222222;
}

.owner--information--wrap .sch--modules--wrap{
  width:100%;
  max-width:1200px;
  height: 85px;
  background: #0063FF;
  border-radius: 20px;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  margin-top:20px;
  padding:0 20px;
}


.owner--information--wrap .sch--modules--wrap > div input{
  height:45px;
  width:100%;
  font-weight: 350;
  font-size: 14px;
  letter-spacing: -0.02em;
  color:#222;
  border:0px;
  padding-left:42px;
  box-sizing: border-box;
}


.owner--information--wrap .sch--modules--wrap > div input::placeholder{
  font-weight: 350;
  font-size: 14px;
  letter-spacing: -0.02em;
  color: #B7B7B7;
}

.owner--information--wrap .sch--modules--wrap .user--info input{
  background:#fff url(../img/user_ic.svg) no-repeat 15px center;
  border-radius: 10px;
}

.owner--information--wrap .sch--modules--wrap .car--numb input{
  background:#fff url(../img/car_ic.svg) no-repeat 15px center;
  border-radius: 10px;
}

.owner--information--wrap .sch--modules--wrap label{
  font-weight: 500;
  font-size: 14px;
  line-height: 100%;
  letter-spacing: -0.02em;
  color: #FFFFFF;
}
.owner--information--wrap .sch--modules--wrap .phone--ftc--numb input{
  height:45px;
  width:100%;
  font-weight: 350;
  font-size: 14px;
  padding-left:15px;
  letter-spacing: -0.02em;
  border:0px;
  box-sizing: border-box;
  border-radius: 10px;
}
.owner--information--wrap .sch--modules--wrap .phone--ftc--numb select{
  height:45px;
  width:80px;
  font-weight: 350;
  font-size: 14px;
  padding-left:15px;
  letter-spacing: -0.02em;
  border:0px;
  box-sizing: border-box;
  border-radius: 10px;
  appearance:none;

  line-height: 100%;

  color: #333333;

  background: #fff url(../img/select_ic.svg) no-repeat calc(100% - 15px) center;
}


.owner--information--wrap .sch--modules--wrap button{
  width: 130px;
  height: 45px;
  background: #FF5C00;
  box-shadow: 0px 6px 6px rgba(0, 0, 0, 0.2);
  border-radius: 10px;

  font-weight: 700;
  font-size: 14px;
  text-align: center;
  letter-spacing: -0.02em;
  color: #FFFFFF;
  margin-left:20px;

}

.owner--information--wrap .sch--modules--wrap button .sch--ic{
  display: inline-flex;
  min-width:13px;
  width:13px;
  height:13px;
  background: url(../img/sch_ic.svg) no-repeat center;
  margin-left:10px;
}


.car--info--wrap{
  width:100%;
  max-width:1200px;
  margin:0 auto;
  padding-top:60px;
}
.car--info--wrap .title--wrapper > h2,
.car--info--wrap > h2{
  font-weight: 700;
  font-size: 18px;
  line-height: 100%;
  letter-spacing: -0.02em;
  color: #222222;
}
.car--info--wrap .form--wrap{
  padding-top:40px;
  display: flex;
  align-items:flex-start;
  gap:40px;
}

.car--info--wrap .form--wrap .form--groups{
  display:flex;
  align-items:flex-start;
  justify-content: flex-start;
  width:100%;
  flex-direction: column;
}
.car--info--wrap .form--wrap .form--groups > h2{
  font-weight: 500;
  font-size: 14px;
  line-height: 100%;
  letter-spacing: -0.02em;
  color: #333333;
}

.car--info--wrap .form--wrap .form--groups .form--group{
  width:100%;
  height:53px;
  margin-top:15px;
}
.car--info--wrap .form--wrap .form--groups .form--group select{
  height:53px;
  width:100%;
  appearance:none;
  background: #fff url(../img/select_ic.svg) no-repeat calc(100% - 15px) center;
  border: 1px solid #D8DEE8;
  border-radius: 10px;

  font-weight: 350;
  font-size: 14px;
  letter-spacing: -0.02em;
  color: #333333;
  padding-left:20px;
}
.car--info--wrap .form--wrap .form--groups .form--group input:disabled,
.car--info--wrap .form--wrap .form--groups .form--group select:disabled{
  background-color: #F5F9FE;
}


.car--info--wrap .form--wrap .form--groups .form--group.ty2{
  display: flex;
  align-items:center;
  flex-wrap:nowrap;
}
.car--info--wrap .form--wrap .form--groups .form--group input{
  height:53px;
  width:100%;
  appearance:none;
  background: #fff;
  border: 1px solid #D8DEE8;
  border-radius: 10px;

  font-weight: 350;
  font-size: 14px;
  letter-spacing: -0.02em;
  color: #333333;
  padding-left:20px;
}


.car--info--wrap .form--wrap .form--groups .form--group.file--wrap label{
  display:flex;
  align-items:center;
  justify-content: center;
  max-width:110px;
  width: 100%;
  height: 53px;
  margin-left:15px;
  border: 1px solid rgba(30, 117, 255, 0.5);
  border-radius: 10px;

  font-weight: 500;
  font-size: 14px;
  text-align: center;
  color: #1E75FF;
}

button.sch--btn--bl{
  width:100%;
  height: 53px;
  background: #FFFFFF;
  border: 1px solid rgba(30, 117, 255, 0.5);
  border-radius: 10px;

  font-weight: 500;
  font-size: 14px;
  letter-spacing: -0.02em;
  color: #1E75FF;
}
.car--info--wrap .form--wrap .form--groups .form--group .sch--ic--bl{
  display:inline-flex;
  width:15px;
  height:15px;
  margin-left:10px;
  background: url(../img/sch_ic_bl.svg) no-repeat center;
  position: relative;
  top:2px;
}

.car--info--wrap .btn--wrapper{
  width:100%;
  max-width:1200px;
  margin:0 auto;
  padding-top:70px;
  display:flex;
  align-items:center;
  justify-content: flex-end;
}
.car--info--wrap .btn--wrapper .next--btn{
  width: 240px;
  height: 65px;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  background: #1E75FF;
  border-radius: 10px;
  padding-left:30px;
  box-sizing: border-box;

  font-weight: 500;
  font-size: 14px;
  letter-spacing: -0.02em;
  color: #FFFFFF;

  position: relative;
}

.car--info--wrap .btn--wrapper .next--btn .next--ic{
  display: flex;
  width:15px;
  height:15px;
  position: absolute;
  top:50%;
  transform: translateY(-50%);
  right:30px;
  background: url(../img/arrow_right_btn.svg) no-repeat center;
}

.car--info--wrap .fixed--positon button{
  border-radius:10px;
}

.modal--wrap{
  position:fixed;
  top:0px;
  left:0px;
  width:100%;
  height:100%;
  background: rgba(65, 66, 67, 0.5);
  z-index: 10;
}



.modal--wrap .modal--content{
  position:absolute;
  top:50%;
  left:50%;
  width:100%;
  transform: translate(-50%, -50%);
  background: #FFFFFF;
  box-shadow: 0px 10px 15px rgba(0, 0, 0, 0.2);
  border-radius: 30px;
  padding:30px;
  box-sizing: border-box;
}

.modal--wrap .modal--content.ty2{
  padding:0px;
}

.modal--wrap .modal--content .title--wrap{
  position:relative;
}

.modal--wrap .modal--content .title--wrap .close--btn{
  width:36px;
  height:36px;
  border-radius:36px;
  position: absolute;
  top:0px;
  right:0px;
  background: url(../img/close_ic.svg) no-repeat center;
}

.modal .modal-content .icon--wrap{
  width:100%;
  display: flex;
  align-items:center;
  justify-content:center;
  padding-top:45px;
}
.modal .modal-content .icon--wrap .thumb.pp--ic{
  width:60px;
  height:60px;
  border-radius:60px;
  background:#E2E4F0 url(../img/pp_ic.svg) no-repeat center;
}

.modal .modal-content .modal--body > h2{
  font-weight: 500;
  font-size: 18px;
  line-height: 100%;
  text-align: center;
  letter-spacing: -0.03em;
  color: #000000;
  margin:0px;
  padding:0px;
}

.check--box .form--group{
  margin-bottom:15px;
}


.modal .modal-content .modal--body > p{
  font-weight: 350;
  font-size: 15px;
  text-align: center;
  letter-spacing: -0.03em;
  color: #666666;
  margin-top:20px;
}

.modal--wrap .modal--content .inner--contents{
  display: flex;
  align-items: center;
  justify-content:center;
  flex-direction: column;
}
.modal--wrap .modal--content.ty2 .inner--contents{
  padding:30px;
}

.modal--wrap .modal--content .inner--contents > h2{
  font-weight: 700;
  font-size: 18px;
  text-align: center;
  letter-spacing: -0.03em;
  color: #333333;
  margin:0px;
  margin-top:22px;
  line-height: 0px;
}
.modal--wrap .modal--content .inner--contents > p{
  font-weight: 350;
  font-size: 15px;
  text-align: center;
  letter-spacing: -0.02em;
  color: #777777;
  margin-top:20px;
}

.modal--wrap .modal--content .inner--contents .evt--thumb{
  width: 80px;
  height: 80px;
  border-radius:80px;
  background: #1E75FF url(../img/car_pl_ic.svg) no-repeat center;
}

.modal--wrap .modal--content .modal--btn--wrap{
  display: flex;
  align-items: center;
  width:100%;
  border-top:1px solid #eee;
}
.modal--wrap .modal--content .modal--btn--wrap button{
  width:100%;
  height:66px;
  border-right:1px solid #eee;

  font-weight: 400;
  font-size: 14px;
  text-align: center;
  letter-spacing: -0.02em;
  color: #000000;
}

.modal--wrap .modal--content .modal--btn--wrap button.on{
  color: #1E75FF;
}

.modal--wrap .modal--content .modal--btn--wrap button:last-child{
  border-right:0px;
}

.form--group input[type="radio"] + label{
  position:relative;
  display: flex;
  align-items:center;
  cursor: pointer;
  font-weight: 350;
  font-size: 14px;
  color: #333333;
}
.form--group input[type="radio"] + label:before{
  content:'';
  display: block;
  min-width:16px;
  width:16px;
  height:16px;
  background:url(../img/radio_off.svg) no-repeat center;
  margin-right:12px;
}
.form--group input[type="radio"]:checked + label:before{
  background:url(../img/radio_on.svg) no-repeat center;
}



.car--accident--log{
  width:100%;
  max-width:1200px;
  height: 190px;
  margin: 0 auto;

  background: #FFFFFF;
  border: 1px solid rgba(30, 117, 255, 0.3);
  border-radius: 20px;
  padding:35px 50px;
}

.car--accident--log h2{
  font-weight: 500;
  font-size: 20px;
  line-height: 100%;
  letter-spacing: -0.03em;
  color: #222222;
}

.car--accident--log .car--info{
  display:flex;
  align-items:center;
  margin-top:28px;
}
.car--accident--log .car--info .thumb{
  width: 64px;
  height: 64px;
  border-radius: 64px;
  background: #0063FF url(../img/duc_ic.svg) no-repeat center;
  margin-right:20px;
}

.car--accident--log .car--info .car--num--sch--info h2{
  font-weight: 700;
  font-size: 16px;
  line-height: 100%;
  letter-spacing: -0.02em;
  color: #1E75FF;
}
.car--accident--log .car--info .car--num--sch--info p{
  font-weight: 400;
  font-size: 15px;
  line-height: 100%;
  letter-spacing: -0.02em;
  color: #666666;
  padding:0px;
  margin:0px;
  margin-top:15px;
}


.car--accident--column{
  width:100%;
  max-width:1200px;
  margin:0 auto;
}
.car--accident--column > h2{
  height:58px;
  width:100%;
  background: #F7F7F9;
  display: flex;
  align-items: center;
  justify-content: flex-start;

  font-weight: 500;
  font-size: 15px;
  letter-spacing: -0.03em;
  color: #111111;
  padding-left:30px;
}


.car--accident--column .items--box{
  border:1px solid #eee;
  border-top:0px;
  padding:30px 30px 60px 30px;
  gap:20px;
  display:flex;
  flex-wrap:wrap;
}

.car--accident--column .items--box .car--accident--box{
  display:flex;
  background: #FFFFFF;
  border: 1px solid #EEEEEE;
  box-shadow: 0px 5px 5px rgba(239, 240, 241, 0.5);
  border-radius: 20px;
  width:calc( (100% / 4) - (60px / 4) );
  padding:25px;
}
.car--accident--column .items--box .car--accident--box .thumb{
  width:59px;
  height:59px;
  border-radius: 59px;
  margin-right:23px;
}

.car--accident--column .items--box .car--accident--box .thumb.log--01{background:#F7F7F9 url(../img/log_ic01.svg) no-repeat center;}
.car--accident--column .items--box .car--accident--box .thumb.log--02{background:#F7F7F9 url(../img/log_ic02.svg) no-repeat center;}
.car--accident--column .items--box .car--accident--box .thumb.log--03{background:#F7F7F9 url(../img/log_ic03.svg) no-repeat center;}
.car--accident--column .items--box .car--accident--box .thumb.log--04{background:#F7F7F9 url(../img/log_ic04.svg) no-repeat center;}
.car--accident--column .items--box .car--accident--box .thumb.log--05{background:#F7F7F9 url(../img/log_ic05.svg) no-repeat center;}
.car--accident--column .items--box .car--accident--box .thumb.log--06{background:#F7F7F9 url(../img/log_ic06.svg) no-repeat center;}
.car--accident--column .items--box .car--accident--box .thumb.log--07{background:#F7F7F9 url(../img/log_ic07.svg) no-repeat center;}
.car--accident--column .items--box .car--accident--box .thumb.log--08{background:#F7F7F9 url(../img/log_ic08.svg) no-repeat center;}

.car--accident--column .items--box .car--accident--box .desc{}
.car--accident--column .items--box .car--accident--box .desc h2{
  font-weight: 400;
  font-size: 14px;
  letter-spacing: -0.03em;
  color: #111111;
}
.car--accident--column .items--box .car--accident--box .desc > div{
  display: inline-flex;
  height: 22px;
  background: #F7F7F9;
  border-radius: 50px;
  padding:0 15px;

  font-weight: 350;
  font-size: 12px;
  color: #333333;
  margin-top:14px;
}

.car--accident--column .items--box .caution--text{
  background: #FBFBFD;
  border: 1px dashed rgba(30, 117, 255, 0.5);
  border-radius: 12px;

  display: flex;
  align-items:center;
  justify-content:center;
  width:100%;
  height:58px;
  font-weight: 350;
  font-size: 15px;
  text-align: center;
  letter-spacing: -0.03em;
  color: #333333;
  margin-top:10px;
}
.car--accident--column .items--box .caution--text strong{
  color: #1E75FF;
  font-weight:700;
  margin-left:5px;
}

.car--accident--column .items--box .caution--text .caution--ic{
  display: inline-flex;
  width:24px;
  height:24px;
  background:url(../img/caution_ic.svg) no-repeat center;
  margin-right:15px;
}


.description--text--wrap{
  border:1px solid #eee;
  border-top:0px;
  padding:30px 30px 0px 30px;
}
.description--text--wrap > h2{
  font-weight: 350;
  font-size: 14px;
  line-height: 100%;
  letter-spacing: -0.03em;
  color: #1E75FF;
}
.description--text--wrap .desc--contents{
  display: flex;
  flex-wrap:wrap;
  margin-top:40px;
}
.description--text--wrap .desc--contents dl{
  width:calc( 100% / 5);
  padding-bottom:60px;
}
.description--text--wrap .desc--contents dl dt{
  font-weight: 700;
  font-size: 14px;
  line-height: 100%;
  letter-spacing: -0.03em;
  color: #333333;
}
.description--text--wrap .desc--contents dl dd{
  font-weight: 350;
  font-size: 14px;
  line-height: 100%;
  letter-spacing: -0.03em;
  color: #444444;
  margin-top:20px;
}


.options--wrapper{
  width:100%;
  max-width:1200px;
  margin:0 auto;
}
.options--wrapper > h2{
  font-weight: 700;
  font-size: 18px;
  line-height: 100%;
  letter-spacing: -0.02em;
  color: #222222;
}

.options--wrapper > h2 .astc--text{
  font-weight: 700;
  font-size: 18px;
  letter-spacing: -0.02em;
  color: #1E75FF;
}
.options--wrapper > h2 .astc--text.ty2{
  color: #909EB5;
}

.options--wrapper .options--list{
  width:100%;
  border-top:1px solid #888;
  margin-top:20px;
  padding-top:40px;
}
.options--wrapper .options--list > h2{
  font-weight: 500;
  font-size: 14px;
  line-height: 100%;
  letter-spacing: -0.02em;
  color: #111111;
}
.options--wrapper .options--list > ul{
  display: flex;
  align-items: center;
  margin-top:30px;
  margin-bottom:50px;
}
.options--wrapper .options--list > ul >li{
  width:calc(100% / 4);
}
input[type="checkbox"] + label{
  font-weight: 350;
  font-size: 14px;
  line-height: 100%;
  color: #333333;
  display: flex;
  align-items:center;
  cursor: pointer;
}

input[type="checkbox"] + label:before{
  content:'';
  display: block;
  width:16px;
  height:16px;
  background:url(../img/check_off.svg) no-repeat center;
  margin-right:12px;
}
input[type="checkbox"]:checked + label:before{
  background:url(../img/check_on.svg) no-repeat center;
}


.options--wrapper .pic--add--wrap{
  display: flex;
  align-items: center;
  justify-content:space-between;
  width:100%;
  border-top:1px solid #888;
  margin-top:20px;
  padding-top:40px;
}
.options--wrapper .pic--add--wrap.bd-0{
  border:0px;
  padding-top:0px;
}

.options--wrapper .pic--add--wrap .add--box{
  width: 224px;
  height: 224px;
  display: flex;
  align-items: center;
  justify-content:center;
  flex-direction: column;

  background: #FFFFFF;
  border: 1px solid #EEEEEE;
  box-shadow: 0px 5px 5px rgba(239, 240, 241, 0.5);
  border-radius: 20px;
}
.options--wrapper .pic--add--wrap .add--box .thumb{
  width: 80px;
  height: 80px;
  border-radius: 80px;
  background: #F7F7F9;
  position: relative;
}

.options--wrapper .pic--add--wrap.view--type .add--box .thumb{
  width:200px;
  height:140px;
  border-radius:0px;
  margin:0 auto;
  overflow:hidden;
  background: transparent!important;
}

.options--wrapper .pic--add--wrap.view--type .add--box .thumb img{
  position: absolute;
  top:50%;
  left:50%;
  transform: translate(-50%, -50%);
  max-height:140px;
  max-width:200px;
  object-fit: cover;
}

.options--wrapper .pic--add--wrap.view--type .add--box.car--dashboard{
  position: relative;
}
.options--wrapper .pic--add--wrap.view--type .add--box.car--dashboard .thumb{
  height:204px;
  width:204px;
  position:absolute;
  top:50%;
  left:50%;
  transform: translate(-50%, -50%);
}
.options--wrapper .pic--add--wrap.view--type .add--box.car--dashboard .thumb img{
  width:100%;
  height:100%;
  max-width:204px;
  max-height:204px;
}
.options--wrapper .pic--add--wrap.view--type .add--box.car--dashboard .desc{
  z-index: 2;
  position: absolute;
  bottom:20px;
}



.options--wrapper .pic--add--wrap .add--box .thumb .add--btn{
  width: 26px;
  height: 26px;
  border-radius:26px;
  border: 1px solid #EDEFF1;
  box-shadow: 0px 2px 2px #DDE1E8;
  background:#fff url(../img/add_ic.svg) no-repeat center;
  position: absolute;
  top:0px;
  right:0px;
  cursor: pointer;
}

.options--wrapper .pic--add--wrap .add--box .thumb.car--01{ background:#f7f7f9 url(../img/car_pic01.svg) no-repeat center;}
.options--wrapper .pic--add--wrap .add--box .thumb.car--02{ background:#f7f7f9 url(../img/car_pic02.svg) no-repeat center;}
.options--wrapper .pic--add--wrap .add--box .thumb.car--03{ background:#f7f7f9 url(../img/car_pic03.svg) no-repeat center;}
.options--wrapper .pic--add--wrap .add--box .thumb.car--04{ background:#f7f7f9 url(../img/car_pic04.svg) no-repeat center;}
.options--wrapper .pic--add--wrap .add--box .thumb.car--05{ background:#f7f7f9 url(../img/car_pic05.svg) no-repeat center;}


.options--wrapper .pic--add--wrap .add--box .desc{
  font-weight: 350;
  font-size: 15px;
  line-height: 100%;
  text-align: center;
  letter-spacing: -0.02em;
  color: #000000;
  margin-top:10px;
}


.options--wrapper .pic--add--wrap.view--type .add--box .desc{
  background: #F3F5F8;
  border-radius: 50px;
  height:35px;
  display:inline-flex;
  align-items: center;
  padding:0 20px;

  font-weight: 350;
  font-size: 13px;
  text-align: center;
  letter-spacing: -0.02em;
  color: #000000;
}

.options--wrapper .pic--add--wrap .addition--box .thumb{
  background:#f7f7f9 url(../img/pic_ic.svg) no-repeat center;
}

.options--wrapper .pic--add--wrap .addition--box .add--btn{
  font-weight: 500;
  font-size: 12px;
  text-align: center;
  letter-spacing: -0.03em;
  color: #1E75FF;

  width: 100px;
  height: 34px;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(30, 117, 255, 0.3);
  border-radius: 50px;
  cursor: pointer;
}


.car--btn--wrapper{
  width:100%;
  max-width:1200px;
  margin:0 auto;
  padding-top:70px;
  display:flex;
  align-items:center;
  justify-content: flex-end;
}
.car--btn--wrapper .next--btn{
  width: 240px;
  height: 65px;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  background: #1E75FF;
  border-radius: 10px;
  padding-left:30px;
  box-sizing: border-box;

  font-weight: 500;
  font-size: 14px;
  letter-spacing: -0.02em;
  color: #FFFFFF;

  position: relative;
}

.car--btn--wrapper .next--btn .next--ic{
  display: flex;
  width:15px;
  height:15px;
  position: absolute;
  top:50%;
  transform: translateY(-50%);
  right:30px;
  background: url(../img/arrow_right_btn.svg) no-repeat center;
}



.options--wrapper .editor--wrapper{
  display: flex;
  align-items: center;
  justify-content:space-between;
  width:100%;
  border-top:1px solid #888;
  margin-top:20px;
  padding-top:40px;
}
/*

.options--wrapper .editor--wrapper.ty2{
  border-top:0px;
  padding-top:0px;
}
*/



/** 로그인 **/
.login--form--wrap{
  width:100%;
  max-width:100%;
  margin:0 auto;
  height:100vh;
  display:flex;
  align-items:center;
  justify-content:center;
  flex-direction:column;
  background: url(../img/login_bg.jpg) no-repeat center;
  background-size:cover;
}
.login--form--contents{
  background: #FFFFFF;
  box-shadow: 0px 10px 10px rgba(0, 0, 0, 0.1);
  border-radius: 50px;
  width:520px;
  height:485px;
  box-sizing: border-box;
  padding:60px;
}

.input--form--box {
  border: 0px solid #ff0000;
  display: flex;
  margin-bottom: 5px;
}
.input--form--box > span {
  display: block;
  text-align: left;
  padding-top: 5px;
  min-width: 65px;
}
.button-login-box {
  margin-bottom:35px;
}
.button-login-box button{
  width:100%;
  height:45px;
}
.login--box--title {
  display: flex;
  width:100%;
  justify-content:space-between;
  align-items: center;
  margin-bottom:40px;
}

.login--box--title a{
  display: inline-flex;
  width:131px;
  min-widtdh:131px;
  height:40px;
  background:url(../img/login_logo.png) no-repeat center;
  font-size:0px;
}

.login--box--title h2{
  font-weight: 700;
  font-size: 18px;
  line-height: 100%;
  text-align: right;
  letter-spacing: -0.03em;
  color: #333333;
}

.input--box {
  padding:0px;
  border-radius:20px;
}

.input--box button {
  padding: 3px 5px;
}


.loc--box{
  width:100%;
  display: flex;
  align-items:center;
  justify-content:space-between;
}

.loc--box a{
  font-weight: 350;
  font-size: 14px;
  line-height: 100%;
  letter-spacing: -0.03em;
  color: #777777;
}
.loc--box .front--section a:after{
  content:'';
  display: inline-flex;
  width:1px;
  height:13px;
  background: #e9e9e9;
  margin-left:11px;
  margin-right:11px;
  position:relative;
  top:1px;
}
.loc--box .front--section a:last-child:after{
  display: none;
}

.loc--box .back--section a{
  color: #1E75FF;
}



/** 회원가입 **/

.join--form--wrap{
  width:100%;
  max-width:1200px;
  margin:0 auto;
  display:flex;
  flex-direction:column;
  padding-top:70px;
}
.join--form--wrap > h2{
  font-weight: 700;
  font-size: 30px;
  line-height: 100%;
  text-align: center;
  letter-spacing: -0.03em;
  color: #111111;
  margin:0px;
}

.join--form--wrap > h2 span{
  font-weight: 700;
  font-size: 30px;
  line-height: 100%;
  text-align: center;
  letter-spacing: -0.03em;
  color: #1E75FF;
}

.join--form--wrap > p{
  font-weight: 350;
  font-size: 16px;
  line-height: 100%;
  text-align: center;
  letter-spacing: -0.03em;
  color: #555555;
  margin-top:35px;
  margin-bottom:65px;
}
.join--form--wrap .join--form--contents table{
  border-top:1px solid #555555;
}
.join--form--wrap .join--form--contents table tbody th{
  width: 171px;
  height: 67px;
  background: #F9F9F9;
  padding-left:30px;
  border-bottom:1px solid #eee;
}

.join--form--wrap .join--form--contents table tbody td{
  height: 67px;
  padding-left:19px;
  border-bottom:1px solid #eee;

  font-weight: 350;
  font-size: 14px;
  color: #1F1F1F;
}

.join--form--wrap .join--form--contents > h2{
  color:#000000;
  font-weight: bold;
  font-size: 32px;
  text-transform: uppercase;
  margin-bottom: 20px;
  background: linear-gradient(to right, #270a09, #8ca6ce);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.join--form--wrap .join--form--contents select,
.join--form--wrap .join--form--contents input{
  height: 43px;
  border-radius:0px;
  border: 1px solid #E8E8E8;
  max-width:350px;
}


.join--btn--wrap button{
  width:120px;
  margin:0 5px;
  border-radius:10px;
}

.join--btn--wrap button.cancel--btn{
  background: #C8CFD9;
  border-color:#C8CFD9;
}



/** 모달 중앙 컨텐츠 여백 : S **/
.modal-content{
  border-radius:30px;
}
.modal-body{
  padding:30px;
}

.modal-title{
  font-weight: 500;
  font-size: 18px;
  color: #111111;
}
.modal-header{
  border:0px;
  padding-top:25px;
  padding-left:30px;
  padding-right:30px;
}
.modal-header .btn-close{
  width: 36px!important;
  height: 36px!important;
  padding:0px;
  border-radius: 30px!important;
  background:  url(../img/close_ic.svg) no-repeat center;
}

.modal-footer{
  padding:0px;
  flex-wrap: nowrap;
}
.modal-footer button{
  padding:0px;
  margin:0px;
  border-radius: 0px;
}
.modal-footer button:nth-of-type(1){
  border-radius:0px 0px 0px 30px;
}
.modal-footer button:nth-of-type(2){
  border-radius:0px 0px 30px 0px;
}
.modal-footer .btn-secondary{
  height:65px;
  font-weight: 400;
  font-size: 14px;
  text-align: center;
  letter-spacing: -0.02em;
  color: #000000;
  background: #fff;
  border:0px;
  border-right:1px solid #eee;
  width:100%;
}
.modal-footer .btn-primary{
  height:65px;
  font-weight: 400;
  font-size: 14px;
  text-align: center;
  letter-spacing: -0.02em;
  color: #1E75FF;
  background:#fff;
  border:0px;
  width:100%;
}

.modal-footer.ty2{
  padding:20px 45px 50px 50px;
  border-top:0px;
}
.modal-footer.ty2 button{
  height:50px;
  border: 1px solid rgba(200, 207, 217, 0.5);
  border-radius: 10px;
}
.modal-footer.ty2 button.btn-primary{
  background: #1E75FF;
  color:#fff;
}

.modal-footer.ty2.ty--2{
  padding-bottom:25px;
}

.modal-body .date--text{
  font-weight: 350;
  font-size: 14px;
  color: #333333;
}


/** 모달 중앙 컨텐츠 여백 : E **/


/** 페이지링크 **/
.page-link{
  color:#1E75FF;
}
.active>.page-link, .page-link.active{
  border-color:#1E75FF;
  background:#1E75FF;
}


.btn-primary{
  background:#1E75FF;
}



.swiper--modal--wrap{
  position:fixed;
  top:0px;
  left:0px;
  z-index: 999;
  background:rgba(0,0,0,.5);
  width:100%;
  height:100%;
  display: flex;
  align-items:center;
  justify-content: center;
}

.swiper--modal--wrap .swiper--modal{

}
.swiper--modal--wrap .swiper--modal .vwswiper{
  width:600px;
  height:600px;
}
.swiper--modal--wrap .swiper--modal .vwswiper .car--thumb--wrap{
  width:600px;
  height:500px;
  position: relative;
  background:#fff;
}

.swiper--modal--wrap .swiper--modal .vwswiper .car--thumb--wrap img{
  position:absolute;
  top:50%;
  left:50%;
  transform: translate(-50%, -50%);
  width:100%;
  height:auto;
  object-fit: cover;
}
.swiper--modal--wrap .swiper--modal .vwswiper h2{
  color:#fff;
  font-size:25px;
  font-weight: bold;
  margin-bottom:15px;
}


/** 테이블 **/
.data--table--wrap{
  max-width:1200px;
  margin:0 auto;
}
.data--table--wrap table td{
  border:0px;
  border-top: 1px solid #EEEEEE;
  border-bottom 1px solid #EEEEEE;
  font-weight: 350;
  font-size: 15px;
  letter-spacing: -0.03em;
  color: #000000;
  vertical-align: middle;
  height:55px;

}
.data--table--wrap table td > div{
  font-weight: 400;
  font-size: 14px;
  line-height: 100%;
  color: #333333;
}
.data--table--wrap table th{
  border:0px;
  background: #F9F9F9;
  border-top: 1px solid #EEEEEE;
  font-weight: 350;
  font-size: 15px;
  letter-spacing: -0.03em;
  color: #000000;
  height:55px;
  vertical-align: middle;


}
.data--table--wrap table th > div {
   font-weight: 500;
   font-size: 14px;
   line-height: 100%;
   /* identical to box height, or 14px */

   text-align: center;
   letter-spacing: -0.03em;

   color: #333333;
 }
.data--table--wrap table td:nth-of-type(1),
.data--table--wrap table th:nth-of-type(1){
  border-left:0px;
}

.data--table--wrap table td:last-child,
.data--table--wrap table th:last-child{
  border-right:0px;
}


.pagination--wrapper{
  max-width:1200px;
  margin:0 auto;
  position:relative;
  width:100%;
}
.pagination--wrapper .btn--right--wrap{
  position: absolute;
  left:0px;
}
.pagination--wrapper .btn--left--wrap{
  position: absolute;
  right:0px;
}
.data--table--wrap .title--wrapper > h2{
  font-weight: 700;
  font-size: 18px;
  line-height: 100%;
  letter-spacing: -0.02em;
  color: #222222;
}

.join--ic{
  display: inline-flex;
  min-width:18px;
  width:18px;
  height:18px;
  background:url(../img/join_ic.svg) no-repeat center;
  position: relative;
  top: 3px;
  margin-left:10px;
}


/** 아이디 비밀번호 찾기 **/
.idpw--form--wrap{
  width:100%;
  max-width:430px;
  margin:0 auto;
  display:flex;
  flex-direction:column;
  padding-top:70px;
}

.idpw--form--wrap > h2{
  font-weight: 700;
  font-size: 30px;
  line-height: 100%;
  text-align: center;
  letter-spacing: -0.03em;
  color: #111111;
  margin:0px;
}

.idpw--form--wrap > h2 span{
  font-weight: 700;
  font-size: 30px;
  line-height: 100%;
  text-align: center;
  letter-spacing: -0.03em;
  color: #1E75FF;
}

.idpw--form--wrap > p{
  font-weight: 350;
  font-size: 16px;
  line-height: 100%;
  text-align: center;
  letter-spacing: -0.03em;
  color: #555555;
  margin-top:35px;
  margin-bottom:65px;
}
.idpw--form--wrap .idpw--form--contents .tab .tab--items{
  display: flex;
  align-items:center;
  justify-content:center;
  width:100%;
}
.idpw--form--wrap .idpw--form--contents .tab .tab--items a{
  display: flex;
  align-items:center;
  justify-content:center;
  width:100%;
  height: 55px;
  background: #FFFFFF;
  border: 1px solid #EEEEEE;
  border-bottom-color:#1E75FF;
  margin-right:-1px;
  position:relative;
  z-index: 1;

  font-weight: 400;
  font-size: 14px;
  text-align: center;
  letter-spacing: -0.03em;
  color: #81878F;

}
.idpw--form--wrap .idpw--form--contents .tab .tab--items a.actv{
  border: 1px solid #1E75FF;
  border-bottom-color:#fff;
  z-index: 2;

  font-weight: 700;
  color: #1E75FF;
}

.idpw--form--wrap .idpw--form--contents .tab .inner--contents{
  padding:0 25px;
  padding-top:55px;
}
.idpw--form--wrap .idpw--form--contents .tab .inner--contents > h2{
  font-weight: 500;
  font-size: 18px;
  letter-spacing: -0.03em;
  color: #000000;
}
.idpw--form--wrap .idpw--form--contents .tab .inner--contents > p{
  font-weight: 350;
  font-size: 14px;
  letter-spacing: -0.03em;
  color: #555555;
  margin-top:20px;
}
.idpw--form--wrap .idpw--form--contents .tab .inner--contents .items--box{
  margin-top:45px;
}
.idpw--form--wrap .idpw--form--contents .tab .inner--contents .items--box > div{
  margin-bottom:35px;
}
.idpw--form--wrap .idpw--form--contents .tab .inner--contents .items--box > div > label{
  margin-bottom:15px;
}


.idpw--form--wrap .idpw--form--contents .tab .inner--contents .items--box > div:last-child{
  margin-bottom:0px;
}

.idpw--form--wrap .idpw--form--contents .tab .inner--contents .items--box select,
.idpw--form--wrap .idpw--form--contents .tab .inner--contents .items--box input{
  border-radius:0px;
  height:45px;
  border-color:#E8E8E8;
}


/* 페이지 네이션 */
.pagination{
  padding-top:80px;
}
.pagination li a{
  width: 40px;
  height: 40px;
  background: #FFFFFF;
  border: 1px solid #E3E6EB;
  border-radius: 12px!important;
  margin:0 3.5px!important;
  text-align: center;
  padding:0px;
  display: flex;
  align-items:center;
  justify-content:center;
}


.page-item .page-link[aria-label="Previous"]{
  background:url(../img/pg_left.svg) no-repeat center;
  font-size:0px;
}
.page-item .page-link[aria-label="Next"]{
  background:url(../img/pg_right.svg) no-repeat center;
  font-size:0px;
}


.car--info--wrap table{
  border-top:1px solid #eee;
}
.car--info--wrap table tbody td{
  height: 55px;
  border-bottom:1px solid #eee;

  font-weight: 400;
  font-size: 14px;
  letter-spacing: -0.03em;
  color: #333333;
  padding-left:25px;
}
.car--info--wrap table tbody th{
  width: 220px;
  height: 55px;
  background: #F9F9F9;
  border-bottom:1px solid #eee;
  padding-left:25px;

  font-weight: 500;
  font-size: 14px;
  letter-spacing: -0.03em;
  color: #333333;
}

.excid--btn{
  background: #1EAEFF;
  border-color:#1EAEFF;
  height:41px;
  min-width:150px;
}


/** 차량 갤러리 **/
.gallery--wrappers{
  position:fixed;
  top:0px;
  left:0px;
  width:100%;
  height:100%;
  z-index: 90;
  background: rgba(0,0,0,.5);
  display:flex;
  align-items:center;
  justify-content:center;
}


.fotorama__caption{
  bottom:auto;
  top:0px;
  width: 152px;
  height: 55px;
  background: #1E75FF;
  border-radius: 0px 0px 15px 0px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.fotorama__caption__wrap{
  background: transparent!important;
  font-weight: 500;
  font-size: 16px;

  letter-spacing: -0.02em;
  color: #FFFFFF;
}

.fotorama__stage{
  background: #fff;
}
.fotorama__nav-wrap{
  margin-top:35px;
}
.fotorama--fullscreen .fotorama__nav-wrap{
  margin-top:0px;
}

.fotorama__arr--next{
  width:60px!important;
  height:60px!important;
  background:url(/design/staff/assets/img/right_arrow.png) no-repeat center!important;
}
.fotorama__arr--prev{
  width:60px!important;
  height:60px!important;
  background:url(/design/staff/assets/img/left_arrow.png) no-repeat center!important;
}


.list--btn{
  text-align: left;
  padding-left:30px;

  background: #626262 url(../img/list_ic.png) no-repeat calc(100% - 30px) center;
  border-radius: 10px;
}


.comp--btn{
  text-align: left;
  padding-left:30px;

  background:#1E75FF url(../img/check-circle.png) no-repeat calc(100% - 30px) center;
  border-radius: 10px;
  margin-left:auto;
}


/** 진행상태 **/
.progress--wrap{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;

}
.progress--wrap > div{
  position:relative;
}
.progress--wrap > div:after{
  content:'';
  width:25px;
  height:25px;
  background: url(../img/st_arrow.png) no-repeat center;
  display: block;
  position: absolute;
  top:28px;
  right:-45px;
}

.progress--wrap > div:last-child:after{
  display:none;
}

.progress--wrap > div > .status--box{
  width: 188px;
  height: 80px;
  background: #FFFFFF;
  border: 1px solid #EEEEEE;
  border-radius: 15px;
  display: flex;
  align-items: center;
  justify-content:center;

  font-weight: 500;
  font-size: 14px;
  text-align: center;
  letter-spacing: -0.02em;
  color: #A2A7B0;
}
.progress--wrap > div.actv .status--box{
  border: 1px solid rgba(30, 117, 255, 0.5);
  font-weight: 500;
  font-size: 14px;
  letter-spacing: -0.02em;
  color: #1E75FF;
}

.progress--wrap > div.actv .status--box:before{
  content:'';
  width:26px;
  height:26px;
  display: inline-flex;
  background:url(../img/check.svg) no-repeat center;
  margin-right:5px;
}

.progress--wrap > div > .status--desc{}
.progress--wrap > div > .status--desc p{
  font-weight: 400;
  font-size: 13px;
  text-align: center;
  letter-spacing: -0.02em;
  color: #333333;
  margin-top:15px;
  margin-bottom:20px;
}
.progress--wrap > div > .status--desc button{
  font-weight: 500;
  font-size: 12px;
  letter-spacing: -0.03em;
  color: #FFFFFF;
  display: flex;
  align-items: center;
  justify-content: center;

  width: 60px;
  height: 26px;
  background: #BBC4D3;
  border-radius: 8px;
  margin:0 auto;
}


/** 사고이력 레이어 팝업 **/

.layer_popup{padding:20px 28px 30px;background:#fff;}
.layer_popup .tit{margin-bottom:15px;font-size:18px;color:#464646;}
.layer_popup .cont{border-top:1px solid #000;border-bottom:1px solid #000;}
.layer_popup .cont2{padding:20px 0 0;}
.layer_popup .cont .return_msg{padding:33px 0 33px 65px;background:url('/admin/img/ic_return.png') 0 50% no-repeat;line-height:25px;}
.layer_popup .btn_center{margin-top:20px;}
.layer_popup .close{overflow:hidden;position:absolute;top:0;right:0;width:32px;height:32px;background:url('/admin/img/btn_popup_close.png') 50% no-repeat;text-indent:-9999px;cursor:pointer;}

.layer_popup .tbl_list2{border-top:1px solid #e3e3e3;border-bottom:1px solid #e3e3e3;}
.layer_popup .tbl_list2 td .check_wrap{margin-right:20px;}


.history_popup{position:relative;padding:10px 50px 20px;width:1100px;font-size:13px;}
.history_popup h3{margin-top:20px;padding:0 0 22px;background:none;font-size:30px;color:#000;border-bottom:1px solid #000;}
.history_popup h4,
.history_popup h5{margin:25px 0 5px;font-size:15px;color:#000;}
.history_popup h4:first-child{margin-top:0;}
.history_popup .scr_cont{margin-top:30px;}
.history_popup .scr_cont2{overflow:auto;margin-top:25px;padding:0 20px 30px 0;height:660px;}
.history_popup .tbl_data{border:1px solid #d5d5d5;}
.history_popup .tbl_data th,
.history_popup .tbl_data td{padding-left:22px;border-top:1px solid #e5e5e5;text-align:left;vertical-align:middle;}
.history_popup .tbl_data tr:first-child th,
.history_popup .tbl_data tr:first-child td{border-top:none;}
.history_popup .tbl_data th{background:#f0f0f0;}
.history_popup .tbl_data td{height:38px;border-left:none;color:#808080;}
.history_popup .tbl_data td .inp_txt{color:#808080;}
.history_popup .tbl_data2{border:1px solid #d5d5d5;border-right:1px solid #d5d5d5;}
.history_popup .tbl_data2 th,
.history_popup .tbl_data2 td{height:39px;border-top:1px solid #e5e5e5;border-left:1px solid #c9c9c9;text-align:center;vertical-align:middle;}
.history_popup .tbl_data2 thead th{padding:0;background:#f0f0f0;font-weight:400;}
.history_popup .tbl_data2 thead tr:first-child th{border-top:none;}
.history_popup .tbl_data2 tbody th{padding:0;background:none;}
.history_popup .tbl_data2 td{color:#000;}
.history_popup .notice01{margin-top:10px;padding-left:36px;background:url('/admin/img/ico_notice01.gif') no-repeat;line-height:29px;}
.history_popup .notice02{margin-top:10px;padding-left:36px;background:url('/admin/img/ico_notice02.gif') no-repeat;line-height:30px;}
.history_popup .notice03 > li{margin-top:30px;line-height:23px;}
.history_popup .notice03 li ol li{padding-left:14px;list-style:decimal;list-style-position:inside;line-height:23px;text-indent:-14px;}
.history_popup .sign{margin-top:55px;text-align:center;}
.history_popup .performance_check{overflow:hidden;}
.history_popup .performance_check dt{float:none;clear:both;margin:70px 0 22px;font:700 15px/1 'NS';color:#000;}
.history_popup .scr_cont .performance_check:first-child dt{margin-top:0;}
.history_popup .performance_check dd{float:left;padding-right:50px;width:50%;}
.history_popup .performance_check dd span{display:block;border-bottom:1px solid #e5e5e5;line-height:40px;}
.history_popup .close{top:32px;right:48px;width:22px;height:17px;background:url('../img/btn_popup_close2.png') no-repeat;}


.collapse_area.popup{width:1000px;margin:0;overflow:auto;height:660px;padding:0 20px 30px 0;}
.collapse_area{width:1140px;margin:0 auto;}
.collapse_area .report_tit{background:#333;color:#fff;font-size:16px;width:100%;padding:20px 30px;text-align:left;line-height:19px;margin-top:30px;}
.collapse_area .report_con{width:100%;display:inline-block;border:1px solid #e0e0e0;padding:30px 20px;border-top:0;}
.collapse_area .report_con p.s_txt{font-size:13px;color:#333;margin-bottom:20px;}
.collapse_area .report_con .dol-md-6{width:48.6%;margin-right:30px;display:inline-block;float:left;}
.collapse_area .report_con .dol-md-6:last-child{margin-right:0;}
.collapse_area .report_con .report_row{margin-top:20px;width:100%;}
.col-sm-4{width:33.1%;text-align:center;display:inline-block;}

.dol-md-6 table.learn-box{}
.dol-md-6 table.learn-box tbody tr th{background-color:#f5f5f5;border:1px solid #ddd;vertical-align:middle;width:40%;padding:15px 0;color:#222;font-weight:500;}
.dol-md-6 table.learn-box tbody tr td{border:1px solid #ddd;vertical-align:middle;width:60%;padding:15px 0 15px 25px;color:#189bfa;text-align:left;font-weight:500;}

.dol-md-5 table.learn-box{width:100%;}
.dol-md-5 table.learn-box tbody tr th{background-color:#f5f5f5;border:1px solid #ddd;vertical-align:middle;width:25%;padding:20px 0;color:#222;font-weight:400;}
.dol-md-5 table.learn-box tbody tr td{border:1px solid #ddd;text-align:center;vertical-align:middle;width:25%;padding:20px 0;color:#189bfa;font-weight:600;}
.dol-md-5 table.learn-box tbody tr td.df_gray{color:#333;}

.guide-box-container{position:relative;width:100%;display:block;margin-top:40px;}
.guide-box-container .deco{z-index:3;width:140px;position:absolute;right:10px;bottom:-10px;}
.guide-box-container .deco img{display:block;max-width:100%;height:auto;}
.guide-box-container .guide-box{position:relative;z-index:2;padding:30px;padding-right:160px;background-color:#f5f5f5;}
.guide-box-container .guide-box span.guide-title{background-color:#189bfa;color:#fff;border-radius:18px;padding:10px 20px;line-height:12px;font-size:13px;position:absolute;top:-14px;}
.guide-box-container .guide-box ul.guide-list{}
.guide-box-container .guide-box ul.guide-list li{padding-left:10px;margin-top:10px;position:relative;}
.guide-box-container .guide-box ul.guide-list li strong.li-title{position:static;display:block;left:0;top:0;font-size:15px;line-height:24px;color:#222;letter-spacing:-1px;margin-bottom:5px;}
.guide-box-container .guide-box ul.guide-list li strong.li-title:before{content:"";display:inline-block;width:4px;height:4px;background-color:#189bfa;margin-right:10px;position:relative;top:-3px;}
.guide-box-container .guide-box ul.guide-list li .li-content{padding-left:13px;font-size:14px;line-height:24px;color:#777;margin-bottom:15px;}

ul.ex_box_wrap{display:block;}
ul.ex_box_wrap li{float:left;border:1px solid #e6e6e6;margin-right:30px;width:247px;margin-bottom:30px;padding-bottom:20px;text-align:center;}
ul.ex_box_wrap li:nth-child(4), .collapse_area .report_con ul.ex_box_wrap li:nth-child(8){margin-right:0;}
ul.ex_box_wrap li div.ico{width:100px;margin:auto;padding:20px 0 15px 0;}
ul.ex_box_wrap li div.ico img{text-align:center;width:100%;}
ul.ex_box_wrap li span{color:#333;font-size:15px;margin-bottom:5px;}
ul.ex_box_wrap li .price{font-size:19px;color:#189bfa;font-weight:300;margin-top:10px;}
ul.ex_box_wrap li .off{color:#777;}
.col-sm-4 div.ico{width:100px;margin:auto;padding:20px 0 15px 0;}
.col-sm-4 div.ico img{text-align:center;width:100%;}
.col-sm-4 span{color:#333;font-size:15px;margin-bottom:5px;}
.col-sm-4 .price{font-size:19px;color:#189bfa;font-weight:300;margin-top:10px;}
.col-sm-4 .off{color:#777;}

.report_con .message{font-size:20px;margin-top:25px;text-align:center;font-weight:300;color:#222;clear:both;}
.report_con .message strong.color-key{color:#189bfa;}
.report_con .message i.icon-font{margin-top:-3px;vertical-align:middle;}
.icon-font{font-family: 'Noto Sans KR', sans-serif;line-height:1;position:relative;display:inline-block;-webkit-font-smoothing:antialiased;margin-right:5px;}
.icon-siren:before{content:"";display:inline-block;width:36px;height:30px;background:no-repeat;background-position:center center;background:url(https://www.carhistory.or.kr/img/icon/siren.png);background-size:cover;}
.icon-angle-up:before{content:"\f106";}
.icon-siren.small:before{width:30px;height:25px;margin-right:5px;}
.message.small{font-size:16px;margin-bottom:20px;}
.message.small strong{font-weight:500;}
.report_con .bg-lightgray{background-color:#f5f5f5;font-size:16px;line-height:26px;text-align:center;border:1px solid #e8e8e8;padding:20px 0;margin-bottom:20px;}
span.color-sky{color:#189bfa;}
.report_con p{font-size:14px;color:#444;font-weight:400;line-height:25px;}
.report_con p.small{font-size:12px;margin-top:20px;}
.report_con p.small.color-gray{color:#787878;}
.report_con ul.dashed-line{margin-top:25px;}
.report_con ul.dashed-line li{padding:30px 0;border-top:1px dashed #b4b4b4;}
.report_con ul.dashed-line li:first-child{border-top:none;padding-top:0;}
.crash-info-list{display:table;table-layout:fixed;width:100%;}
.crash-info-list .row [class^="col-md-"]{display:inline-table;min-height:1px;float:none;}
.crash-info-list .row{display:table-row;}
.crash-info-list .row div{float:left;text-align:center;vertical-align:middle;width:100%;}
.crash-info-list .row .col-md-2{width:16.66666667%;}
.crash-info-list .row .col-md-4{width:30.6%;}
.crash-info-list .row .col-md-6{width:49%;margin-right:30px;}
.crash-info-list .date{vertical-align:middle;}
.xlarge{color:#189bfa;font-size:24px;line-height:26px;}
.table-head{color:#fff;text-align:center;padding:18px;margin-bottom:5px;}
.table-head.color-sky{background-color:#189bfa;}
.table-head.color-mint{background-color:#00b5b8;}
.crash_tb{width:100%;}
.crash_tb thead th{font-size:14px;height:50px;line-height:47px;background-color:#f5f5f5;border:1px solid #d2d2d2;color:#333;font-weight:400;width:50%;}
.crash_tb tbody td span.badge{font-size:13px;display:inline-block;vertical-align:middle;letter-spacing:-0.02em;border-radius:10px;background-color:#3c3c3c;color:#fff;line-height:20px;height:20px;padding:0 7px;font-weight:400;margin-bottom:5px;}
.crash_tb tbody td a.btn{display:inline-block;margin-bottom:0;font-weight:normal;letter-spacing:-0.02em;text-transform:uppercase;text-align:center;vertical-align:middle;touch-action:manipulation;cursor:pointer;background-image:none;border:1px solid #189bfa;color:#189bfa;background-color:#fff;font-size:12px;border-radius:13px;padding:0 10px;margin-bottom:12px;}
.crash_tb tbody td a.btn:hover{background:#006eb6;color:#fff;border:1px solid #006eb6;}
.crash_tb tbody td{text-align:center;font-size:14px;line-height:22px;border:1px solid #d2d2d2;color:#222;font-weight:700;width:50%;vertical-align:middle;padding:20px 0;}
.crash_tb tbody tr.long-1{height:90px;padding:0;}
.crash_tb tbody tr.long-2{height:190px;padding:0;}
.crash_tb tbody td strong.color-sky{color:#189bfa;}
.crash_tb tbody td strong.color-mint{color:#00b5b8;}
.bullet-list{}
.bullet-list li{position:relative;padding-left:10px;font-size:14px;line-height:25px;letter-spacing:-1px;}
.bullet-list li .bullet{position:absolute;left:0;top:0;}
.bullet-list li .color-key{color:#189bfa;}

.collapse_area.popup .report_con ul.ex_box_wrap li{width:22.5%;}
.collapse_area.popup .report_con ul.ex_box_wrap li:nth-child(4){margin-right:0;}
.collapse_area.popup .report_con ul.dashed-line li div.crash-info-list .row .col-md-2{width:18%;}
.collapse_area.popup .report_con ul.dashed-line li div.crash-info-list .row .col-md-6{width:45%;}

.dol-md-6 table.learn-box{}
.dol-md-6 table.learn-box tbody tr th{background-color:#f5f5f5;border:1px solid #ddd;vertical-align:middle;width:40%;padding:15px 0;color:#222;font-weight:500;}
.dol-md-6 table.learn-box tbody tr td{border:1px solid #ddd;vertical-align:middle;width:60%;padding:15px 0 15px 25px;color:#189bfa;text-align:left;font-weight:500;}

.dol-md-5 table.learn-box{width:100%;}
.dol-md-5 table.learn-box tbody tr th{background-color:#f5f5f5;border:1px solid #ddd;vertical-align:middle;width:25%;padding:20px 0;color:#222;font-weight:400;}
.dol-md-5 table.learn-box tbody tr td{border:1px solid #ddd;text-align:center;vertical-align:middle;width:25%;padding:20px 0;color:#189bfa;font-weight:600;}
.dol-md-5 table.learn-box tbody tr td.df_gray{color:#333;}

.guide-box-container{position:relative;width:100%;display:block;margin-top:40px;}
.guide-box-container .deco{z-index:3;width:140px;position:absolute;right:10px;bottom:-10px;}
.guide-box-container .deco img{display:block;max-width:100%;height:auto;}
.guide-box-container .guide-box{position:relative;z-index:2;padding:30px;padding-right:160px;background-color:#f5f5f5;}
.guide-box-container .guide-box span.guide-title{background-color:#189bfa;color:#fff;border-radius:18px;padding:10px 20px;line-height:12px;font-size:13px;position:absolute;top:-14px;}
.guide-box-container .guide-box ul.guide-list{}
.guide-box-container .guide-box ul.guide-list li{padding-left:10px;margin-top:10px;position:relative;}
.guide-box-container .guide-box ul.guide-list li strong.li-title{position:static;display:block;left:0;top:0;font-size:15px;line-height:24px;color:#222;letter-spacing:-1px;margin-bottom:5px;}
.guide-box-container .guide-box ul.guide-list li strong.li-title:before{content:"";display:inline-block;width:4px;height:4px;background-color:#189bfa;margin-right:10px;position:relative;top:-3px;}
.guide-box-container .guide-box ul.guide-list li .li-content{padding-left:13px;font-size:14px;line-height:24px;color:#777;margin-bottom:15px;}


ul.ex_box_wrap{display:block;}
ul.ex_box_wrap li{float:left;border:1px solid #e6e6e6;margin-right:30px;width:247px;margin-bottom:30px;padding-bottom:20px;text-align:center;}
ul.ex_box_wrap li:nth-child(4), .collapse_area .report_con ul.ex_box_wrap li:nth-child(8){margin-right:0;}
ul.ex_box_wrap li div.ico{width:100px;margin:auto;padding:20px 0 15px 0;}
ul.ex_box_wrap li div.ico img{text-align:center;width:100%;}
ul.ex_box_wrap li span{color:#333;font-size:15px;margin-bottom:5px;}
ul.ex_box_wrap li .price{font-size:19px;color:#189bfa;font-weight:300;margin-top:10px;}
ul.ex_box_wrap li .off{color:#777;}



/** 2023-03-02 상세 페이지 금액 스텝 **/
.price--info--wrap{
  width:100%;
  max-width:1200px;
  margin:0 auto;

  display: flex;
  align-items: center;
  justify-content: center;
  gap:25px;
}
.price--info--wrap > div{
  width:100%;
  max-width:297px;
  height:94px;
  display: flex;
  align-items:center;
  justify-content:flex-start;
  background: rgba(239, 242, 245, .8);
  border-radius: 18px;
  padding-left:20px;
}

.price--info--wrap > div .thumb{
  width: 54px;
  height: 54px;
  border-radius: 10px;
  background: #FFFFFF;
  margin-right:22px;
}

.price--info--wrap > div .thumb.ic--01{background: #FFFFFF  url(../img/tmb_ic01.svg) no-repeat center!important;}
.price--info--wrap > div .thumb.ic--02{background: #FFFFFF  url(../img/tmb_ic02.svg) no-repeat center!important;}
.price--info--wrap > div .thumb.ic--03{background: #FFFFFF  url(../img/tmb_ic03.svg) no-repeat center!important;}
.price--info--wrap > div .thumb.ic--04{background: #FFFFFF  url(../img/tmb_ic04.svg) no-repeat center!important;}

.price--info--wrap > div .desc h2{
  font-weight: 400;
  font-size: 14px;
  line-height: 100%;
  letter-spacing: -0.03em;
  color: #666666;
}
.price--info--wrap > div .desc p{
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 600;
  font-size: 17px;
  letter-spacing: 0.03em;
  color: #000000;
  display: flex;
  align-items:center;
  margin-top:12px;
}
.price--info--wrap > div .desc p span{
  font-family: 'Noto Sans KR';
  font-style: normal;
  font-weight: 400;
  font-size: 12px;
  letter-spacing: -0.03em;
  color: #333333;
  margin-left:5px;
}


.price--info--wrap > div:nth-of-type(1){
  max-width:235px;
  background: #37A0EA;
}
.price--info--wrap > div:nth-of-type(1) .desc p span,
.price--info--wrap > div:nth-of-type(1) .desc h2,
.price--info--wrap > div:nth-of-type(1) .desc p{
  color:#fff;
}



.trading--finish{}
.trading--finish li{
  font-weight: 350;
  font-size: 14px;
  color: #333333;
  margin-bottom:5px;
}
.trading--finish li span{
  display: inline-flex;
  align-items:center;
  justify-content:center;
  min-width:50px;
  width: 50px;
  height: 28px;
  background: #FFFFFF;
  border: 1px solid rgba(30, 117, 255, 0.5);
  border-radius: 50px;
  margin-left:15px;
}


.status--text.tr--missed{
  font-weight: 400;
  font-size: 14px;
  letter-spacing: -0.03em;
  color: #8691A3;
}
.status--text.tr--delay{
  font-weight: 400;
  font-size: 14px;
  letter-spacing: -0.03em;
  color: #333333;
}
.status--text.tr--fail{
  font-weight: 400;
  font-size: 14px;
  letter-spacing: -0.03em;
  color: #E12544;
}