@charset "utf-8";
@import url(swiper.min.css);

*{-webkit-text-size-adjust:none;-moz-text-size-adjust:none;-ms-text-size-adjustbox-sizing:none;box-sizing:border-box}
.card-list-box a{text-decoration:none}

em{font-style:normal}

button, input[type='button'], input[type='submit'], input[type='reset']{cursor:pointer;border-radius:0;-webkit-border-radius:0;-webkit-appearance:none;border:0;vertical-align:middle;background:none}

/*layout*/
.wrap.scrolled header{position:fixed;top:0}
.wrap.scrolled.down header{margin-top:-120px}
.wrap.scrolled.down header.open,.wrap.scrolled.down header.depth2-open{margin-top:-158px}

.service_plan{padding:30px 0;overflow:hidden}
.service_plan .inner{position:relative}

.service_plan .inner.fixed .card-list-box .card-menu{position:fixed;left:calc((100% - 1440px)/2);top:120px}
.service_plan .inner.fixed .card-list-box .card-menu{top:406px}


/* .service_plan .inner.fixed.over .card-list-box .card-menu{position:absolute;left:0;top:auto;bottom:0} */
.service_plan .card-list-box{padding-left:400px}
.service_plan .swiper-container{overflow:visible}
.service_plan .btn-box{margin:0}

/* .card-list-box{padding-bottom:20px} */
.card-list-box .card-menu{position:absolute;left:0;top:286px}
.card-list-box .card-menu>li>a{position:relative;display:inline-block;padding:14px 0;font-size:20px;line-height:1;font-weight:700;color:#121212}
.card-list-box .card-menu>li.on>a,
.card-list-box .card-menu>li>a:hover,
.card-list-box .card-menu>li>a:focus{padding-left:36px;color:#00c5a8}
.card-list-box .card-menu>li.on>a:before,
.card-list-box .card-menu>li>a:hover:before,
.card-list-box .card-menu>li>a:focus:before{content:'';display:block;position:absolute;left:0;top:50%;transform:translateY(-50%);width:20px;height:2px;background:#00c5a8}

.card-list{flex-wrap:wrap;margin:0 -30px;width:auto}
.card-list>div{width:50%;margin-bottom:50px}
/* .card-list>.swiper-slide:nth-child(1),
.card-list>.swiper-slide:nth-child(2){margin-top:0} */
.card-list .card-con-inner>a{height:540px;}
.card-list .card-con-inner:hover,
.card-list-box .card-con-inner:focus{transform:translateY(-14px);transition:all .3s ease}
.card-list .card-con .category{padding-bottom:10px}
.card-list .card-con .category:after{content:'';display:block;position:absolute;left:0;bottom:0;width:20px;height:2px}

.card-con-inner{position:relative;margin:0 30px;border-radius:12px}
.card-con-inner>a{overflow:hidden;display:block;padding:30px 20px;border-radius:12px}
.card-con-inner>a:hover,
.card-con-inner>a:focus{box-shadow:12px 12px 30px 0 rgba(0, 0, 0, .16)}
.card-con .category{display:block;position:relative;margin-bottom:18px;font-size:20px;line-height:1;font-weight:700}
.card-con .category>span{display:inline-block;height:20px;padding-left:7px;font-size:18px;font-weight:500;vertical-align:top}
.card-con .category>span:before{content:'';display:inline-block;width:1px;height:12px;margin-right:7px;background:#28a7e9;vertical-align:middle}
.card-con .title{display:block;overflow:hidden;text-overflow:ellipsis;-webkit-line-clamp:2;-webkit-box-orient:vertical;max-height:84px;font-size:28px;line-height:42px;color:#121212}
.card-con .text{display:-webkit-box;overflow:hidden;text-overflow:ellipsis;-webkit-line-clamp:11;-webkit-box-orient:vertical;margin-top:12px;font-size:16px;line-height:26px;color:#424645}

.card-con .btn-share{display:block;position:absolute;right:30px;top:57px;width:24px;height:24px;background:url(/images/sw_icon_white.png) no-repeat}
.card-con .content-sns-box{visibility:hidden;position:absolute;left:0;top:0;width:100%;height:100%;opacity:0;transition:all .5s ease-out}
.card-con .content-sns-box.show{visibility:visible;opacity:1}
.card-con .content-sns-box:before{content:'';display:block;position:absolute;left:0;top:0;width:100%;height:100%;background:rgba(0,0,0,.7)}
.card-con .content-sns-box>button{display:block;position:absolute;right:19px;top:45px;width:48px;height:48px;background:#28a7e9;border-radius:50%}
.card-con .content-sns-box>button:before{content:'';position:absolute;left:50%;top:50%;transform:translate(-50%,-50%) rotate(-45deg);width:14px;height:2px;background:#fff}
.card-con .content-sns-box>button:after{content:'';position:absolute;left:50%;top:50%;transform:translate(-50%,-50%) rotate(-45deg);width:2px;height:14px;background:#fff}
.card-con .content-sns-box .content-sns{margin:0;position:absolute;right:19px;top:109px}
.card-con .content-sns-box .content-sns>li{display:block;margin:0;opacity:0;transition:all .4s ease-out}
.card-con .content-sns-box .content-sns>li:nth-child(2){transform:translateY(-48px)}
.card-con .content-sns-box .content-sns>li:nth-child(3){transform:translateY(-96px)}
.card-con .content-sns-box .content-sns>li:nth-child(4){transform:translateY(-144px)}
.card-con .content-sns-box .content-sns>li:nth-child(5){transform:translateY(-192px)}
.card-con .content-sns-box.show .content-sns>li+li{margin-top:16px}
.card-con .content-sns-box.show .content-sns>li{opacity:1;transform:translateY(0) !important}

/*text type*/
.card-con.text-type .category,
.card-con.text-type .title,
.card-con.text-type .text{color:#fff}
.card-con.text-type .category:after{background:#fff}

.card-con .from-to .img{flex:0 1 auto;width:98px;margin:0 20px}/*height:98px;*/
.card-con .from-to .img img{width:100%}

.card-con .hash-tag-list{position:absolute;left:34px;bottom:64px;padding-right:40px;font-size:0}/*display:flex;flex-wrap:wrap;*/
.card-con .hash-tag-list>li{display:inline-block;min-width:96px;padding:0 6px;margin-top:16px;color:#fff;text-align:center;font-size:18px}/*display:inline-block;*/
.card-con .hash-tag-list>li>span{display:block;width:100%;height:100%;padding:11px 24px;border:1px solid rgba(255,255,255,.5);border-radius:50px}
/*image type*/
.card-con.image-type .card-con-inner>a{background:#f8f8f8}
.card-con.image-type .category{color:#28a7e9}
.card-con.image-type .category:after{background:#28a7e9}
.card-con.image-type .text{-webkit-line-clamp:10;height:150px}
.card-con.image-type .img{overflow:hidden;position:absolute;left:0;bottom:20px;width:100%;height:calc(100% - 351px);border-radius:0 0 12px 12px}
.card-con.image-type .img img{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%) scale(1);transition:all .3s ease;width:100%}
.card-con.image-type a:hover .img img{transform:translate(-50%,-50%) scale(1.1)}
.card-con.image-type .btn-share{background:url(/images/sw_icon_black.png) no-repeat}
/*image bg type*/
.card-con.image-bg-type .category,
.card-con.image-bg-type .text,
.card-con.image-bg-type .title{position:relative;z-index:3;color:#fff}
.card-con.image-bg-type .category:after{background:#fff}
.card-con.image-bg-type a{position:relative;z-index:3}
.card-con.image-bg-type .img{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:100%;height:100%}
.card-con.image-bg-type .img:before{content:'';display:block;position:absolute;left:0;top:0;width:100%;height:100%;background:rgba(0,0,0,.5);border-radius:12px;z-index:2}
.card-con.image-bg-type .img img{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%) scale(1);width:100%;height:100%;transition:all .3s ease}
.card-con.image-bg-type a:hover .img img{transform:translate(-50%,-50%) scale(1.1)}
.card-con.image-bg-type .btn-share{z-index:3}
.card-con.image-bg-type .content-sns-box{z-index:3}
.card-con.image-bg-type .content-sns-box.show ~ .img:before{display:none}


.swiper-button-box{display:flex;justify-content:flex-end;align-items:center;position:absolute;left:50%;top:0;transform:translateX(-50%);width:1440px;z-index:1}
.swiper-button-box .paging{position:relative;display:flex;height:20px;line-height:20px;padding-right:92px;margin-right:32px;font-size:18px;color:#28a7e9}
.swiper-button-box .paging:after{content:'';display:block;position:absolute;right:0;top:50%;width:60px;height:1px;background:#28a7e9}
.swiper-button-box .paging.swiper-pagination-fraction{width:auto;bottom:0}
.swiper-button-box .swiper-pagination-current{padding-right:13px;font-size:22px;font-weight:700}
.swiper-button-box .swiper-pagination-total{padding-left:12px}
.swiper-button{position:relative;display:block;width:40px;height:40px;text-align:center;margin-top:0}
.swiper-button-next{right:0;margin-left:22px;margin-right:-10px;background-image:none}
.swiper-button-prev{left:0;background-image:none}
.swiper-button:before{content:'';display:block;position:absolute;left:50%;top:50%;width:10px;height:10px;border:2px solid #28a7e9;border-left:0;border-top:0;transform-origin:50% 50%}
.swiper-button-prev:before{transform:translate(-50%,-50%) rotate(-225deg)}
.swiper-button-next:before{transform:translate(-50%,-50%) rotate(315deg)}
/* .swiper-button.swiper-button-prev:after,
.swiper-button.swiper-button-next:after{content:''} */
.swiper-button-box .progress{display:none}
.swiper-button-box .progress span{transition:width .4s ease-out}

.card-list-con{margin-top:50px}
.card-list-con .swiper-container{overflow:visible;margin-top:-60px}
.card-list-con .card-list>div{width:448px}
.card-list-con .card-con{margin-bottom:0;margin-top:60px}
.card-list-con .card-con-inner{margin:0 14px}
.card-list-con .card-list{width:auto;margin:0 -14px}
.card-list-con>.con-title4{display:block;margin-bottom:40px}



@media screen and (max-width:1920px){
	.wrap.scrolled.down header{margin-top:-120px;margin-top:calc(-100vw * 0.0625)}
	.wrap.scrolled.down header.open,
	.wrap.scrolled.down header.depth2-open{margin-top:-158px;margin-top:calc(-100vw * 0.082292)}
}

@media screen and (max-width:1440px){
  .service_plan{ /*padding:240px 0;padding:16.6667vw 0*/}
  .service_plan .inner{padding-right:60px;padding-right:4.1667vw}


  .service_plan .inner.fixed .card-list-box .card-menu{left:60px;left:4.1667vw;top:120px;top:6.25vw}
  .service_plan .inner.fixed .card-list-box .card-menu{top:406px;top:28.1944vw}

  .service_plan .card-list-box{padding-left:537px;padding-left:25vw}

  /* .card-list-box{padding-bottom:20px;padding-bottom:1.3889vw} */
  .card-list-box .card-menu{top:286px;top:19.8611vw}
  .card-list-box .card-menu>li>a{padding:14px 0;padding:.9722vw 0;font-size:20px;font-size:1.3889vw}
  .card-list-box .card-menu>li.on>a,
  .card-list-box .card-menu>li>a:hover,
  .card-list-box .card-menu>li>a:focus{padding-left:36px;padding-left:2.5vw}
  .card-list-box .card-menu>li.on>a:before,
  .card-list-box .card-menu>li>a:hover:before,
  .card-list-box .card-menu>li>a:focus:before{width:20px;width:1.3889vw;height:2px;height:.1389vw}

  .card-list{margin:0 -30px;margin:0 -2.0833vw}
  .card-list>div{margin-bottom:50px;margin-bottom:5.5556vw}
  .card-list .card-con-inner>a{height:540px;height:37.5vw}
  .card-list .card-con-inner:hover,
  .card-list-box .card-con-inner:focus{transform:translateY(calc(-100vw * 0.009722))}
  .card-list .card-con .category{padding-bottom:10px;padding-bottom:.6944vw}
  .card-list .card-con .category:after{width:20px;width:1.3889vw;height:2px;height:.1389vw}

  .card-con-inner{margin:0 30px;margin:0 2.0833vw;border-radius:12px;border-radius:.8333vw}
  .card-con-inner>a{padding:52px 40px;padding:3.6111vw 2.7778vw;border-radius:.8333vw}
  .card-con-inner>a:hover,
  .card-con-inner>a:focus{box-shadow:12px 12px 30px 0 rgba(0, 0, 0, .16);box-shadow:.8333vw .8333vw 2.0833vw 0 rgba(0, 0, 0, .16)}
  .card-con .category{margin-bottom:20px;margin-bottom:1.5vw;font-size:20px;font-size:1.3889vw}
  .card-con .category>span{height:20px;height:1.3889vw;padding-left:7px;padding-left:.4861vw;font-size:18px;font-size:1.25vw}
  .card-con .category>span:before{width:1px;height:12px;height:.8333vw;margin-right:7px;margin-right:.4861vw}
  .card-con .title{max-height:84px;max-height:5.8333vw;font-size:28px;font-size:1.9444vw;line-height:42px;line-height:2.9167vw}
  .card-con .text{height:20vw;margin-top:5px;margin-top:1.1111vw;font-size:16px;font-size:1vw;line-height:26px;line-height:1.8056vw}

  .card-con .btn-share{right:30px;right:2.0833vw;top:57px;top:3.9583vw;width:24px;width:1.6667vw;height:24px;height:1.6667vw}
  .card-con .content-sns-box>button{right:19px;right:1.3194vw;top:45px;top:3.1250vw;width:48px;width:3.3333vw;height:48px;height:3.3333vw}
  .card-con .content-sns-box>button:before{width:14px;width:.9722vw;height:2px;height:.1389vw}
  .card-con .content-sns-box>button:after{width:2px;width:.1389vw;height:14px;height:.9722vw}
  .card-con .content-sns-box .content-sns{right:19px;right:1.3194vw;top:109px;top:7.5694vw}
  .card-con .content-sns-box .content-sns>li:nth-child(2){transform:translateY(-3.3333vw)}
  .card-con .content-sns-box .content-sns>li:nth-child(3){transform:translateY(-6.6667vw)}
  .card-con .content-sns-box .content-sns>li:nth-child(4){transform:translateY(-10vw)}
  .card-con .content-sns-box .content-sns>li:nth-child(5){transform:translateY(-13.3333vw)}
  .card-con .content-sns-box.show .content-sns>li+li{margin-top:16px;margin-top:1.1111vw}
  /*text type*/
  .card-con .from-to{margin-top:49px;margin-top:3.4028vw}
  .card-con .from-to>span{font-size:20px;font-size:1.3889vw}
  .card-con .from-to .img{width:98px;width:6.8056vw;margin:0 20px;margin:0 1.3889vw}/*height:98px;height:6.8056vw;*/
  .card-con .hash-tag-list{left:34px;left:2.3611vw;bottom:64px;bottom:4.4444vw;padding-right:40px;padding-right:2.7778vw}
  .card-con .hash-tag-list>li{min-width:96px;min-width:6.6667vw;padding:0 6px;padding:0 .4167vw;margin-top:16px;margin-top:1.1111vw;font-size:18px;font-size:1.25vw}
  .card-con .hash-tag-list>li>span{padding:11px 24px;padding:.7639vw 1.6667vw;border-radius:50px;border-radius:3.4722vw}
  /*image type*/
  .card-con.image-type .text{height:14vw}
  .card-con.image-type .img{height:calc(100% - 351px);border-radius:0 0 .8333vw .8333vw}
  .card-con.image-type .img img{height:100%}
  .card-con.image-type .btn-share{background-size:24px auto;background-size:1.6667vw auto}


  .swiper-button-box{width:1440px;width:100vw}
  .swiper-button-box .paging{height:20px;height:1.3889vw;line-height:20px;line-height:1.3889vw;padding-right:92px;padding-right:6.3889vw;margin-right:32px;margin-right:2.2222vw;font-size:18px;font-size:1.25vw}
  .swiper-button-box .paging:after{width:60px;width:4.1667vw}
  .swiper-button-box .swiper-pagination-current{padding-right:13px;padding-right:.9028vw;font-size:22px;font-size:1.5278vw}
  .swiper-button-box .swiper-pagination-total{padding-left:12px;padding-left:.8333vw}
  .swiper-button{width:40px;width:2.7778vw;height:40px;height:2.7778vw}
  .swiper-button-next{margin-left:22px;margin-left:1.5278vw;margin-right:-10px;margin-right:.6944vw}
  .swiper-button:before{width:10px;width:.6944vw;height:10px;height:.6944vw;border-width:2px;border-width:.1389vw}
}

/*mobile*/
@media screen and (max-width:767px){
  .service_plan .inner{padding:0}
  .service_plan .card-list-box{padding-left:0}
  .service_plan .swiper-container{overflow:hidden;margin-top:41px;margin-left:24px;}
  .service_plan .swiper-button-box{padding-top:16px;}/*margin-left:-24px;margin-left:-6.6667vw*/
  .service_plan .btn-box{margin-top:40px;}

  .card-list-box{padding-bottom:0}
  .card-list-box .card-menu,
  .service_plan .inner.fixed .card-list-box .card-menu,
  .service_plan .inner.fixed.over .card-list-box .card-menu{overflow-y:hidden;overflow-x:scroll;display:flex;position:relative;left:auto;top:auto;margin:28px 0 41px 32px;padding-right:32px;}
  .card-list-box .card-menu>li{flex:0 0 auto}
  .card-list-box .card-menu>li+li{margin-left:32px;}
  .card-list-box .card-menu>li>a{display:inline-block;padding:14px 0;font-size:20px;}
  .card-list-box .card-menu>li.on>a,
  .card-list-box .card-menu>li>a:hover,
  .card-list-box .card-menu>li>a:focus{padding-left:30px;}
  .card-list-box .card-menu>li.on>a:before,
  .card-list-box .card-menu>li>a:hover:before,
  .card-list-box .card-menu>li>a:focus:before{width:20px;height:2px;}

  .card-list{flex-wrap:nowrap;margin:0;width:auto}
  .card-list>div{width:296px;margin-bottom:0}
  .card-list .card-con-inner>a{height:428px;}
  .card-list .card-con-inner:hover,
  .card-list .card-con-inner:focus{transform:none;transition:none}
  .card-list .card-con-inner>a:hover,
  .card-list .card-con-inner>a:focus{transform:none;box-shadow:none;transition:none}
  .card-list .card-con .category{padding-bottom:10px;}
  .card-list .card-con .category:after{width:20px;height:2px;}

  .card-con-inner{margin:0;border-radius:12px;}
  .card-con-inner>a{display:block;padding:37px 30px;border-radius:12px;}
  .card-con .category{display:block;position:relative;margin-bottom:10px;font-size:14px;}
  .card-con .category>span{height:14px;padding-left:7px;font-size:13px;}
  .card-con .category>span:before{width:1px;height:10px;margin-right:7px;}
  .card-con .title{height:76px;max-height:100%;font-size:24px;line-height:38px;}
  .card-con .text{-webkit-line-clamp:20;height:150px;margin-top:5px;font-size:16px;line-height:26px;}
  .card-con .card-con-inner a>.img img{transition:none !important;transform:translate(-50%,-50%) !important;object-fit:cover;height:auto}

  .card-con .btn-share{right:28px;top:45px;width:24px;height:24px;background:url(/images/sw_icon_white.png) no-repeat;background-size:24px auto;}
  .card-con .content-sns-box>button{right:18px;top:45px;width:48px;height:48px;}
  .card-con .content-sns-box>button:before{width:14px;height:2px;}
  .card-con .content-sns-box>button:after{width:2px;height:14px;}
  .card-con .content-sns-box .content-sns{display:block;margin:0;right:18px;top:101px;}
  /* .card-con .content-sns-box .content-sns>li{display:block;margin:0} */
  .card-con .content-sns-box .content-sns>li:nth-child(2){transform:translateY(-48px);}
  .card-con .content-sns-box .content-sns>li:nth-child(3){transform:translateY(-96px);}
  .card-con .content-sns-box .content-sns>li:nth-child(4){transform:translateY(-144px);}
  .card-con .content-sns-box .content-sns>li:nth-child(5){transform:translateY(-192px);}
  .card-con .content-sns-box.show .content-sns>li+li{margin-top:8px;}
  /*text type*/
  .card-con .from-to{margin-top:28px;}
  .card-con .from-to>span{font-size:15px;white-space:nowrap}
  .card-con .from-to .img{width:98px;margin:0 16px;}/*height:98px;*/
  .card-con .hash-tag-list{left:24px;bottom:46px;padding:0}/*padding-right:30px;padding-right:8.3333vw*/
  .card-con .hash-tag-list>li{min-width:62px;padding:0 6px;margin-top:16px;font-size:13px;}
  .card-con .hash-tag-list>li>span{padding:8px 16px;border-radius:50px;}

  /*image type*/
  .card-con.image-type .text{height:150px;margin-top:5px}
  .card-con.image-type .img{height:calc(100% - 330px);border-radius:0 0 12px 12px}
  .card-con.image-type .btn-share{background:url(/images/sw_icon_black.png) no-repeat;background-size:24px auto;}
  /*image bg type*/
  .card-con.image-bg-type .title{white-space:normal;height:auto;max-height:84px;}
  .card-con.image-bg-type .img:before{border-radius:12px;}

  .swiper-button-box{display:flex;justify-content:flex-start;align-items:center;position:static;left:auto;top:auto;transform:none;width:auto;padding:40px 24px 0 0;}
  .swiper-button-box .paging{height:16px;line-height:16px;margin-right:0;padding-right:48px;font-size:12px;}
  .swiper-button-box .paging:after{display:none}
  .swiper-button-box .swiper-pagination-current{padding-right:12px;font-size:16px;}
  .swiper-button-box .swiper-pagination-total{padding-left:12px;}
  .swiper-button{position:absolute;top:50%;transform:translateY(-50%);display:block;width:24px;height:40px;background:rgba(0,0,0,.6);z-index:2}
  .swiper-button-prev{left:0;border-radius:0 4px 4px 0;}
  .swiper-button-next{right:0;margin:0;border-radius:4px 0 0 4px;}
  .swiper-button:before{width:14px;height:14px;border:2px solid #fff;border-left:0;border-top:0;opacity:1 !important}
  .swiper-button-prev:before{left:8px;transform:translate(0,-50%) rotate(-225deg)}
  .swiper-button-next:before{left:auto;right:8px;transform:translate(0,-50%) rotate(315deg)}
  .swiper-button-box .progress{display:block;width:100%;height:2px;background:#e9e9e9}
  .swiper-button-box .progress>span{display:inline-block;height:100%;background:#28a7e9;vertical-align:top}
}


.service_plan h2{position: absolute;left: 0px;top: 50px;;padding-bottom:0px;text-align:left;font-weight:bold;}
@media screen and (max-width:767px){
.service_plan h2{position:initial;display:block;}
}