/* common */

.m {display: none;}
.pc {display: block;}
.mobile-menu {display: none;}
.bgc-puple {background-color: #6118EE !important;}
.bte0 { border-top: 1px solid #E0E0E0 !important;}

.inner40 {
  padding: 0 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
}

.fadeup {
  opacity: 0;
  transform: translateY(50px);
  transition: .6s ease;
}
.fadeup.active {
  opacity: 1;
  transform: translateY(0);
}

.inner {
  max-width: 1200px;
  width: 100%;
  height: 100%;
  margin: 0 auto;
  /* padding:0 360px; */
}

.floating-start {
  display: none;
  position: fixed;
  bottom: 25px;
  left: 50%;
  transform: translateX(-50%);
  color: #fff;
  text-align: center;
  font-size: 16px;
  font-weight: 800;
  line-height: normal;
  border-radius: 100px;
  background: #4541FF;
  box-shadow: 0px 0px 16px 0px rgba(0, 0, 0, 0.30);
  padding: 16px 32px;
  z-index: 998;
}

.floating-start.active {
  display: block;
}

.floating-talk {
  display: none;
  position: fixed;
  width: 62px;
  height: 62px;
  border-radius: 50%;
  background-color: #4541FF;
  right: 32px;
  bottom: 25px;
  z-index: 998;
  justify-content: center; 
  align-items: center;
  box-shadow: 0px 0px 16px rgba(0, 0, 0, 0.30);
} 

.floating-talk.active {
  display: flex;
}

.floating-talk img {width: 34px; display: block;}
.guide-menu {display: none;}
#sec00 {
  position: sticky;
  top: 0;
  margin-bottom: -60px;
  height: 60px;
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  z-index: 999;
  transition: 0.3s;
  border-bottom: 1px solid transparent;  
}

#sec00.active {
  background-color: #fff;
  border-bottom: 1px solid #E0E0E0;
  box-shadow: 0px 0px 16px 0px rgba(0, 0, 0, 0.10);
}


#sec00 .m-search-area {display: none;}

#sec00 .sec00 {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
}


.mr20 {margin-right: 20px !important;}

#sec00 .sec00 .logo-area {
  display: flex;
  justify-content: center;
  align-items: center;
}

#sec00 .sec00 .logo-area span {
  width: 1px;
  height: 24px;
  border-radius: 6px;
  background: rgba(0, 0, 0, 0.08);
}

#sec00 .sec00 .logo-area .guide {
  font-size: 16px;
  font-weight: 400;
  line-height: 25.6px;
  letter-spacing: -0.3px;
  color: rgba(0, 0, 0, 0.60);
}

#sec00 .sec00 .logo {
  width: 109px;
  flex: 1;
  margin-right: auto;
}

#sec00 .sec00 .search-area {
  flex: 2;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  gap: 10px;  
}

#sec00 .sec00 .search-area .search {
  position: relative;
}

#sec00 .sec00 .search-area .search .icon {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  left: 15px;
}

#sec00 .sec00 .search-area .search .input{
  width: 680px;
  height: 40px;
  border-radius: 14px;
  background: var(--gray-00, #F9F9F9);
  border: none;
  outline: none;
  padding: 17px 15px 17px 41px;
  font-size: 16px;
  font-weight: 400;
  line-height: 25.6px;
  letter-spacing: -0.3px;
}

#sec00 .sec00 .search-area .search .input:focus {
  box-shadow: 0px 0px 0px 1px #4541FF inset, 0px 0px 0px 3px rgba(69, 65, 255, 0.30);
}

#sec00 .sec00 .search-area .search .input::placeholder {
  font-size: 16px;
  font-weight: 400;
  line-height: 25.6px;
  letter-spacing: -0.3px;
  color: var(--gray-04, #828282);
}


#sec00 .sec00 .gnb {
  flex: 2;
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100%;
  gap: 10px;
}
#sec00 .sec00 .gnb .service-area {
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  cursor: pointer;
  position: relative;
}


#sec00 .sec00 .gnb .service-area .service-wrap {
  width: 100px;
  height: 33px;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 3px;
  border-radius: 5px;
}

#sec00 .sec00 .gnb .service-area .icon{
  width: 18px;
}

#sec00 .sec00 .gnb .service-area:hover .service-wrap{
  background-color: #f2f2f2;
}

#sec00 .sec00 .gnb .service-area:hover .service-box {
  display: flex;
}

#sec00 .sec00 .gnb .service-area .icon img {width: 100%; display: block;}

#sec00 .sec00 .gnb .service-area .service-box{
  display: none;
  position: absolute;
  top: 59px;
  left: 0;
  padding: 30px;
  width: 400px;
  height: 250px;
  background-color: #fff;  
  border-radius: 0px 0px 5px 5px;
  border: 1px solid#E0E0E0;
  box-shadow: 0px 0px 16px 0px rgba(0, 0, 0, 0.10); 
  justify-content: center;
  gap: 20px;
}
#sec00 .sec00 .gnb .service-area .service-box .left {
  display: flex; 
  flex-direction: column;
  gap: 4px;
  position: relative;
  width: 160px;
}
#sec00 .sec00 .gnb .service-area .service-box .left::after {
  content: '';
  position: absolute;
  top: 0;
  right: -20px;
  width: 1px;
  height: 189px;
  background-color: #E0E0E0;
}

#sec00 .sec00 .gnb .service-area .service-box .left p{
  font-size: 14px;
  font-weight: 600;
  width: 100%;
  padding: 4px 10px;
  color: #BDBDBD;
}
#sec00 .sec00 .gnb .service-area .service-box .left a{
  display: flex;
  align-items: center;
  width: 100%;
  padding: 10px;
  gap: 4px;
  color: #333;
  font-weight: 600;
}
#sec00 .sec00 .gnb .service-area .service-box .left a span,
#sec00 .sec00 .gnb .service-area .service-box .right a span{
  padding: 1px 4px;
  font-size: 10px;
  font-weight: 600;
  color: #fff;
  line-height: normal;
  border-radius: 2px;
  background: #4541FF;
}

#sec00 .sec00 .gnb .service-area .service-box .right {
  display: flex; 
  flex-direction: column;
  gap: 4px;
  width: 160px;
}
#sec00 .sec00 .gnb .service-area .service-box .right p{
  font-size: 14px;
  font-weight: 600;
  width: 100%;
  padding: 4px 10px;
  color: #BDBDBD;
}
#sec00 .sec00 .gnb .service-area .service-box .right a{
  display: flex;
  align-items: center;
  width: 100%;
  padding: 10px;
  gap: 4px;
  color: #333;
  font-weight: 600;
}
#sec00 .sec00 .gnb a {
  display: inline-block;
  padding: 7.5px 11px;
  border-radius: 5px;
}
#sec00 .sec00 .gnb a:hover {
  background-color: #f2f2f2;
}


#sec00 .sec00 .btn-area {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
  /* flex: 1; */
  /* margin-left: auto; */
}
#sec00 .sec00 .btn-area a {
  padding: 9px 10px;
  font-size: 14px;
  font-weight: 700;
  line-height: normal;
  border-radius: 5px;
}

#sec00 .sec00 .btn-area a.login {
  border: 1px solid #e0e0e0;
  background: #fff;
  color: #828282;
}
#sec00 .sec00 .btn-area a.login2 {
  border: none;
  background: rgba(69, 65, 255, 0.10);
  color: #4541FF;
}
#sec00 .sec00 .btn-area a.free {
  border-radius: 5px;
  background: #333;
  border: 1px solid #333;
  color: #fff;
}
#sec00 .sec00 .btn-area a.start {
  border-radius: 5px;
  background: #4541FF;
  border: 1px solid #4541FF;
  color: #fff;
}

#sec00 .sec00 .menu {display: none;}


footer {}
.footer {
  padding: 83px 0;
  display: flex;
  justify-content: space-between;
}
.footer .left {}
.footer .left .logo{
  margin-bottom: 19px;
}
.footer .left .logo img{}
.footer .left p{
  color: #828282;
  font-size: 14px;
  font-weight: 300;
  line-height: 180%;
}
.footer .left p span {
  font-weight: 700;
}
.footer .right {
  display: flex;
  gap: 100px; 
}

.footer .right .service {
  display: flex;
  flex-direction: column;
  gap: 19px;
}
.footer .right .service .service-menu {
  display: flex;
  flex-direction: column;
  gap: 7.5px;
}

.footer .right .document {
  display: flex;
  flex-direction: column;
  gap: 19px;
}
.footer .right .document .document-menu {
  display: flex;
  flex-direction: column;
  gap: 7.5px;
}
.footer .right .channel {
  display: flex;
  flex-direction: column;
  gap: 19px;
}
.footer .right .channel .channel-menu{
  display: flex;
  flex-direction: column;
  gap: 7.5px;
}

.footer .right p {
  color:#828282;
  font-size: 15px;
  font-weight: 800;
  line-height: 19.5px;
}

.footer .right a {
  display: inline-block;
  color:#828282;
  font-size: 15px;
  font-weight: 400;
  line-height: 19.5px;
  margin-bottom: 7.5px;
}


#message {
  background: #4541FF;
  position: relative;
  overflow: hidden;
}

#message .icon-box {
  position: absolute;
  width: 100%;
  height: 100%;
}
#message .icon-box .icon {
  position: absolute;
  transition: 6s;
  opacity: 0;
}
#message .icon-box .icon.icon1 {
  top: 35%;
  left: 35%;
}
#message .icon-box .icon.icon2 {
  top: 35%;
  left: 37%;
}
#message .icon-box .icon.icon3 {
  top: 35%;
  left: 50%;
  transform: translateX(-50%);
}
#message .icon-box .icon.icon4 {
  top: 35%;
  right: 37%;
}
#message .icon-box .icon.icon5 {
  top: 35%;
  right: 30%;
}
#message .icon-box .icon.icon6 {
  bottom: 45%;
  left: 35%;
}
#message .icon-box .icon.icon7 {
  bottom: 45%;
  left: 40%;
}
#message .icon-box .icon.icon8 {
  bottom: 40%;
  left: 50%;
  transform: translateX(-50%);
}
#message .icon-box .icon.icon9 {
  bottom: 40%;
  right: 35%;
}
#message .icon-box .icon.icon10 {
  bottom: 40%;
  right: 40%;
}

/* icon active */
#message .icon-box.active .icon { transform: scale(2.2); opacity: 1;}
#message .icon-box.active .icon.icon1 {
  top: -5%;
  left: 10%;
}
#message .icon-box.active .icon.icon2 {
  top: -10%;
  left: 27%;
}
#message .icon-box.active .icon.icon3 {
  top: -6%;
  left: 45%;
}
#message .icon-box.active .icon.icon4 {
  top: -12%;
  right: 30%;
}
#message .icon-box.active .icon.icon5 {
  top: -10%;
  right: 15%;
}
#message .icon-box.active .icon.icon6 {
  bottom: -10%;
  left: 10%;
}
#message .icon-box.active .icon.icon7 {
  bottom: -10%;
  left: 25%;
}
#message .icon-box.active .icon.icon8 {
  bottom: -15%;
  left: 45%;
}
#message .icon-box.active .icon.icon9 {
  bottom: -5%;
  right: 31%;
}
#message .icon-box.active .icon.icon10 {
  bottom: -8%;
  right: 12%;
}

#message .message {
  height: 100%;
  padding: 290px 0;
  position: relative;
  /* z-index: 999; */
}

#message .message .tit-area {margin-bottom: 52px; text-align: center;}
#textsite #message .message .tit-area h1 {
  color: #fff !important;
}
#message .message .tit-area h1 {
  font-size: 52px;
  font-weight: 800;
  line-height: 62.4px;
  color: #E0E0E0;
  margin-bottom: 20px;
}
#message .message .tit-area h1 .fff {
  color: #fff;
}

#message .message .tit-area p{
  font-size: 18px;
  font-weight: 400;
  line-height: 28.8px;
  color: #F2F2F2;
}

#message .message .btn-area {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 16px;
  margin-bottom: 52px;
}
#message .message .btn-area a{
  font-size: 16px;
  font-weight: 800;
  line-height: normal;
  padding: 16px 32px;
  border-radius: 100px;
  color: #4541FF;
  background-color: #fff;
}

#message .message .btn-area a.bgc-puple {
  border: 1px solid #fff;
  color: #fff;
}

#message .message .btn-area a:nth-child(2) {
  color: #fff;
  background-color: #4541FF;
  border: 1px solid #fff;
}

 

#price .price {padding: 200px 0;}
#price .price .tit-area { margin-bottom: 52px; text-align: center;}
#price .price .tit-area h1 {
  font-size: 52px;
  font-weight: 800;
  line-height: 62.4px;
  
  color: #333;
  margin-bottom: 20px;
}
#price .price .tit-area p{
  color: #828282;
  font-size: 18px;
  font-weight: 400;
  line-height: 28.8px;
  
}
#price .price .card-box-m {display: none !important;}
#price .price .card-box-pc {display: flex !important;}
#price .price .card-box {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 24px;
  margin-bottom: 52px;
}

#price .price .card-box .card {
  width: 384px;
  height: 431px;
  border-radius: 20px;
  border: 1px solid  #E0E0E0;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}

#price .price .card-box .card .top {
  height: 50%;
  padding: 40px 40px 36px 40px;
}
#price .price .card-box .card .top .txt-area {
  margin-bottom: 30px;
}
#price .price .card-box .card .top .txt-area h3 {
  display: flex;
  gap: 4px;
  align-items: center;
  color: #333;
  font-size: 28px;
  font-weight: 700;
  line-height: 36.4px;
  
  margin-bottom: 4px;
}
#price .price .card-box .card .top .txt-area h3 span {
  width: 36px;
  height: 36px;
}
#price .price .card-box .card .top .txt-area h3 span img {
  width: 100%;
  display: block;
}

#price .price .card-box .card .top .txt-area p {
  color: #828282;
  font-size: 18px;
  font-weight: 400;
  line-height: 28.8px;
   
}

#price .price .card-box .card .top .amount-area {
  display: flex;
  align-items: flex-end;
}
#price .price .card-box .card .top .amount-area .amount {
  color: #4541FF;
  font-size: 48px;
  font-weight: 700;
  line-height: 62.4px;
  
}
#price .price .card-box .card .top .amount-area .amount span {
  display: inline-block;
  margin-left: 5px;
  color: #333;
  font-size: 16px;
  font-weight: 700;
}

#price .price .card-box .card .bot {
  height: 50%;
  background: var(--gray-01, #F2F2F2);
  padding: 30px 35px 30px 35px;
  display: flex;
  flex-direction: column;
  gap: 8px;
}

#price .price .card-box .card .bot p{
  display: flex;
  align-items: center;
  gap: 6px;
  color: #333;
  font-size: 18px;
  font-weight: 400;
  line-height: 28.8px;
}

#price .price .card-box .card .bot p span {
  width: 25px;
  height: 25px;
}
#price .price .card-box .card .bot p span img {width: 100%; display: block;}
#price .price .card-box .card .bot a {
  margin-top: 49px;
  border-radius: 100px;
  padding: 16px;
  width: 100%;
  background: var(--new-solapi-blue, #4541FF); 
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  font-size: 16px;
  font-weight: 800;
  line-height: normal;
}
#price .price .phrases {
  text-align: center;
  color: #828282;
  font-size: 28px;
  font-weight: 400;
  line-height: 42px;
}

#qna {background-color: #f9f9f9;}
#qna .qna{ padding:  200px 0;}
#qna .qna .tit-area {margin-bottom: 52px; text-align: center;}
#qna .qna .tit-area h1 {
  font-size: 52px;
  font-weight: 800;
  line-height: 62.4px;
  color: #333;
}
#qna .qna .tit-area p{
  color: #828282;
  font-size: 18px;
  font-weight: 400;
  line-height: 28.8px;
}

#qna .qna .accordion-area{
  max-width: 792px;
  margin: 0 auto;
}

#qna .qna .accordion-area .accordion .accordion-item{
  border-radius: 5px;
  overflow: hidden;
  padding: 20px 0;
  border-top: 1px solid #E0E0E0;
}
#qna .qna .accordion-area .accordion-title {
  cursor: pointer;
  border: none;
  background: none;
  width: 100%;
  text-align: left;
  padding: 0;
}
#qna .qna .accordion-area .accordion-title h2 {
  font-weight: 700;
  font-size: 24px;
  line-height: 34px;
  position: relative;
  display: flex;
  gap: 24px;
}

#qna .qna .accordion-area .accordion-title h2 .icon {
  width: 36px;
  height: 36px;
  background-color: #f2f2f2;
  border-radius: 50%;
  position: relative;
}
#qna .qna .accordion-area .accordion-title h2 .icon span:nth-child(1){
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%,-50%);
  width: 12px;
  height: 2px;
  background-color: #333;
}

#qna .qna .accordion-area .accordion-title h2 .icon span:nth-child(2) {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%,-50%);
  width: 2px;
  height: 12px;
  background-color: #333;
  transition: background-color 0.3s;
}

#qna .qna .accordion-area .accordion-title.on h2 .icon span:nth-child(2) {
  background-color: transparent;
}

#qna .qna .accordion-area .accordion-title h2 {
  border: none;
}
#qna .qna .accordion-area .accordion-contant{
  padding-left: 64px;
  display: grid;
  grid-template-rows: 0fr;
  transition: grid-template-rows 0.25s ease-out;
}
#qna .qna .accordion-area .accordion-contant > p {
  font-weight: 300;
  font-size: 18px;
  line-height: 28px;
  overflow: hidden;
  min-height: 0;
  padding-top: 0;
  padding-bottom: 0;
  transition: padding 0.25s ease-out;
}
#qna .qna .accordion-area .accordion-title.on + .accordion-contant {
  grid-template-rows: 1fr;
}
#qna .qna .accordion-area .accordion-title.on + .accordion-contant > p {
  padding-top: 24px;
  padding-bottom: 8px;
}

#suggestion {
  background-color: #f9f9f9;
}


#suggestion .suggestion {
  padding: 200px 0;
}
#suggestion .suggestion .tit-area {
  margin-bottom: 48px;
}
#suggestion .suggestion .tit-area span {
  display: inline-block;
  font-size: 22px;
  font-weight: 700;
  line-height: 28px;
  color: #4541FF;
  margin-bottom: 16px;
}
#suggestion .suggestion .tit-area h1 {
  font-size: 52px;
  font-weight: 800;
  line-height: 62px;
}

#suggestion .suggestion .item-box {
  display: flex;
  gap: 24px;
  flex-wrap: wrap;
}
#suggestion .suggestion .item-box .item {
  background: var(--white, #FFF);
  box-shadow: 0px 0px 20px 0px rgba(69, 65, 255, 0.20);
  width: 282px;
  height: 223px;
  border-radius: 20px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  justify-content: center;
  align-items: center;
  transition: 1s;
}
#suggestion .suggestion .item-box .item:hover {
  background: #4541FF;
  box-shadow: none;
 }
 #suggestion .suggestion .item-box .item:hover .icon img {filter: brightness(10);}
 #suggestion .suggestion .item-box .item:hover h2 {
  color: #fff;
 }

#suggestion .suggestion .item-box .item .icon {max-width: 48px; }
#suggestion .suggestion .item-box .item .icon img {width: 100%; display: block; transition: 1s;}
#suggestion .suggestion .item-box .item h2 {
  color: #333333;
  text-align: center;
  font-size: 18px;
  font-weight: 400;
  line-height: 28px;
  letter-spacing: -0.3px;
  transition: 1s;
}
#suggestion .suggestion .item-box-pc { display: flex;}
#suggestion .suggestion .item-box-m { display: none;}

/******************************* home *******************************/

#home #sec01 {}
#home .sec01 {padding: 160px 0 100px; text-align: center;}
#home .sec01 .tit-area { margin-bottom: 52px;}
#home .sec01 .tit-area h1 {
  font-size: 52px;
  font-weight: 800;
  line-height: 62.4px;
  color: #4541FF;
  margin-bottom: 20px;
}
#home .sec01 .tit-area p{
  color: #828282;
  font-size:  18px;
  font-weight: 400;
  line-height: 28.8px;
}
#home .sec01 .btn-area {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 16px;
}
#home .sec01 .btn-area a{
  font-size: 16px;
  font-weight: 800;
  line-height: normal;
  
  padding: 16px 32px;
  border-radius: 100px;
}
#home .sec01 .btn-area a:nth-child(1){
  color: #fff;
  background-color: #4541FF;
}
#home .sec01 .btn-area a:nth-child(2){
  color: #4541FF;
  background-color: #fff;
  border: 1px solid #4541FF;
}

#home #sec02 { background: linear-gradient(180deg, rgba(69, 65, 255, 0.00) 0%, rgba(69, 65, 255, 0.15) 49.94%, rgba(69, 65, 255, 0.00) 100%);}
#home .sec02 {padding: 0;}

#home .sec02 .slide-area { 
  width: 100%;
  display: flex;
  flex-direction: column;
  filter: drop-shadow(rgba(50, 83, 198, 0.14) 0px 18px 40px);
  overflow: hidden;
  padding: 100px 0;
}
#home .sec02 .slide-area .slide.slide1 {
  display: flex;
  -webkit-box-align: stretch;
  align-items: stretch;
  flex-direction: row;
  animation-direction: normal;
  animation-duration: 24s;
  animation-name: slide;
  animation-iteration-count: infinite;
  animation-timing-function: linear;
}
#home .sec02 .slide-area .slide.slide2 {
  display: flex;
  -webkit-box-align: stretch;
  align-items: stretch;
  flex-direction: row;
  animation-direction: reverse;
  animation-duration: 24s;
  animation-name: slide;
  animation-iteration-count: infinite;
  animation-timing-function: linear;
}

@keyframes slide {
  100% {
    transform: translateX(-100%);
  }
}

#home .sec02 .slide-area .slide .slide-item {
  flex: none;
  width: 282px;
  height: 180px;
  margin-right: 24px;
  padding: 20px; 
  border-radius: 20px;
  background: #fff;
  box-shadow: 0px 0px 16px 0px rgba(0, 0, 0, 0.10);
}
#home .sec02 .slide-area .slide .slide-item .icon {
  width: 30px;  
  margin-bottom: 58px;
}
#home .sec02 .slide-area .slide .slide-item .icon img {
  width: 100%;
  display: block;
}

#home .sec02 .slide-area .slide .slide-item .txt-area p{
  color:#1A1A1A;
  font-size: 20px;
  font-weight: 700;
  line-height: 20px;
  
  margin-bottom: 10px;
}
#home .sec02 .slide-area .slide .slide-item .txt-area span{
  color:#333;
  font-size: 14px;
  font-weight: 400;
  line-height: 22.4px ;
  
}


#home .sec02 .slide-area .slide.slide2 {margin-top: 24px;}


#home #sec03 {}
#home .sec03 {padding: 200px 0; text-align: center;}
#home .sec03 .tit-area { margin-bottom: 52px;}
#home .sec03 .tit-area h1 {
  font-size: 52px;
  font-weight: 800;
  line-height: 62.4px;
  
  color: #333;
  margin-bottom: 20px;
}
#home .sec03 .tit-area p{
  color: #828282;
  font-size: 18px;
  font-weight: 400;
  line-height: 28.8px;
  
}
#home .sec03 .btn-area {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 16px;
  margin-bottom: 48px;
}
#home .sec03 .btn-area a{
  font-size: 16px;
  font-weight: 800;
  line-height: normal;
  
  padding: 16px 32px;
  border-radius: 100px;
  color: #4541FF;
  background-color: #fff;
  border: 1px solid #4541FF;
}

#home .sec03 .brand-area {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
  gap: 48px 20px;
}

#home .sec03 .brand-area .brand {width: 224px;}
#home .sec03 .brand-area .brand img {width: 100%; display: block;}

#home .sec03 .brand-area-m {display: none;}

#home #sec04 {background: radial-gradient(66.36% 40.53% at 64.92% 74.17%, rgba(176, 227, 255, 0.60) 0%, rgba(146, 216, 255, 0.00) 100%), radial-gradient(66.65% 66.06% at 22.06% 53.20%, rgba(156, 196, 255, 0.60) 0%, rgba(230, 240, 255, 0.00) 100%), radial-gradient(96.51% 81.59% at 81.80% 18.16%, rgba(69, 65, 255, 0.20) 0%, rgba(249, 249, 249, 0.00) 100%);}
#home .sec04 {padding: 200px 0;}
#home .sec04 .tit-area { margin-bottom: 48px;}
#home .sec04 .tit-area span {
  display: inline-block;
  margin-bottom: 16px;
  font-size: 22px;
  font-weight: 700;
  line-height: 28.6px;
  
  color: #4541FF;
}
#home .sec04 .tit-area h1 {
  font-size: 52px;
  font-weight: 800;
  line-height: 62.4px; 
  color: #333;
}

#home .sec04 .item-area {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 60px 24px;
}
#home .sec04 .item-area .item {
  text-align: center;
}
#home .sec04 .item-area .item .img-box {/* max-width: 588px;  */width: 100%; margin-bottom: 20px;}
#home .sec04 .item-area .item .img-box img {width: 100%; display: block;}
#home .sec04 .item-area .item span {
  font-size: 18px;
  font-weight: 400;
  line-height: 28px; 
  color: #333;
  letter-spacing: -0.3px;
}

#home #sec05 {background-color: #fff;}
#home .sec05 {padding: 200px 0;}
#home .sec05 .tit-area { margin-bottom: 48px;}
#home .sec05 .tit-area h1 {
  font-size: 52px;
  font-weight: 800;
  line-height: 62.4px;  
  color: #333;
  margin-bottom: 20px;
}
#home .sec05 .tit-area h1 span {
  color: #4541FF;
}


#home .sec05 .item-box {
  display: flex;
  gap: 24px;
  flex-wrap: wrap;
}
#home .sec05 .item-box .item {
  background-color: #fff;
  box-shadow: 0px 0px 20px 0px rgba(69, 65, 255, 0.20);
  width: 282px;
  height: 223px;
  border-radius: 20px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  justify-content: center;
  align-items: center;
  transition: background-color 1s;
}
#home .sec05 .item-box .item:hover {
  background-color: #4541FF;
  box-shadow: none;
 }
 #home .sec05 .item-box .item:hover .icon img {filter: brightness(10);}
 #home .sec05 .item-box .item:hover h2 {
  color: #fff;
 }

#home .sec05 .item-box .item .icon {max-width: 48px; }
#home .sec05 .item-box .item .icon img {width: 100%; display: block; transition: 1s;}
#home .sec05 .item-box .item h2 {
  color: #333;
  text-align: center;
  font-size: 18px;
  font-weight: 400;
  line-height: 28px;
  transition: 1s;
  letter-spacing: -0.3px;
}
#home .sec05 .item-box-pc { display: flex;}
#home .sec05 .item-box-m { display: none;}


#home #sec06 {background: #4541FF;}
#home .sec06 {
  padding: 140px 0;
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
}

#home .sec06 .tit-area {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%,-50%);
  text-align: center;
  width: 100%;
  color: #fff;
  margin-top: 45px;
  opacity: 0;
}

#home .sec06 .tit-area.active {
  animation: fadeIn .5s linear;
  animation-fill-mode: forwards;
  animation-delay: 1s;
}

#home .sec06 .tit-area h1{ 
  font-size: 52px;
  font-weight: 800;
  line-height: 62.4px;
  margin-bottom: 20px;
}
#home .sec06 .tit-area p{
  font-size: 18px;
  font-weight: 400;
  line-height: 28.8px; 
}

#home .sec06 .tit-area a {display: none;}

@keyframes fadeIn {
  100% {
    opacity: 1;
  }
}

#home .sec06 .circle { opacity: 0;  transition: 5s;}
#home .sec06 .circle.on { opacity: 1; }

#home .sec06 .circle img {
  animation: rotate 6s linear infinite;
  transform-origin: 50% 50%;
} 

@keyframes rotate{
  100% {
      transform: rotate(360deg);
  }
}

#home #sec07 {}
#home .sec07 {padding: 200px 0 100px;}
#home .sec07 .tit-area { margin-bottom: 52px;}
#home .sec07 .tit-area p{
  color: #A788FF;
  font-size: 22px;
  font-weight: 700;
  line-height: 28.8px;
  
  margin-bottom: 16px;
}
#home .sec07 .tit-area h1 {
  font-size: 52px;
  font-weight: 800;
  line-height: 62.4px;
  
  color: #333;
}
#home .sec07 .btn-area {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  gap: 16px;
  margin-bottom: 48px;
}
#home .sec07 .btn-area a{
  font-size: 16px;
  font-weight: 800;
  line-height: normal;
  
  padding: 16px 32px;
  border-radius: 100px;
}
#home .sec07 .btn-area a:nth-child(1){
  color: #fff;
  background-color: #4541FF;
}
#home .sec07 .btn-area a:nth-child(2){
  color: #4541FF;
  background-color: #fff;
  border: 1px solid #4541FF;
}

#home .sec07 .box-width {
  display: flex;
  gap: 24px;
}
#home .sec07 .solution-img img {width: 100%; display: block;}

#home #sec08 {}
#home .sec08 {padding: 100px 0;}
#home .sec08 .tit-area { margin-bottom: 52px;}
#home .sec08 .tit-area p{
  color: #4AB7B3;
  font-size: 22px;
  font-weight: 700;
  line-height: 28.8px;
  
  margin-bottom: 16px;
}
#home .sec08 .tit-area h1 {
  font-size: 52px;
  font-weight: 800;
  line-height: 62.4px;
  
  color: #333;
}
#home .sec08 .btn-area {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  gap: 16px;
  margin-bottom: 48px;
}
#home .sec08 .btn-area a{
  font-size: 16px;
  font-weight: 800;
  line-height: normal;
  
  padding: 16px 32px;
  border-radius: 100px;
}
#home .sec08 .btn-area a:nth-child(1){
  color: #fff;
  background-color: #4541FF;
}
#home .sec08 .solution-img img {width: 100%; display: block;}

#home #sec09 {}
#home .sec09 {padding: 100px 0;}
#home .sec09 .tit-area { margin-bottom: 52px;}
#home .sec09 .tit-area p{
  color: #518CFF;
  font-size: 22px;
  font-weight: 700;
  line-height: 28.8px;
  
  margin-bottom: 16px;
}
#home .sec09 .tit-area h1 {
  font-size: 52px;
  font-weight: 800;
  line-height: 62.4px;
  
  color: #333;
}
#home .sec09 .btn-area {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  gap: 16px;
  margin-bottom: 48px;
}
#home .sec09 .btn-area a{
  font-size: 16px;
  font-weight: 800;
  line-height: normal;
  
  padding: 16px 32px;
  border-radius: 100px;
}
#home .sec09 .btn-area a:nth-child(1){
  color: #fff;
  background-color: #4541FF;
}
#home .sec09 .solution-img img {width: 100%; display: block;}

#home #sec10 {}
#home .sec10 {padding: 100px 0 200px;}
#home .sec10 .tit-area { margin-bottom: 52px;}
#home .sec10 .tit-area p{
  color: #F2994A;
  font-size: 22px;
  font-weight: 700;
  line-height: 28.8px;
  
  margin-bottom: 16px;
}
#home .sec10 .tit-area h1 {
  font-size: 52px;
  font-weight: 800;
  line-height: 62.4px;
  
  color: #333;
}
#home .sec10 .btn-area {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  gap: 16px;
  margin-bottom: 48px;
}
#home .sec10 .btn-area a{
  font-size: 16px;
  font-weight: 800;
  line-height: normal;
  
  padding: 16px 32px;
  border-radius: 100px;
}
#home .sec10 .btn-area a:nth-child(1){
  color: #fff;
  background-color: #4541FF;
}
#home .sec10 .solution-img img {width: 100%; display: block;}

#home #sec11 {
  background: radial-gradient(78.74% 73.51% at 84.35% 86.86%, rgba(69, 65, 255, 0.15) 0%, rgba(69, 65, 255, 0.00) 100%), radial-gradient(67.05% 106.74% at 22.94% 19.96%, rgba(156, 196, 255, 0.60) 0%, rgba(156, 196, 255, 0.00) 100%);
}
#home .sec11 {padding: 200px 0; text-align: center;}
#home .sec11 .tit-area { margin-bottom: 52px;}
#home .sec11 .tit-area h1 {
  font-size: 52px;
  font-weight: 800;
  line-height: 62.4px;
  color: #4F4F4F;
}
#home .sec11 .tit-area h1 span.color {
  color: #333;
}

#home .sec11 .service-box {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
  gap: 25px;
}

#home .sec11 .service-box .service {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  gap: 8px;
  border-radius: 20px;
  width: 220px;
  height: 220px;
  background-color: #fff;
}

#home .sec11 .service-box .service .service-img {max-width: 76px; width: 100%;}
#home .sec11 .service-box .service .service-img img {width: 100%; height: 100%; display: block;}

#home .sec11 .service-box .service span {
  display: inline-block;
  color: #4541FF;
  font-size: 18px;
  font-weight: 400;
  line-height: 28px;
  letter-spacing: -0.3px;
}

#api #sec01 {
  background: radial-gradient(84.48% 73.94% at 31.82% 91.89%, rgba(147, 209, 255, 0.20) 0%, rgba(147, 209, 255, 0.00) 100%), radial-gradient(69.88% 64.83% at 85.03% 51.50%, rgba(69, 65, 255, 0.20) 0%, rgba(255, 255, 255, 0.00) 100%);
}
#api .sec01 {padding: 160px 0 140px; text-align: center;}
#api .sec01 .tit-area { margin-bottom: 52px; text-align: center;}
#api .sec01 .tit-area .icon {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 6px;
  width: 131px;
  padding: 4px 0;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 16px;
  border-radius: 4px;
  background-color: #E6F0FF;
  color: #4541FF;
  font-size: 22px;
  font-weight: 700;
  line-height:  28.6px;
  
}
#api .sec01 .tit-area .icon img {width: 24px; display: block;}

#api .sec01 .tit-area h1 {
  font-size: 52px;
  font-weight: 800;
  line-height: 62.4px;
  
  color: #333;
  margin-bottom: 16px;
}
#api .sec01 .tit-area p{
  color: #828282;
  font-size: 18px;
  font-weight: 400;
  line-height: 28.8px;
  
}
#api .sec01 .btn-area {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 16px;
  margin-bottom: 52px;
}
#api .sec01 .btn-area a{
  font-size: 16px;
  font-weight: 800;
  line-height: normal;
  
  padding: 16px 32px;
  border-radius: 100px;
}
#api .sec01 .btn-area a:nth-child(1){
  color: #fff;
  background-color: #4541FF;
}
#api .sec01 .btn-area a:nth-child(2){
  color: #4541FF;
  background-color: #fff;
  border: 1px solid #4541FF;
}

#api .sec01 .sec01-img {display: inline-block; max-width: 1200px; margin: 0 auto;}
#api .sec01 .sec01-img img {width: 100%; display: block;}

#api #sec02 { background-color: #fff;}
#api .sec02 {padding: 200px 0 100px;}
#api .sec02 .tit-area { margin-bottom: 52px;}
#api .sec02 .tit-area p{
  color: #A788FF;
  font-size: 22px;
  font-weight: 700;
  line-height: 28.8px;
  margin-bottom: 16px;
}
#api .sec02 .tit-area h1 {
  font-size: 52px;
  font-weight: 800;
  line-height: 62.4px;
  color: #333;
}

#api .sec02 .box-area01{
  width: 100%;
  height: 495px;
  padding: 0 40px;
  border-radius: 20px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  background: url('../img/api-sec02-img1.png') no-repeat center center;
  background-size: cover;
  margin-bottom: 24px;
}

#api .sec02 .box-area01 .txt-area h2{
  font-size: 36px;
  font-weight: 700;
  line-height: 43.2px;
  
  margin-bottom: 16px;
  color: #333333;
}
#api .sec02 .box-area01 .txt-area p{
  font-size: 18px;
  font-weight: 400;
  line-height: 28.8px;
  
  color: #828282;
}
#api .sec02 .box-area02{
  width: 100%;
  height: 369px;
  padding: 40px;
  border-radius: 20px;
  display: flex;
  justify-content: space-between;
  background-color: #F9F9F9;
}

#api .sec02 .box-area02 .txt-area h2{
  font-size: 36px;
  font-weight: 700;
  line-height: 43.2px;
  color: #333333;
}

#api #sec03 { background-color: #fff;}
#api .sec03 {padding: 100px 0;}
#api .sec03 .tit-area { margin-bottom: 52px;}
#api .sec03 .tit-area p{
  color: #518CFF;
  font-size: 22px;
  font-weight: 700;
  line-height: 28.8px;
  
  margin-bottom: 16px;
}
#api .sec03 .tit-area h1 {
  font-size: 52px;
  font-weight: 800;
  line-height: 62.4px;
  
  color: #333;
}

#api .sec03 .box-area01{
  width: 100%;
  height: 395px;
  padding: 0 40px;
  border-radius: 20px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  background: url('../img/api-sec03-img1.png') no-repeat center center;
  background-size: cover;
  margin-bottom: 24px;
}

#api .sec03 .box-area01 .txt-area h2{
  font-size: 36px;
  font-weight: 700;
  line-height: 43.2px;
  
  margin-bottom: 16px;
  color: #333333;
}
#api .sec03 .box-area01 .txt-area p{
  font-size: 18px;
  font-weight: 400;
  line-height: 28.8px;
  
  color: #828282;
}
#api .sec03 .box-area02{
  width: 100%;
  height: 369px;
  padding: 40px;
  border-radius: 20px;
  display: flex;
  justify-content: space-between;
  background-color: #F9F9F9;
}

#api .sec03 .box-area02 .txt-area h2{
  font-size: 36px;
  font-weight: 700;
  line-height: 43.2px;
  
  margin-bottom: 16px;
  color: #333333;
}

#api #sec04 { background-color: #fff;}
#api .sec04 {padding: 100px 0;}
#api .sec04 .tit-area { margin-bottom: 52px;}
#api .sec04 .tit-area p{
  color: #F093F0;
  font-size: 22px;
  font-weight: 700;
  line-height: 28.8px;
  
  margin-bottom: 16px;
}
#api .sec04 .tit-area h1 {
  font-size: 52px;
  font-weight: 800;
  line-height: 62.4px;
  
  color: #333;
}

#api .sec04 .box-area01{
  width: 100%;
  height: 672px;
  padding: 0 40px;
  border-radius: 20px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  background: url('../img/api-sec04-img1.png') no-repeat center center;
  background-size: cover;
  margin-bottom: 24px;
}

#api .sec04 .box-area01 .txt-area h2{
  font-size: 36px;
  font-weight: 700;
  line-height: 43.2px;
  
  margin-bottom: 16px;
  color: #333333;
}
#api .sec04 .box-area01 .txt-area p{
  font-size: 18px;
  font-weight: 400;
  line-height: 28.8px;  
  color: #828282;
}

#api .sec04 .box-area01 .img-area {display: none;}



#api .sec04 .box-width {
  display: flex;
  gap: 24px;
}

#api .sec04 .box-width .box-area {
  width: 100%;
  padding: 40px;
  border-radius: 20px;
}
#api .sec04 .box-width .box-area .img-area {
  max-width: 160px;
  margin-bottom: 36px;
}
#api .sec04 .box-width .box-area .img-area img {width: 100%; display: block;}


#api .sec04 .box-width .box-area h2 {
  color: #333;
  font-size: 22px;
  font-weight: 700;
  line-height: 28.6px;
  
  margin-bottom: 20px;
}
#api .sec04 .box-width .box-area p {
  color: #828282;
  font-size: 22px;
  font-weight: 400;
  line-height: 35.2px;
  
}

#api .sec04 .box-width .box-area02 {
  background-color: #F9F9F9;
}
#api .sec04 .box-width .box-area03 {
  background-color: #F2E1F2;
}

#api #sec05 { background-color: #fff;}
#api .sec05 {padding: 100px 0;}
#api .sec05 .tit-area { margin-bottom: 52px;}
#api .sec05 .tit-area p{
  color: #4AB7B3;
  font-size: 22px;
  font-weight: 700;
  line-height: 28.8px;
  margin-bottom: 16px;
}

#api .sec05 .tit-area h1 {
  font-size: 52px;
  font-weight: 800;
  line-height: 62.4px;
  
  color: #333;
}

#api .sec05 .box-width {
  display: flex;
  gap: 24px;
}

#api .sec05 .box-width .box-area {
  width: 100%;
  padding: 40px;
  border-radius: 20px;
}

#api .sec05 .box-width .box-area .txt-area h2 {
  color: #333;
  font-size: 36px;
  font-weight: 700;
  line-height: 43.2px;
    
  margin-bottom: 16px;
}
#api .sec05 .box-width .box-area .txt-area  p {
  color: #828282;
  font-size: 18px;
  font-weight: 400;
  line-height: 28.8px;
  
}

#api .sec05 .box-width .box-area .img-area img{
  width: 100%; 
  display: block;
}

#api .sec05 .box-width .box-area02 {
  background: linear-gradient(360deg, #DFEEDD 0%, #CBE6EF 100%);
  max-width: 792px;
  height: 480px;
}
#api .sec05 .box-width .box-area02 .txt-area  {
  margin-bottom: 40px;
}
#api .sec05 .box-width .box-area03 .txt-area  {
  margin-bottom: 48px;
}

#api .sec05 .box-width .box-area02 .img-area {
  max-width: 550px;
  margin: 0 auto;
}

#api .sec05 .box-width .box-area03 {
  background: #F9F9F9;
  max-width: 384px;
  height: 480px;
}

#api .sec05 .box-width .box-area03 .img-area {
  max-width: 180px;
  margin: 0 auto;
}

#api #sec06 { background-color: #fff;}
#api .sec06 {padding: 100px 0;}
#api .sec06 .tit-area { margin-bottom: 52px;}
#api .sec06 .tit-area p{
  color: #518CFF;
  font-size: 22px;
  font-weight: 700;
  line-height: 28.8px;
  
  margin-bottom: 16px;
}
#api .sec06 .tit-area h1 {
  font-size: 52px;
  font-weight: 800;
  line-height: 62.4px;
  
  color: #333;
}

#api .sec06 .box-area01{
  width: 100%;
  height: 495px;
  padding: 0 40px;
  border-radius: 20px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  background: url('../img/api-sec06-img1.png') no-repeat center center;
  background-size: cover;
}

#api .sec06 .box-area01 .txt-area h2{
  font-size: 36px;
  font-weight: 700;
  line-height: 43.2px;
  
  margin-bottom: 16px;
  color: #333333;
}
#api .sec06 .box-area01 .txt-area p{
  font-size: 18px;
  font-weight: 400;
  line-height: 28.8px;
  color: #828282;
}
#api .sec06 .box-area01 .img-area {display: none;}

#api #sec07 { background-color: #fff;}
#api .sec07 {padding: 100px 0;}
#api .sec07 .tit-area { margin-bottom: 52px;}
#api .sec07 .tit-area p{
  color: #A788FF;
  font-size: 22px;
  font-weight: 700;
  line-height: 28.8px;
  
  margin-bottom: 16px;
}
#api .sec07 .tit-area h1 {
  font-size: 52px;
  font-weight: 800;
  line-height: 62.4px;
  
  color: #333;
}

#api .sec07 .box-area01{
  width: 100%;
  height: 359px;
  padding: 0 40px;
  border-radius: 20px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  background: url('../img/api-sec07-img1.png') no-repeat center center;
  background-size: cover;
}

#api .sec07 .box-area01 .txt-area h2{
  font-size: 36px;
  font-weight: 700;
  line-height: 43.2px;
  
  margin-bottom: 16px;
  color: #333333;
}
#api .sec07 .box-area01 .txt-area p{
  font-size: 18px;
  font-weight: 400;
  line-height: 28.8px;
  
  color: #828282;
}

#api #sec08 { background-color: #fff;}
#api .sec08 {padding: 100px 0 200px;}
#api .sec08 .tit-area { margin-bottom: 52px;}
#api .sec08 .tit-area p{
  color: #F2994A;
  font-size: 18px;
  font-weight: 700;
  line-height: 28.8px;
  
  margin-bottom: 16px;
}
#api .sec08 .tit-area h1 {
  font-size: 52px;
  font-weight: 800;
  line-height: 62.4px;
  
  color: #333;
}

#api .sec08 .box-area01{
  width: 100%;
  height: 495px;
  padding: 0 40px;
  border-radius: 20px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  background: url('../img/api-sec08-img1.png') no-repeat center center;
  background-size: cover;
}

#api .sec08 .box-area01 .txt-area h2{
  font-size: 36px;
  font-weight: 700;
  line-height: 43.2px;
  
  margin-bottom: 16px;
  color: #333333;
}
#api .sec08 .box-area01 .txt-area p{
  font-size: 18px;
  font-weight: 400;
  line-height: 28.8px;
  color: #828282;
}
#api .sec08 .box-area01 .img-area {display: none;}

/*************************** icon ***************************/

#alarm #sec01 {
  background: radial-gradient(25.04% 66.96% at 75.42% 108.21%, rgba(156, 196, 255, 0.60) 0%, rgba(156, 196, 255, 0.00) 100%), radial-gradient(43.05% 47.42% at -5.05% 33.09%, rgba(69, 65, 255, 0.20) 0%, rgba(69, 65, 255, 0.00) 100%);
}
#alarm .sec01 {padding: 160px 0 140px; text-align: center;}
#alarm .sec01 .tit-area { margin-bottom: 52px; text-align: center;}
#alarm .sec01 .tit-area .icon {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 6px;
  width: 226px;
  padding: 4px 0;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 16px;
  border-radius: 4px;
  background-color: #E6F0FF;
  color: #4541FF;
  font-size: 22px;
  font-weight: 700;
  line-height:  28.6px;
  
}
#alarm .sec01 .tit-area .icon img {width: 24px; display: block;}

#alarm .sec01 .tit-area h1 {
  font-size: 52px;
  font-weight: 800;
  line-height: 62.4px;
  
  color: #333;
  margin-bottom: 16px;
}
#alarm .sec01 .tit-area p{
  color: #828282;
  font-size: 18px;
  font-weight: 400;
  line-height: 28.8px;
  
}
#alarm .sec01 .btn-area {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 16px;
  margin-bottom: 52px;
}
#alarm .sec01 .btn-area a{
  font-size: 16px;
  font-weight: 800;
  line-height: normal;
  
  padding: 16px 32px;
  border-radius: 100px;
}
#alarm .sec01 .btn-area a:nth-child(1){
  color: #fff;
  background-color: #4541FF;
}
#alarm .sec01 .btn-area a:nth-child(2){
  color: #4541FF;
  background-color: #fff;
  border: 1px solid #4541FF;
}

#alarm .sec01 .sec01-img {display: inline-block; max-width: 1200px; margin: 0 auto;}
#alarm .sec01 .sec01-img img {width: 100%; display: block;}

#alarm #sec02 { background-color: #fff;}
#alarm .sec02 {padding: 200px 0 100px;}
#alarm .sec02 .tit-area { margin-bottom: 52px;}
#alarm .sec02 .tit-area p{
  color: #A788FF;
  font-size: 22px;
  font-weight: 700;
  line-height: 28.8px;
  margin-bottom: 16px;
}
#alarm .sec02 .tit-area h1 {
  font-size: 52px;
  font-weight: 800;
  line-height: 62.4px;
  color: #333;
}

#alarm .sec02 .box-area01{
  width: 100%;
  height: 600px;
  padding: 0 40px;
  border-radius: 20px;
  display: flex;
  justify-content: space-between;
  gap: 90px;
  align-items: center;
  margin-bottom: 24px;
  background: var(--g-12, linear-gradient(136deg, #D4E6FF 0%, #BEB8FE 100%));
  overflow: hidden;
}

#alarm .sec02 .box-area01 .txt-area h2{
  font-size: 36px;
  font-weight: 700;
  line-height: 43.2px;
  margin-bottom: 16px;
  color: #333333;
}
#alarm .sec02 .box-area01 .txt-area p{
  font-size: 18px;
  font-weight: 400;
  line-height: 28.8px;
  color: #828282;
}

#alarm .sec02 .box-area01 .img-area {
  max-width: 640px;
  width: 100%;
}
#alarm .sec02 .box-area01 .img-area img {width: 100%; height: 100%; display: block;}


#alarm .sec02 .box-width {
  display: flex;
  gap: 24px;
  margin-bottom: 24px;
}
#alarm .sec02 .box-width .box-area {
  width: 100%;
  height: 598px;
  padding: 40px;
  border-radius: 20px;
  background: var(--light-blue, #E6F0FF);
}
#alarm .sec02 .box-width .box-area .img-area {
  margin: 0 auto;
}

#alarm .sec02 .box-width .box-area h2 {
  font-size: 36px;
  font-weight: 700;
  line-height: 43.2px;
  color: #333333;
  margin-bottom: 16px;
}
#alarm .sec02 .box-width .box-area p {
  color: #828282;
  font-size: 18px;
  font-weight: 400;
  line-height: 28px;
  
}

#alarm .sec02 .box-width .box-area02 {
  width: 384px;
}
#alarm .sec02 .box-width .box-area02 .img-area {text-align: center; max-width: 280px; display: block;}
#alarm .sec02 .box-width .box-area02 .img-area img {width: 100%; display: block;}
#alarm .sec02 .box-width .box-area03 .img-area {text-align: center; max-width: 600px; display: block;}
#alarm .sec02 .box-width .box-area03 .img-area img  {width: 100%; display: block;}

#alarm .sec02 .box-width .box-area02 .txt-area {margin-bottom: 62px;}

#alarm .sec02 .box-width .box-area03 {
  max-width: 792px;
}
#alarm .sec02 .box-width .box-area03 .txt-area {margin-bottom: 25px;}

#alarm .sec02 .box-area04 {
  display: flex;
  flex-wrap: wrap;
  gap: 24px; 
}

#alarm .sec02 .box-area04 .box {
  padding: 40px;
  width: 282px;
  background-color: #f9f9f9;
  border-radius: 20px;
}
#alarm .sec02 .box-area04 .box .icon {width: 48px; margin-bottom: 16px;}
#alarm .sec02 .box-area04 .box .icon img{width: 100%; display: block;}
#alarm .sec02 .box-area04 .box h2 {
  font-size: 22px;
  font-weight: 700;
  line-height: 28px;
  margin-bottom: 16px;
  color: #333;
}
#alarm .sec02 .box-area04 .box p {
  font-size: 18px;
  font-weight: 400;
  line-height: 28px;
  color: #828282;
}

#alarm #sec03 { background-color: #fff;}
#alarm .sec03 {padding: 100px 0;}
#alarm .sec03 .tit-area { margin-bottom: 52px;}
#alarm .sec03 .tit-area p{
  color: #F093F0;
  font-size: 22px ;
  font-weight: 700;
  line-height: 28.8px;
  
  margin-bottom: 16px;
}
#alarm .sec03 .tit-area h1 {
  font-size: 52px;
  font-weight: 800;
  line-height: 62.4px;
  
  color: #333;
}

#alarm .sec03 .box-area01{
  width: 100%;
  /* height: 10; */
  padding: 70px 0 83px;
  border-radius: 20px;
  display: flex;
  justify-content: center;
  flex-direction: column;
  align-items: center;
  background: linear-gradient(180deg, #F2E1F2 0%, #BEB4FF 100%);
  margin-bottom: 24px;
}
#alarm .sec03 .box-area01 .txt-area {text-align: center; margin-bottom: 61px;}
#alarm .sec03 .box-area01 .txt-area h2{
  font-size: 36px;
  font-weight: 700;
  line-height: 43.2px;
  margin-bottom: 16px;
  color: #333333;
}
#alarm .sec03 .box-area01 .txt-area p{
  font-size: 18px;
  font-weight: 400;
  line-height: 28.8px;
  color: #828282;
}
#alarm .sec03 .box-area01 .img-area {max-width: 980px;}
#alarm .sec03 .box-area01 .img-area img {width: 100%; display: block;}

#alarm .sec03 .box-width {
  display: flex;
  gap: 24px;
}

#alarm .sec03 .box-width .box-area {
  width: 100%;
  height: 760px;
  padding: 40px;
  border-radius: 20px;
  background-color: #F9F9F9;
  position: relative;
}
#alarm .sec03 .box-width .box-area .img-area {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  max-width: 360px;
  width: 100%;
}
#alarm .sec03 .box-width .box-area .img-area img {width: 100%; display: block;}
#alarm .sec03 .box-width .box-area .txt-area {}
#alarm .sec03 .box-width .box-area h2 {
  color: #333;
  font-size: 36px;
  font-weight: 700;
  line-height: 43px;
  margin-bottom: 16px;
}
#alarm .sec03 .box-width .box-area p {
  color: #828282;
  font-size: 18px;
  font-weight: 400;
  line-height: 28px;
  
}




#alarm #sec04 { background-color: #fff;}
#alarm .sec04 {padding: 100px 0;}
#alarm .sec04 .tit-area { margin-bottom: 52px;}
#alarm .sec04 .tit-area p{
  color: #4AB7B3;
  font-size: 22px;
  font-weight: 700;
  line-height: 28.8px;
  
  margin-bottom: 16px;
}
#alarm .sec04 .tit-area h1 {
  font-size: 52px;
  font-weight: 800;
  line-height: 62.4px;
  
  color: #333;
}

#alarm .sec04 .box-area01{
  width: 100%;
  height: 495px;
  padding: 0 40px;
  border-radius: 20px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  background: url('../img/alarm-sec04-img1.png') no-repeat center center;
}

#alarm .sec04 .box-area01 .txt-area h2{
  font-size: 36px;
  font-weight: 700;
  line-height: 43.2px;
  
  margin-bottom: 16px;
  color: #333333;
}
#alarm .sec04 .box-area01 .txt-area p{
  font-size: 18px;
  font-weight: 400;
  line-height: 28.8px;  
  color: #828282;
}
#alarm .sec04 .box-area01 .img-area {display: none;} 

#alarm.shortlink .sec04 .box-area01{
  height: auto;
  padding: 40px;
  border-radius: 20px;
  background: none;
  background-color: #F9F9F9;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 24px;
}
#alarm.shortlink .sec04 .box-area01 .img-area {display: block; max-width: 420px; width: 100%;}
#alarm.shortlink .sec04 .box-area01 .img-area img {width: 100%; display: block;}
#alarm.shortlink .sec04 .box-area01 .txt-area h2 {font-size: 36px; font-weight: 700; line-height: 43.2px; margin-bottom: 16px; color: #333;}
#alarm.shortlink .sec04 .box-area01 .txt-area p {font-size: 18px; line-height: 28.8px; color: #828282;}

#alarm.shortlink .sec04 .box-width {display: flex; gap: 24px;}
#alarm.shortlink .sec04 .box-width .box-area {width: 100%; height: 520px; padding: 40px; border-radius: 20px; background-color: #F9F9F9; position: relative;}
#alarm.shortlink .sec04 .box-width .box-area .img-area {position: absolute; bottom: 24px; left: 50%; transform: translateX(-50%); max-width: 360px; width: 100%;}
#alarm.shortlink .sec04 .box-width .box-area .img-area img {width: 100%; display: block;}
#alarm.shortlink .sec04 .box-width .box-area h2 {color: #333; font-size: 32px; font-weight: 700; line-height: 40px; margin-bottom: 12px;}
#alarm.shortlink .sec04 .box-width .box-area p {color: #828282; font-size: 18px; line-height: 28px;}

#alarm #sec05 { background-color: #fff;}
#alarm .sec05 {padding: 100px 0;}
#alarm .sec05 .tit-area { margin-bottom: 52px;}
#alarm .sec05 .tit-area .point {display: none;}
#alarm .sec05 .tit-area p{
  color: #F2994A;
  font-size: 22px;
  font-weight: 700;
  line-height: 28.8px; 
  margin-bottom: 16px;
  display: flex;
  align-items: center;
  gap: 4px;
}

/* Auto-Commerce overrides */
#alarm.autocommerce .sec01 .tit-area span.icon img {width: 24px; height: 24px; margin-right: 8px;}
#alarm.autocommerce .sec03 .box-width .box-area {background-color: #F5FFF9; height: 460px; }
#alarm.autocommerce .sec03 .box-width .box-area .img-area {position: static; left: auto; transform: none; margin: 30px auto 0;}
#alarm.autocommerce .sec04 .box-area01 {height: auto; padding: 40px; border-radius: 20px; background: none; background-color: #F5FFF9; display: flex; justify-content: space-between; align-items: center; gap: 24px;}
#alarm.autocommerce .sec04 .box-area01 .img-area {display: block; max-width: 420px; width: 100%;}
#alarm.autocommerce .sec04 .box-area01 .img-area img {width: 100%; display: block;}
#alarm.autocommerce .sec04 .tit-area p .badge-planned {
  display: inline-block;
  margin-left: 8px;
  padding: 3px 8px;
  font-size: 12px;
  font-weight: 600;
  line-height: normal;
  color: #fff;
  background-color: #9E9E9E;
  border-radius: 4px;
}
#alarm .sec05 .tit-area p span {
  display: inline-block;
  color: #fff;
  background-color: #F2994A;
  padding: 4px 8px;
  font-size: 14px;
  font-weight: 600;
  border-radius: 2px;
  line-height: normal;
}

#alarm .sec05 .tit-area p span:nth-child(1) {
  margin-left: 16px;
}

#alarm .sec05 .tit-area h1 {
  font-size: 52px;
  font-weight: 800;
  line-height: 62.4px;
  color: #333;
}

#alarm.shortlink .sec01 .tit-area .icon { gap: 8px; }

#alarm .sec05 .btn-area {
  margin-bottom: 48px; 
}

#alarm .sec05 .btn-area a{
  font-size: 16px;
  font-weight: 800;
  line-height: normal;
  padding: 16px 32px;
  border-radius: 100px;
  color: #4541FF;
  background-color: #fff;
  border: 1px solid #4541FF;
}

#alarm .sec05 .box-area01{
  width: 100%;
  height: 495px;
  padding: 0 40px;
  border-radius: 20px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  background: url('../img/alarm-sec05-img1.png') no-repeat center center;
}

#alarm .sec05 .box-area01 .txt-area h2{
  font-size: 36px;
  font-weight: 700;
  line-height: 43.2px;
  
  margin-bottom: 16px;
  color: #333333;
}
#alarm .sec05 .box-area01 .txt-area p{
  font-size: 18px;
  font-weight: 400;
  line-height: 28.8px;  
  color: #828282;
}
#alarm .sec05 .box-area01 .img-area {display: none;} 

 
#alarm #sec06 { background-color: #fff;}
#alarm .sec06 {padding: 100px 0 200px;}
#alarm .sec06 .tit-area { margin-bottom: 52px;}
#alarm .sec06 .tit-area p{
  color: #518CFF;
  font-size: 22px;
  font-weight: 700;
  line-height: 28.8px;
  
  margin-bottom: 16px;
}
#alarm .sec06 .tit-area h1 {
  font-size: 52px;
  font-weight: 800;
  line-height: 62.4px;
  color: #333;
}

#alarm .sec06 .box-width {
  display: flex;
  gap: 24px;
}

#alarm .sec06 .box-width .box-area {
  width: 100%;
  padding: 40px;
  border-radius: 20px;
}
#alarm .sec06 .box-width .box-area .img-area {
  width: 60px;
  margin-bottom: 36px;
}
#alarm .sec06 .box-width .box-area .img-area img {width: 100%; display: block;}


#alarm .sec06 .accordion-area{max-width: 792px; margin: 0 auto;}
#alarm .sec06 .accordion-area .accordion .accordion-item{border-radius: 5px; overflow: hidden; padding: 20px 0;}
#alarm .sec06 .accordion-area .accordion-title{cursor: pointer; border: none; background: none; width: 100%; text-align: left; padding: 0;}
#alarm .sec06 .accordion-area .accordion-title h2{font-weight: 700; font-size: 24px; line-height: 34px; position: relative; display: flex; gap: 24px; border: none;}
#alarm .sec06 .accordion-area .accordion-title h2 .icon{width: 36px; height: 36px; background-color: #f2f2f2; border-radius: 50%; position: relative;}
#alarm .sec06 .accordion-area .accordion-title h2 .icon span:nth-child(1){position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); width: 12px; height: 2px; background-color: #333;}
#alarm .sec06 .accordion-area .accordion-title h2 .icon span:nth-child(2){position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); width: 2px; height: 12px; background-color: #333; transition: background-color 0.3s;}
#alarm .sec06 .accordion-area .accordion-title.on h2 .icon span:nth-child(2){background-color: transparent;}
#alarm .sec06 .accordion-area .accordion-contant{padding-left: 64px; display: grid; grid-template-rows: 0fr; transition: grid-template-rows 0.25s ease-out;}
#alarm .sec06 .accordion-area .accordion-contant > p{font-weight: 300; font-size: 18px; line-height: 28px; overflow: hidden; min-height: 0; padding-top: 0; padding-bottom: 0; transition: padding 0.25s ease-out;}
#alarm .sec06 .accordion-area .accordion-title.on + .accordion-contant{grid-template-rows: 1fr;}
#alarm .sec06 .accordion-area .accordion-title.on + .accordion-contant > p{padding-top: 24px; padding-bottom: 8px;}

#alarm .sec06 .box-width .box-area h2 {
  color: #333;
  font-size: 22px;
  font-weight: 700;
  line-height: 28.6px;
  
  margin-bottom: 20px;
}
#alarm .sec06 .box-width .box-area p {
  color: #333;
  font-size: 22px;
  font-weight: 400;
  line-height: 35.2px;
  
}

#alarm .sec06 .box-width .box-area02 {
  background-color: #E6F0FF;
}
#alarm .sec06 .box-width .box-area03 {
  background-color: #F4EDFB;
}
#rcs #sec01 {
  background: radial-gradient(66.45% 82.48% at 10.46% 81.95%, rgba(137, 220, 255, 0.30) 0%, rgba(137, 220, 255, 0.00) 100%), radial-gradient(38.38% 50.75% at 69.75% 65.25%, rgba(221, 180, 254, 0.30) 0%, rgba(204, 180, 254, 0.00) 100%);
}
#rcs .sec01 {padding: 160px 0 100px; text-align: center;}
#rcs .sec01 .tit-area { margin-bottom: 52px; text-align: center;}
#rcs .sec01 .tit-area .icon {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 6px;
  width: 204px;
  padding: 4px 0;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 16px;
  border-radius: 4px;
  background-color: #E6F0FF;
  color: #4541FF;
  font-size: 22px;
  font-weight: 700;
  line-height:  28.6px;
  
}
#rcs .sec01 .tit-area .icon img {width: 24px; display: block;}

#rcs .sec01 .tit-area h1 {
  font-size: 52px;
  font-weight: 800;
  line-height: 62.4px;
  
  color: #333;
  margin-bottom: 16px;
}
#rcs .sec01 .tit-area p{
  color: #828282;
  font-size: 18px;
  font-weight: 400;
  line-height: 28.8px;
  
}
#rcs .sec01 .btn-area {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 16px;
  margin-bottom: 52px;
}
#rcs .sec01 .btn-area a{
  font-size: 16px;
  font-weight: 800;
  line-height: normal;
  
  padding: 16px 32px;
  border-radius: 100px;
}
#rcs .sec01 .btn-area a:nth-child(1){
  color: #fff;
  background-color: #4541FF;
}
#rcs .sec01 .btn-area a:nth-child(2){
  color: #4541FF;
  background-color: #fff;
  border: 1px solid #4541FF;
}

#rcs .sec01 .sec01-img {display: inline-block; max-width: 1200px; margin: 0 auto;}
#rcs .sec01 .sec01-img img {width: 100%; display: block;}

#rcs #sec02 { background-color: #fff;}
#rcs .sec02 {padding: 200px 0 100px;}
#rcs .sec02 .tit-area { margin-bottom: 52px;}
#rcs .sec02 .tit-area p{
  color: #A788FF;
  font-size: 22px;
  font-weight: 700;
  line-height: 28.8px;
  margin-bottom: 16px;
}
#rcs .sec02 .tit-area h1 {
  font-size: 52px;
  font-weight: 800;
  line-height: 62.4px;
  color: #333;
}

#rcs .sec02 .box-area01{
  width: 100%;
  height: 600px;
  padding: 0 40px;
  border-radius: 20px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  background: url('../img/rcs-sec02-img1.png') no-repeat center center;
  background-size: cover;
}

#rcs .sec02 .box-area01 .txt-area h2{
  font-size: 36px;
  font-weight: 700;
  line-height: 43.2px;
  
  margin-bottom: 16px;
  color: #333333;
}
#rcs .sec02 .box-area01 .txt-area p{
  font-size: 18px;
  font-weight: 400;
  line-height: 28.8px;  
  color: #828282;
}
#rcs .sec02 .box-area01 .img-area {display: none;} 

#rcs #sec03 { background-color: #fff;}
#rcs .sec03 {padding: 100px 0;}
#rcs .sec03 .tit-area { margin-bottom: 52px;}
#rcs .sec03 .tit-area p{
  color: #518CFF;
  font-size: 22px;
  font-weight: 700;
  line-height: 28.8px;
  
  margin-bottom: 16px;
}
#rcs .sec03 .tit-area h1 {
  font-size: 52px;
  font-weight: 800;
  line-height: 62.4px;
  
  color: #333;
}


#rcs .sec03 .box-width {
  display: flex;
  gap: 24px;
}

#rcs .sec03 .box-width .box-area {
  width: 100%;
  padding: 40px;
  border-radius: 20px;
  background-color: #F9F9F9;
}
#rcs .sec03 .box-width .box-area .img-area {
  max-width: 360px;
  width: 100%;
  margin: 0 auto;
}
#rcs .sec03 .box-width .box-area .img-area img {width: 100%; display: block;}
#rcs .sec03 .box-width .box-area .txt-area {
  margin-bottom: 28px;
}
#rcs .sec03 .box-width .box-area h2 {
  color: #333;
  font-size: 36px;
  font-weight: 700;
  line-height: 43px;
  margin-bottom: 16px;
}
#rcs .sec03 .box-width .box-area p {
  color: #828282;
  font-size: 18px;
  font-weight: 400;
  line-height: 28px;
  
}

#rcs .sec03 .box-width .box-area02 {
  background-color: #F4EDFB;
}
#rcs .sec03 .box-width .box-area03 {
  background-color: #E6F0FF;
}



#rcs #sec04 { background-color: #fff;}
#rcs .sec04 {padding: 100px 0;}
#rcs .sec04 .tit-area { margin-bottom: 52px;}
#rcs .sec04 .tit-area p{
  color: #F2994A;
  font-size: 22px;
  font-weight: 700;
  line-height: 28.8px;
  
  margin-bottom: 16px;
}
#rcs .sec04 .tit-area h1 {
  font-size: 52px;
  font-weight: 800;
  line-height: 62.4px;
  
  color: #333;
}

#rcs .sec04 .box-width {
  display: flex;
  gap: 24px;
}

#rcs .sec04 .box-area01{
  width: 100%;
  height: 100%;
  padding: 48px 40px;
  border-radius: 20px;
  display: flex;
  align-items: center;
  gap: 53px;
  background: linear-gradient(134deg, #FFF4CC 0%, #FFE9DC 100%);
}

#rcs .sec04 .box-area01 .txt-area h2{
  font-size: 36px;
  font-weight: 700;
  line-height: 43.2px;
  
  margin-bottom: 16px;
  color: #333333;
}
#rcs .sec04 .box-area01 .txt-area p{
  font-size: 18px;
  font-weight: 400;
  line-height: 28.8px;  
  color: #828282;
}

#rcs .sec04 .box-area01 .img-area {max-width: 410px;}
#rcs .sec04 .box-area01 .img-area img {width: 100%; display: block;}

#rcs .sec04 .box-height {
  display: flex;
  flex-direction: column;
  gap: 24px;
}

#rcs .sec04 .box-height .box-area {
  width: 384px;
  height: 235px;
  padding: 40px 0 0 40px;
  background-color: #f9f9f9;
  border-radius: 20px;
}

#rcs .sec04 .box-height .box-area .icon {width: 48px; margin-bottom: 16px;} 
#rcs .sec04 .box-height .box-area .icon img {width: 100%; display: block;} 
#rcs .sec04 .box-height .box-area h2 {
  font-size: 22px;
  font-weight: 700;
  line-height: 28px;
}
 
#rcs #sec05 { background-color: #fff;}
#rcs .sec05 {padding: 100px 0 200px;}
#rcs .sec05 .tit-area { margin-bottom: 52px;}
#rcs .sec05 .tit-area p{
  color: #518CFF;
  font-size: 22px;
  font-weight: 700;
  line-height: 28.8px;
  
  margin-bottom: 16px;
}
#rcs .sec05 .tit-area h1 {
  font-size: 52px;
  font-weight: 800;
  line-height: 62.4px;
  color: #333;
}

#rcs .sec05 .box-width {
  display: flex;
  gap: 24px;
}

#rcs .sec05 .box-width .box-area {
  width: 100%;
  padding: 40px;
  border-radius: 20px;
}
#rcs .sec05 .box-width .box-area .img-area {
  width: 60px;
  margin-bottom: 36px;
}
#rcs .sec05 .box-width .box-area .img-area img {width: 100%; display: block;}

#rcs .sec05 .box-width .box-area h2 {
  color: #333;
  font-size: 22px;
  font-weight: 700;
  line-height: 28.6px;
  margin-bottom: 20px;
}
#rcs .sec05 .box-width .box-area p {
  color: #333;
  font-size: 22px;
  font-weight: 400;
  line-height: 35.2px;
  
}
#rcs .sec05 .box-width .box-area02 {
  background-color: #E6F0FF;
}
#rcs .sec05 .box-width .box-area03 {
  background-color: #F4EDFB;
}

#textsite #sec01 {
  background: radial-gradient(25.23% 32.51% at 79.53% 4.93%, rgba(139, 220, 255, 0.20) 0%, rgba(139, 220, 255, 0.00) 100%), radial-gradient(27.66% 56.21% at 29.51% 83.49%, rgba(202, 89, 255, 0.20) 0%, rgba(202, 89, 255, 0.00) 100%), radial-gradient(60.66% 60.11% at 68.78% 58.33%, rgba(69, 65, 255, 0.20) 0%, rgba(255, 255, 255, 0.00) 100%);
}
#textsite .sec01 {padding: 160px 0 100px; text-align: center;}
#textsite .sec01 .tit-area { margin-bottom: 52px; text-align: center;}
#textsite .sec01 .tit-area .icon {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 6px;
  width: 233px;
  padding: 4px 0;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 16px;
  border-radius: 4px;
  background-color: #E6F0FF;
  color: #4541FF;
  font-size: 22px;
  font-weight: 700;
  line-height:  28.6px;
  
}
#textsite .sec01 .tit-area .icon img {width: 24px; display: block;}

#textsite .sec01 .tit-area h1 {
  font-size: 52px;
  font-weight: 800;
  line-height: 62.4px;
  color: #333;
  margin-bottom: 16px;
}
#textsite .sec01 .tit-area p{
  color: #828282;
  font-size: 18px;
  font-weight: 400;
  line-height: 28.8px;
  
}
#textsite .sec01 .btn-area {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 16px;
  margin-bottom: 52px;
}
#textsite .sec01 .btn-area a{
  font-size: 16px;
  font-weight: 800;
  line-height: normal;
  
  padding: 16px 32px;
  border-radius: 100px;
}
#textsite .sec01 .btn-area a:nth-child(1){
  color: #fff;
  background-color: #4541FF;
}
#textsite .sec01 .btn-area a:nth-child(2){
  color: #4541FF;
  background-color: #fff;
  border: 1px solid #4541FF;
}

#textsite .sec01 .sec01-img {display: inline-block; max-width: 1200px; margin: 0 auto;}
#textsite .sec01 .sec01-img img {width: 100%; display: block;}

#textsite #sec02 { background-color: #fff;}
#textsite .sec02 {padding: 200px 0 100px;}
#textsite .sec02 .tit-area { margin-bottom: 52px;}
#textsite .sec02 .tit-area p{
  color: #518CFF;
  font-size: 22px;
  font-weight: 700;
  line-height: 28.8px;
  margin-bottom: 16px;
}
#textsite .sec02 .tit-area h1 {
  font-size: 52px;
  font-weight: 800;
  line-height: 62.4px;
  color: #333;
}

#textsite .sec02 .box-area01{
  width: 100%;
  height: 495px;
  padding: 45px 133px 45px 40px;
  border-radius: 20px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  background: linear-gradient(136deg, #D4E6FF 0%, #BEB8FE 100%);
}

#textsite .sec02 .box-area01 .txt-area h2{
  font-size: 36px;
  font-weight: 700;
  line-height: 43.2px;
  margin-bottom: 16px;
  color: #333333;
}
#textsite .sec02 .box-area01 .txt-area p{
  font-size: 18px;
  font-weight: 400;
  line-height: 28.8px;  
  color: #828282;
}
#textsite .sec02 .box-area01 .img-area {display: block; max-width: 325px;} 
#textsite .sec02 .box-area01 .img-area img {width: 100%; display: block;} 


#textsite #sec03 { background-color: #fff;}
#textsite .sec03 {padding: 100px 0 200px;}
#textsite .sec03 .tit-area { margin-bottom: 52px;}
#textsite .sec03 .tit-area p{
  color: #518CFF;
  font-size: 22px;
  font-weight: 700;
  line-height: 28.8px;
  
  margin-bottom: 16px;
}
#textsite .sec03 .tit-area h1 {
  font-size: 52px;
  font-weight: 800;
  line-height: 62.4px;
  color: #333;
}

#textsite .sec03 .box-area01{
  width: 100%;
  height: 495px;
  padding: 75px 61px 75px 40px;
  border-radius: 20px;
  display: flex;
  justify-content: space-between;
  gap: 75px;
  align-items: center;
  background: linear-gradient(211deg, #B2DAFF 0%, #E6F0FF 100%);
}

#textsite .sec03 .box-area01 .txt-area h2{
  font-size: 36px;
  font-weight: 700;
  line-height: 43.2px;
  margin-bottom: 16px;
  color: #333333;
}
#textsite .sec03 .box-area01 .txt-area p{
  font-size: 18px;
  font-weight: 400;
  line-height: 28.8px;  
  color: #828282;
}
#textsite .sec03 .box-area01 .img-area {display: block; max-width: 610px;} 
#textsite .sec03 .box-area01 .img-area img {width: 100%; display: block;} 

#automation #sec01 {
  background: radial-gradient(53.11% 53.11% at 81.88% 91.09%, rgba(176, 227, 255, 0.40) 0%, rgba(176, 227, 255, 0.00) 100%), radial-gradient(59.22% 38.63% at 27.40% 38.18%, rgba(69, 65, 255, 0.20) 0%, rgba(69, 65, 255, 0.00) 100%);
}
#automation .sec01 {padding: 160px 0 100px; text-align: center;}
#automation .sec01 .tit-area { margin-bottom: 52px; text-align: center;}
#automation .sec01 .tit-area .icon {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 6px;
  width: 172px;
  padding: 4px 0;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 16px;
  border-radius: 4px;
  background-color: #E6F0FF;
  color: #4541FF;
  font-size: 22px;
  font-weight: 700;
  line-height:  28.6px;
  
}
#automation .sec01 .tit-area .icon img {width: 24px; display: block;}

#automation .sec01 .tit-area h1 {
  font-size: 52px;
  font-weight: 800;
  line-height: 62.4px;
  color: #333;
  margin-bottom: 16px;
}
#automation .sec01 .tit-area p{
  color: #828282;
  font-size: 18px;
  font-weight: 400;
  line-height: 28.8px;
  
}
#automation .sec01 .btn-area {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 16px;
  margin-bottom: 52px;
}
#automation .sec01 .btn-area a{
  font-size: 16px;
  font-weight: 800;
  line-height: normal;
  
  padding: 16px 32px;
  border-radius: 100px;
}
#automation .sec01 .btn-area a:nth-child(1){
  color: #fff;
  background-color: #4541FF;
}
#automation .sec01 .btn-area a:nth-child(2){
  color: #4541FF;
  background-color: #fff;
  border: 1px solid #4541FF;
}

#automation .sec01 .sec01-img {display: inline-block; max-width: 1200px; margin: 0 auto;}
#automation .sec01 .sec01-img img {width: 100%; display: block;}

#automation #sec02 { background-color: #fff;}
#automation .sec02 {padding: 200px 0 100px;}
#automation .sec02 .tit-area { margin-bottom: 52px;}
#automation .sec02 .tit-area p{
  color: #858BFF;
  font-size: 22px;
  font-weight: 700;
  line-height: 28.8px;
  margin-bottom: 16px;
}
#automation .sec02 .tit-area h1 {
  font-size: 52px;
  font-weight: 800;
  line-height: 62.4px;
  color: #333;
}

#automation .sec02 .box-area01{
  width: 100%;
  height: 359px;
  padding: 80px 80px 80px 40px;
  border-radius: 20px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  background: linear-gradient(136deg, #D4E6FF 0%, #BEB8FE 100%);
}

#automation .sec02 .box-area01 .txt-area h2{
  font-size: 36px;
  font-weight: 700;
  line-height: 43.2px;
  margin-bottom: 16px;
  color: #333333;
}
#automation .sec02 .box-area01 .txt-area p{
  font-size: 18px;
  font-weight: 400;
  line-height: 28.8px;  
  color: #828282;
}
#automation .sec02 .box-area01 .img-area {display: block; max-width: 540px;} 
#automation .sec02 .box-area01 .img-area img {width: 100%; display: block;} 


#automation #sec03 { background-color: #fff;}
#automation .sec03 {padding: 100px 0 200px;}
#automation .sec03 .tit-area { margin-bottom: 52px;}
#automation .sec03 .tit-area p{
  color: #518CFF;
  font-size: 22px;
  font-weight: 700;
  line-height: 28.8px;
  margin-bottom: 16px;
}
#automation .sec03 .tit-area h1 {
  font-size: 52px;
  font-weight: 800;
  line-height: 62.4px;
  color: #333;
}

#automation .sec03 .box-area01{
  width: 100%;
  height: 495px;
  padding: 45px 28px 45px 40px;
  border-radius: 20px;
  display: flex;
  justify-content: space-between;
  gap: 75px;
  align-items: center;
  background: linear-gradient(211deg, #B2DAFF 0%, #E6F0FF 100%);
}

#automation .sec03 .box-area01 .txt-area h2{
  font-size: 36px;
  font-weight: 700;
  line-height: 43.2px;
  margin-bottom: 16px;
  color: #333333;
}
#automation .sec03 .box-area01 .txt-area p{
  font-size: 18px;
  font-weight: 400;
  line-height: 28.8px;  
  color: #828282;
}
#automation .sec03 .box-area01 .img-area {display: block; max-width: 610px;} 
#automation .sec03 .box-area01 .img-area img {width: 100%; display: block;} 

#guide1 #sec01 {
  background: radial-gradient(66.36% 40.53% at 64.92% 74.17%, rgba(176, 227, 255, 0.60) 0%, rgba(146, 216, 255, 0.00) 100%), radial-gradient(66.65% 66.06% at 22.06% 53.2%, rgba(156, 196, 255, 0.60) 0%, rgba(230, 240, 255, 0.00) 100%), radial-gradient(96.51% 81.59% at 81.8% 18.16%, rgba(69, 65, 255, 0.20) 0%, rgba(249, 249, 249, 0.00) 100%);
}

#guide1 .sec01 {
  padding: 160px 0 100px;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
}

#guide1 .sec01 .tit-area {
  display: flex;
  justify-content: center;
  align-items: center;
  margin-bottom: 36px;
}
#guide1 .sec01 .tit-area .tit {
  font-size: 52px;
  font-style: normal;
  font-weight: 800;
  line-height: 120%; /* 62.4px */
  letter-spacing: -0.3px;
  color: #1A1A1A;
}

#guide1 .sec01 .search-area {margin-bottom: 30px;}
#guide1 .sec01 .search-area .search {
  position: relative;
}
#guide1 .sec01 .search-area .search .icon {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  left: 15px;
}

#autocomplete {
  width: 680px;
  border-radius: 14px;
  box-shadow: 0 1px 2px var(--bg-black-lighter),inset 0 0 0 1px var(--bg-black-dark);
  border: none;
  outline: none;
  font-size: 16px;
  font-weight: 400;
  line-height: 25.6px;
  letter-spacing: -0.3px;
}

#guide1 .sec01 .search-area .search .input:focus {
  box-shadow: 0px 0px 0px 1px #4541FF inset, 0px 0px 0px 3px rgba(69, 65, 255, 0.30);
}

#guide1 .sec01 .search-area .search .input::placeholder {
  font-size: 16px;
  font-weight: 400;
  line-height: 25.6px;
  letter-spacing: -0.3px;
  color: var(--gray-04, #828282);
}
#guide1 .sec01 .menu-recommend {display: none;}
#guide1 .sec01 .menu-area {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
  gap: 24px;
  max-width: 1200px;
}
#guide1 .sec01 .menu-area .menu {
  width: 384px;
  background-color: #fff;
  padding: 16px 22px;
  border-radius: 100px;
  background: var(--white, #FFF);
  box-shadow: 0px 0px 2px 0px rgba(255, 255, 255, 0.12) inset, 0px 2px 6px 0px rgba(0, 0, 0, 0.08), 0px 0px 2px 1px rgba(0, 0, 0, 0.05);
  display: flex;
  align-items: center;
  gap: 14px;
  font-size: 22px;
  font-weight: 700;
  line-height: 130%; /* 28.6px */
  letter-spacing: -0.3px;
  color: #1A1A1A;
}

#guide1 .sec01 .menu-area .menu .icon {
  width: 46px;
  height: 46px;
  border-radius: 12px;
  display: flex;
  justify-content: center;
  align-items: center;
  background: rgba(69, 65, 255, 0.10);
}
#guide1 .sec02 {padding: 100px 0;}
#guide1 .sec02 .tit-area {margin-bottom: 20px;}
#guide1 .sec02 .tit-area .tit {
  font-size: 36px;
  font-weight: 700;
  line-height: 43.2px;
  letter-spacing: -0.3px;
  color: #1A1A1A;
}

#guide1 .sec02 .card-area {
  display: flex;
  gap: 20px; 
}
#guide1 .sec02 .card-area .card {
  width: 590px;
  height: 340px;
  border-radius: 20px;
  overflow: hidden;
}
#guide1 .sec02 .card-area .card1 {
  background-color: #E0E0E0;
  position: relative;
}

#guide1 .sec02 .card-area .card1 iframe{
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}


#guide1 .sec02 .card-area .card2 {
  padding: 58px 24px;
  background-color: rgba(69, 65, 255, 0.05);
}

#guide1 .sec02 .card-area .card2 .icon {display: inline-block; width: 60px; margin-bottom: 24px;}
#guide1 .sec02 .card-area .card2 .icon img {width: 100%; display: block;}

#guide1 .sec02 .card-area .card2 .tit-area {margin-bottom: 24px;}
#guide1 .sec02 .card-area .card2 .tit-area .m-tit{
  font-size: 36px;
  font-style: normal;
  font-weight: 700;
  line-height: 43px;
  letter-spacing: -0.3px;
  color: #333;
  margin-bottom: 8px;
}
#guide1 .sec02 .card-area .card2 .tit-area .s-tit{
  font-size: 18px;
  font-style: normal;
  font-weight: 400;
  line-height: 28px;
  letter-spacing: -0.3px;
  color: #828282;
}

#guide1 .sec02 .card-area .card2 a {
  width: 118px;
  height: 36px;
  padding: 9px 14px;
  border-radius: 8px;
  background-color: rgba(69, 65, 255, 0.10);
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 8px;
  font-size: 14px;
  font-weight: 700;
  line-height: 18px;
  color: #4541FF;
}

#guide1 .sec02 .card-area .card2 a .arrow {
  display: inline-block;
  width: 20px;
  height: 20px;
}
#guide1 .sec02 .card-area .card2 a .arrow img {width: 100%; display: block;}

#guide2 .tab-area { display: flex;}
#guide2 .tab-area .tab-menu {
  position: fixed;
  top: 0;
  left:0;
  z-index: 998;
  padding-top: 60px;
  flex-shrink: 0;
  width: 270px;
  height: 100vh;
  max-height: 100%;
  overflow-y: auto;
  border-right: 1px solid rgba(69, 65, 255, 0.10);
  background-color: rgba(69, 65, 255, 0.03);
}
#guide2 .tab-area .tab-menu ul {list-style: none;}
#guide2 .tab-area .tab-menu li {list-style: none;}
#guide2 .tab-area .tab-menu ul {padding: 16px 12px 0 12px;}
#guide2 .tab-area .tab-menu ul li {margin-bottom: 1px;}
#guide2 .tab-area .tab-menu > ul > li > a {
  font-size: 16px;
  font-weight: 400;
  line-height: 25.6px;
  letter-spacing: -0.3px;
  color: #333;
  position: relative;
  display: flex;
  align-items: center; 
  width: 100%;
  border-radius: 8px;
  padding: 9px 6px;
  cursor: pointer;
}
#guide2 .tab-area .tab-menu > ul > li > a:hover {
  background-color: #0000000D; 
}

#guide2 .tab-area .tab-menu > ul > li > a.active {
  background: rgba(94, 86, 240, 0.10);
  color: #4541FF;
}

#guide2 .tab-area .tab-menu > ul li > a span {
  width: 20px;
  height: 20px;
  transition: 0.3s;
  margin-right: 8px;
}

#guide2 .tab-menu li a span img {
  filter: invert(29%) sepia(8%) saturate(24%) hue-rotate(341deg) brightness(93%) contrast(82%);
}

#guide2 .tab-menu ul ul li a span img {
  display: inline-block;
}

#guide2 .tab-menu li a.active span img {
  filter: invert(51%) sepia(99%) saturate(7059%) hue-rotate(239deg) brightness(99%) contrast(104%);
}
#guide2 .tab-menu li a.on span.angle > img {
  transform: rotate(90deg);
}
#guide2 .tab-area .tab-menu > ul ul {
  display: none;
  padding: 8px 0;
}
#guide2 .tab-area .tab-menu > ul ul li a {
  display: inline-block;
  font-size: 16px;
  font-weight: 400;
  line-height: 20px;
  letter-spacing: -0.3px;
  color: #333;
  cursor: pointer;
  width: 100%;
  padding: 7px 24px;
  border-radius: 8px;
}
#guide2 .tab-area .tab-menu > ul ul li a.active {
  background: rgba(94, 86, 240, 0.10);
  color: #4541FF;
}

#guide2 .tab-area .tab-menu > ul ul li a:hover  {background-color: #0000000D; }

#guide2 .tab-area .tab-menu > ul ul ul li {margin-bottom: 1px; margin-left: 20px;}

#guide2 .tab-body {
  width: 100%;
  padding: 50px 293px 100px 300px;
}
#guide2 .tab-body .search-area {
  display: none;
}
#guide2 .tab-body .no-menu {
  padding: 100px 0;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;  
}
#guide2 .tab-body .no-menu .icon{
  display: inline-block;
  width: 500px;
  margin-bottom: 42px;
}
#guide2 .tab-body .no-menu .icon img {
  width: 100%;
  display: block;
}

#guide2 .tab-body .no-menu p {
  font-size: 52px;
  font-weight: 800;
  line-height: 62.4px;
  letter-spacing: -0.3px;
  color: #4F4F4F;
  margin-bottom: 16px;
}
#blog .sec02 .tab-contents .no-menu span {
  font-size: 18px;
  font-weight: 400;
  line-height: 28.8px;
  letter-spacing: -0.3px;
  color: #828282;
}

#guide2 .tab-body .menu{
  display: block;
}
#guide2 .tab-body .img-area {
  width: 100%;
  height: 400px;
  border-radius: 20px;
  border: 1px solid rgba(0, 0, 0, 0.03);
  background: var(--gray-02, #E0E0E0);
  margin-bottom: 42px;
}
#guide2 .tab-body .txt-area {
  margin-bottom: 50px;
}
#guide2 .tab-body .txt-area .c-tit {
  font-size: 22px;
  font-weight: 700;
  line-height: 28.6px;
  letter-spacing: -0.3px; 
  color: #4541FF;
  margin-bottom: 16px;
}
#guide2 .tab-body .txt-area .m-tit {
  font-size: 52px;
  font-style: normal;
  font-weight: 800;
  line-height: 62.4px;
  letter-spacing: -0.3px;
  color: #333;
  margin-bottom: 16px;
}

#guide2 .tab-body .txt-area .s-tit {
  font-size: 18px;
  font-weight: 400;
  line-height: 28.8px;
  letter-spacing: -0.3px;
}

#blog #sec01{
  background: url('../img/blog-sec02-background.png') no-repeat center  center;
  background-size: cover;
}

#blog .sec01 {padding: 160px 0 100px;}
#blog .sec01 .tit {
  text-align: center;
  font-size: 36px;
  font-weight: 700;
  line-height: 43px;
  letter-spacing: -0.3px;
  color: #fff;
}

#blog .sec02 {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  padding-bottom: 100px;
}
#blog .sec02 .tab-remote {
  padding: 20px 0;
  display: flex;
  gap: 20px;
}
#blog .sec02 .tab-remote span {
  color: #828282;
  font-size: 20px;
  font-weight: 400;
  line-height: 28px;
  letter-spacing: -0.3px;
  cursor: pointer;
  position: relative;
}
#blog .sec02 .tab-remote span::after {
  content: '';
  position: absolute;
  bottom: -18px;
  left: 0;
  width: 0%;
  height: 3px;
  background-color: #333;
}

#blog .sec02 .tab-remote span.active {
  color: #333;
  font-weight: 700;
}

#blog .sec02 .tab-remote span.active::after {
  width: 100%;
}

#blog .sec02 .tab-contents {}
#blog .sec02 .tab-contents .no-menu {
  padding: 100px 0;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;  
}
#blog .sec02 .tab-contents .no-menu .icon{
  display: inline-block;
  width: 500px;
  margin-bottom: 42px;
}
#blog .sec02 .tab-contents .no-menu .icon img {
  width: 100%;
  display: block;
}

#blog .sec02 .tab-contents .no-menu p {
  font-size: 52px;
  font-weight: 800;
  line-height: 62.4px;
  letter-spacing: -0.3px;
  color: #4F4F4F;
  margin-bottom: 16px;
}
#blog .sec02 .tab-contents .no-menu span {
  font-size: 18px;
  font-weight: 400;
  line-height: 28.8px;
  letter-spacing: -0.3px;
  color: #828282;
}


#blog .sec02 .tab-contents .menu {
  display: none;
}
#blog .sec02 .tab-contents .menu.active {
  display: block;
}
#blog .sec02 .tab-contents .menu .card-box {
  display: flex;
  flex-wrap: wrap;
  gap: 24px;
}
#blog .sec02 .tab-contents .menu .card-box .card {
  width: 384px;
  border-radius: 6px;
  border: 1px solid var(--solapi-blue-10, rgba(69, 65, 255, 0.10));
}
#blog .sec02 .tab-contents .menu .card-box .card .card-img {
  height: 200px;
  background-color: #e0e0e0;
  border-radius: 8px 8px 0px 0px;
}
#blog .sec02 .tab-contents .menu .card-box .card .tit-area {
  padding: 13px 16px;
}
#blog .sec02 .tab-contents .menu .card-box .card .tit-area .m-tit {
  color: #333;
  font-size: 22px;
  font-style: normal;
  font-weight: 700;
  line-height: 28.6px;
  letter-spacing: -0.3px;
  margin-bottom: 13px;
  text-overflow: ellipsis;
  overflow: hidden;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}tab-body
#blog .sec02 .tab-contents .menu .card-box .card .tit-area .s-tit {
  font-size: 18px;
  font-weight: 400;
  line-height: 28px;
  letter-spacing: -0.3px;
  margin-bottom: 13px;
  text-overflow: ellipsis;
  overflow: hidden;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}
#blog .sec02 .tab-contents .menu .card-box .card .tit-area .date {
  color: #828282;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: 25.6px;
  letter-spacing: -0.3px;
}


/* 고스트 코드충돌 */

.inner.posts {
  padding: 0px !important;
}

.post-feed {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 24px !important;
}

.post-card-title {
  font-size: 22px !important;
  line-height: 28.6px !important;
  text-overflow: ellipsis !important;
  overflow: hidden !important;
  display: -webkit-box !important;
  -webkit-box-orient: vertical !important;
  -webkit-line-clamp: 2 !important;
}

.post-card-excerpt {
  font-size: 18px !important;
  line-height: 28.8px !important;
  letter-spacing: -0.3px !important;
}

.post-card-meta {
  font-size: 16px !important;
}
.post-card-image-link {
  height: 200px !important;
  margin-bottom: 0px !important;
}
.post-card {
  width: 384px !important;
  height: 400px !important;
  border-radius: 8px !important;
  border: 1px solid rgba(69, 65, 255, 0.10) !important;
}

.post-card-content {
  padding: 13px 16px !important; 
}

.kg-image-card img {
  width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;
}

.article-title {
  font-size: 40px !important;
}
.article-byline-meta {
  font-size: 18px !important;
}
.gh-canvas, .kg-width-full.kg-content-wide {
  
  margin-top: 30px !important;
}
.gh-content>blockquote:not([class]), .gh-content>dl, .gh-content>ol, .gh-content>p, .gh-content>ul {
  font-family: 'Pretendard' !important;
  font-size: 20px !important;
  line-height: 1.5 !important;
}
.gh-content > blockquote:not([class]), .gh-content > dl, .gh-content > ol, .gh-content > p, .gh-content > ul {
  font-family: 'Pretendard' !important;
}

.outer {
  padding:  0 !important;
}
.gh-sidebar {
  width: 400px !important;
  right: 80px !important;
  grid-column: none !important;
}
.gh-toc {
  top: 100px !important; 
}

.toc-list {
  padding-left: 20px !important;
  font-size: 15px !important;
}

#page-content p { font-size: 18px !important; line-height: 1.5;}
.gh-canvas .article-image {
  grid-column: main-start/main-end !important;
  margin: 0 0 30px !important;
}

.aa-Item {
  list-style: none;
  padding: 10px !important;
  margin-bottom: 10px !important;
  border-radius: 10px !important;
}
.aa-Item:hover {
  background: rgba(94, 86, 240, 0.10) !important;
}
.aa-Item a {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;  
}
.aa-Item a .search-content {
  flex: 7;
}
.aa-Item a .search-content .title{
  font-size: 15px !important;
  margin-bottom: 5px !important;
  font-weight: 700 !important;
}
.aa-Item a .search-content .exceprt{
  font-size: 14px !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  display: -webkit-box !important;
  -webkit-line-clamp: 3 !important;
  -webkit-box-orient: vertical !important;
}
.aa-Item a .feature_image {
  flex: 3;
}
.aa-Item a .feature_image img {
  width: 100%;
  display: block;
}
.gh-content table:not(.gist table) {
  background: none;
  font-size: 15px !important;
  line-height: 24px !important;
  text-wrap: auto;
  word-break: keep-all;
}
.gh-content table:not(.gist table) td, .gh-content table:not(.gist table) th {
  border: 1px solid #dde2e6 !important;
}
.gh-content table:not(.gist table) td {
  padding: 16px !important;
  font-weight: 400 !important;
}
.gh-content table:not(.gist table) th {
  padding: 12px !important;
  font-size: 15px !important;
  background-color: #f0f2f5;
}
.byline-meta-date {
  margin-bottom: 30px !important;
}

/* 고스트 코드충돌 */

#sec00 .sec00 .gnb .service-area.support .service-box {
  width: 340px; /* 내용에 맞춰 폭 축소 */
  height: auto; /* 내용에 맞게 자동 높이 */
  gap: 20px; /* 칼럼 간격 */
  left: 50%;
  transform: translateX(-50%);
}
#sec00 .sec00 .gnb .service-area.support .service-box .left {
  width: 160px; /* 기본 폭 */
}
#sec00 .sec00 .gnb .service-area.support .service-box .left::after {
  display: none; /* 세로 구분선 제거 */
}
#sec00 .sec00 .gnb .service-area.support .service-box .left a {
  padding: 10px;
}

#blog .sec02 .search-area {
  margin: 20px 0;
}