@charset "utf-8";

/* shoping contents Style */
.con .outer.gray .inner{background-color:#f4f4f4}
.con .outer .inner .content{max-width:1200px;height:830px;margin:0 auto;border-radius:15px;background-color:#000}
.con .outer .inner h2{position:relative;display:inline-block;margin-top:60px;padding:0 0 9px 30px;border-bottom:2px solid #B50505;line-height:34px;font-size:24px;font-weight:700}
.con .outer .inner div.tit{margin:60px 0 50px;text-align:center;color:#fff;word-break:keep-all}
.con .outer .inner div.tit strong{display:block;line-height:36px;font-size:26px;font-weight:700}
.con .outer .inner div.tit .sub{display:inline-block;margin-top:20px;line-height:25px;font-size:18px;font-weight:400}
.con .outer .inner div.tit .point{color:#BF383E}
.con .outer .inner .content{position:relative}
.con .outer .inner .content .fixed_logo{position:absolute;top:50px;right:50px;width:60px;height:60px}
.con .outer .inner .content .fixed_logo a{display:inline-block;width:100%;height:100%;background:url(/info/shoping/pc_logo_witshop.png)no-repeat center/contain;text-indent:-9999px}
.con.intro .outer .inner .content{position:relative;background:url(/info/shoping/pc_intro_bg.png)no-repeat center/cover}
.con.intro .outer .inner .top{position:absolute;top:300px;left:50%;transform:translateX(-50%);text-align:center}
.con.intro .outer .inner .top span{line-height:28px;font-size:20px}
.con.intro .outer .inner .top h1{width:370px;margin:20px auto 30px}
.con.intro .outer .inner .top p{font-size:20px;font-weight:500}
.con.intro .outer .inner .bottom{position:absolute;bottom:30px;left:50%;transform:translateX(-50%);width:100%;padding:0 127px}
.con.intro .outer .inner .bottom ul{display:flex;justify-content:space-between}
.con.intro .outer .inner .bottom li{font-size:14px}
.con.intro .outer .inner .bottom li b{margin-right:10px;font-weight:700}
.con.feature_01 .outer .inner .content{background:url(/info/shoping/pc_feature_01_bg.png)no-repeat center/cover}
.con.feature_01 .outer .inner .img_con{position:relative;max-width:788px;margin:0 auto}
.con.feature_01 .outer .inner .img_con .txt .box{position:absolute;top:111px;text-align:center}
.con.feature_01 .outer .inner .img_con .txt .box p{margin-bottom:40px;line-height:39px;font-size:28px;font-weight:700}
.con.feature_01 .outer .inner .img_con .txt .box span{display:inline-block;line-height:22px;text-align:left;word-break:keep-all}
.con.feature_01 .outer .inner .img_con .txt .l{left:71px}
.con.feature_01 .outer .inner .img_con .txt .r{right:43px}
.con.feature_01 .outer .inner .img_con .txt .box.l span{width:263px}
.con.feature_01 .outer .inner .img_con .txt .box.r span{width:300px}
.con.feature_01 .outer .inner .img_con .txt .box.l p{margin-left:15px}
.con.feature_01 .outer .inner .img_con .txt .box.r p{margin-right:15px}
.con.feature_01 .outer .inner .img_con .txt .plus{position:absolute;top:50%;left:50%;width:25.65px;height:26.5px;background:url(/info/shoping/pc_ico_plus.png)no-repeat center/contain;transform:translate(-50%, -50%)}
.con.feature_01 .outer .inner .content>p{margin-top:40px;text-align:center;font-size:24px;font-weight:700}
.con.feature_01 .outer .inner .content>p .point{display:inline-block;margin-left:10px;color:#BF383E}
.con.feature_02 .outer .inner ul::after{content:'';display:block;clear:both}
.con.feature_02 .outer .inner ul li{float:left;width:25%;height:240px;padding:30px;text-align:center}
.con.feature_02 .outer .inner ul li:not(:nth-of-type(4n)){border-right:1px solid rgba(255,255,255,0.5)}
.con.feature_02 .outer .inner ul li:not(:nth-of-type(-n+4)){border-top:1px solid rgba(255,255,255,0.5)}
.con.feature_02 .outer .inner ul li p{margin:20px 5px;line-height:28px;font-size:20px;font-weight:700}
.con.feature_02 .outer .inner ul li .img{height:36px;line-height:36px}
.con.feature_02 .outer .inner ul li img{display:inline-block;width:auto}
.con.feature_02 .outer .inner ul li span{display:inline-block;font-size:18px;color:#999}
.con.feature_02 .outer .inner ul li span:nth-of-type(2){margin-left:20px}
.con.feature_03 .outer .inner ul{display:flex;justify-content:space-between;padding:0 145px;text-align:center}
.con.feature_03 .outer .inner li .img{position:relative;width:250px;height:250px}
.con.feature_03 .outer .inner li:not(:last-of-type) .img::after{content:'';position:absolute;top:50%;right:-80px;display:block;width:80px;height:5px;margin-top:-2.5px;background-color:#DDD}
.con.feature_03 .outer .inner li p{margin:25px 0 20px;line-height:28px;font-size:20px;font-weight:700;color:#DDD}
.con.feature_03 .outer .inner li span{font-size:16px;color:#999}
.con.feature_04 .outer .inner ul{display:flex;flex-wrap:wrap;justify-content:center;width:640px;margin:0 auto}
.con.feature_04 .outer .inner ul li{width:200px;height:225px;padding-top:35px;border-radius:10px;background-color:#2B2B2C;text-align:center}
.con.feature_04 .outer .inner ul li:not(:nth-of-type(3n)){margin-right:20px}
.con.feature_04 .outer .inner ul li:not(:nth-of-type(-n+3)){margin-top:20px}
.con.feature_04 .outer .inner ul li p{display:inline-block;padding-top:93px;line-height:25px;background:url(/info/shoping/pc_feature_04_ico01.png)no-repeat top;background-size:60px;font-size:18px;font-weight:700}
.con.feature_04 .outer .inner ul li:nth-of-type(2) p{background-image:url(/info/shoping/pc_feature_04_ico02.png)}
.con.feature_04 .outer .inner ul li:nth-of-type(3) p{background-image:url(/info/shoping/pc_feature_04_ico03.png)}
.con.feature_04 .outer .inner ul li:nth-of-type(4) p{background-image:url(/info/shoping/pc_feature_04_ico04.png)}
.con.feature_04 .outer .inner ul li:nth-of-type(5) p{margin-right:0;background-image:url(/info/shoping/pc_feature_04_ico05.png)}
.con.feature_05 .outer .inner .img{max-width:794px;margin:60px auto 0}
.con.feature_06 .outer .inner ul{width:1090px;margin:160px auto 0}
.con.feature_06 .outer .inner ul::after{content:'';display:block;clear:both}
.con.feature_06 .outer .inner ul li{float:left;width:250px;height:332px;padding:30px 20px 0;border-radius:10px;background-color:#F5F5F5;text-align:center}
.con.feature_06 .outer .inner ul li:not(:last-of-type){margin-right:30px}
.con.feature_06 .outer .inner ul li b{line-height:28px;font-size:20px;font-weight:700;color:#BF383E}
.con.feature_06 .outer .inner ul li strong{display:block;line-height:28px;margin:10px 0 20px;padding-bottom:20px;border-bottom:1px solid #DDD;font-size:20px;font-weight:700;color:#333;word-break:keep-all}
.con.feature_06 .outer .inner ul li p{font-size:16px;color:#555}
.con.system_01 .outer .inner .img{max-width:1036px;margin:0 auto}
.con.system_02 .outer .inner .img{max-width:1058px;margin:124px auto 0}
.con.system_03 .outer .inner .img{max-width:1092px;margin:116px auto 0}

.con.composition .composition_lists{display:flex;justify-content:center;text-align:center}
.con.composition .composition_lists li:not(:last-of-type){margin-right:20px}
.con.composition .composition_lists .tit{display:inline-block;line-height:25px;margin-top:20px;padding:4px 10px;border-radius:5px;background-color:#2B2B2C;font-size:18px}

@media (max-width:760px) {
    .con .outer {height:calc( 100vh - 20px );box-sizing:border-box}
    .con .outer .inner{box-sizing:border-box}
    .fixed{left:10px;right:10px}

    .pc_hidden{display:block !important}
    .mb_hidden{display:none !important}

    .con .outer .inner .content{height:100%;max-height:812px;padding:30px 20px/* ;overflow-y:auto */}
    .con .outer .inner h2{margin:0 0 0 -20px;line-height:20px;font-size:14px}
    .con .outer .inner div.tit{margin:40px 0 25px}
    .con .outer .inner div.tit strong{line-height:22px;font-size:16px}
    .con .outer .inner div.tit .sub{margin-top:10px;line-height:18px;font-size:13px}
    .con .outer .inner .content .fixed_logo{top:20px;right:20px;width:40px;height:40px}
    .con .outer .inner .content .fixed_logo a{background-image:url(/info/shoping/pc_logo_witshop.png)}
    .con.intro .outer .inner .content{background-image:url(/info/shoping/mb_intro_bg.png)}
    .con.intro .outer .inner .top{top:25%}
    .con.intro .outer .inner .top span{line-height:25px;font-size:18px}
    .con.intro .outer .inner .top h1{width:250px}
    .con.intro .outer .inner .top p{font-size:16px;font-weight:400}
    .con.intro .outer .inner .bottom{bottom:7.5%;padding:0 27px}
    .con.intro .outer .inner .bottom ul{flex-direction:column}
    .con.intro .outer .inner .bottom li:not(:first-of-type){margin-top:10px}
    .con.feature_01 .outer .inner .content{background-image:url(/info/shoping/mb_feature_01_bg.png)}
    .con.feature_01 .outer .inner .img_con{max-width:310px;margin:0 auto}
    .con.feature_01 .outer .inner .img_con .txt .box{top:15%;left:50%;right:auto;transform:translateX(-50%)}
    .con.feature_01 .outer .inner .img_con .txt .box p{margin-bottom:20px;line-height:28px;font-size:20px}
    .con.feature_01 .outer .inner .img_con .txt .box span{line-height:18px;font-size:13px}
    .con.feature_01 .outer .inner .img_con .txt .box.r{top:auto;bottom:12%}
    .con.feature_01 .outer .inner .img_con .txt .box.l span{width:210px;text-align:center}
    .con.feature_01 .outer .inner .img_con .txt .box.r span{width:203px}
    .con.feature_01 .outer .inner .img_con .txt .box.l p{margin-left:0}
    .con.feature_01 .outer .inner .img_con .txt .box.r p{margin-right:0}
    .con.feature_01 .outer .inner .img_con .txt .plus{width:17.57px;height:18.15px;background-image:url(/info/shoping/mb_ico_plus.png)}
    .con.feature_01 .outer .inner .content>p{margin-top:20px;font-size:14px}
    .con.feature_01 .outer .inner .content>p .point{margin-left:5px}
    .con.feature_02 .outer .inner ul li{width:50%;height:160px;padding:15px}
    .con.feature_02 .outer .inner ul li:nth-of-type(3),.con.feature_02 .outer .inner ul li:nth-of-type(4){height:114px}
    .con.feature_02 .outer .inner ul li:nth-of-type(5),.con.feature_02 .outer .inner ul li:nth-of-type(6){height:121px}
    .con.feature_02 .outer .inner ul li:nth-of-type(7),.con.feature_02 .outer .inner ul li:nth-of-type(8){height:156px}
    .con.feature_02 .outer .inner ul li:not(:nth-of-type(4n)){border-right:0}
    .con.feature_02 .outer .inner ul li:not(:nth-of-type(2n)){border-right:1px solid rgba(255,255,255,0.5)}
    .con.feature_02 .outer .inner ul li:not(:nth-of-type(-n+2)){border-top:1px solid rgba(255,255,255,0.5)}
    .con.feature_02 .outer .inner ul li p{margin:10px 0 5px;line-height:18px;font-size:13px}
    .con.feature_02 .outer .inner ul li .img{display:inline-block;height:auto;line-height:1}
    .con.feature_02 .outer .inner ul li img{width:24px}
    .con.feature_02 .outer .inner ul li span{display:block;font-size:12px}
    .con.feature_02 .outer .inner ul li span:nth-of-type(2){margin-left:0px}
    .con.feature_03 .outer .inner ul{flex-direction: column;padding:0}
    .con.feature_03 .outer .inner li:not(:first-of-type){margin-top:30px}
    .con.feature_03 .outer .inner li .img{width:90px;height:90px;margin:0 auto}
    .con.feature_03 .outer .inner li:not(:last-of-type) .img::after{display:none}
    .con.feature_03 .outer .inner li p{margin:15px 0 10px;line-height:25px;font-size:18px}
    .con.feature_03 .outer .inner li span{font-size:13px;color:#fff}
    .con.feature_04 .outer .inner ul{width:335px}
    .con.feature_04 .outer .inner ul li{width:105px;height:105px;padding-top:8px}
    .con.feature_04 .outer .inner ul li:not(:nth-of-type(3n)){margin-right:10px}
    .con.feature_04 .outer .inner ul li:not(:nth-of-type(-n+3)){margin-top:10px}
    .con.feature_04 .outer .inner ul li p{line-height:18px;padding-top:35px;background-size:25px;font-size:13px}
    .con.feature_05 .outer .inner .img{max-width:323px;margin:40px auto 0}
    .con.feature_06 .outer .inner ul{width:auto;margin:40px auto 0}
    .con.feature_06 .outer .inner ul li{width:calc(50% - 7.5px);height:251px;padding:15px 10px 0}
    .con.feature_06 .outer .inner ul li:not(:last-of-type){margin-right:0}
    .con.feature_06 .outer .inner ul li:not(:nth-of-type(2n)){margin-right:15px}
    .con.feature_06 .outer .inner ul li:not(:nth-of-type(-n+2)){margin-top:15px}
    .con.feature_06 .outer .inner ul li b{line-height:22px;font-size:16px}
    .con.feature_06 .outer .inner ul li strong{line-height:22px;margin:5px 0 10px;padding-bottom:10px;font-size:16px}
    .con.feature_06 .outer .inner ul li p{font-size:13px}
    .con.system_01 .outer .inner .img{max-width:335px}
    .con.system_02 .outer .inner .img{max-width:335px;margin:40px auto 0}
    .con.system_03 .outer .inner .img{max-width:335px;margin:30px auto 0}

    .con.composition .composition_lists{flex-direction:column;align-items:center}
    .con.composition .composition_lists li:not(:last-of-type){margin-right:0px;margin-bottom:20px}
    .con.composition .composition_lists li .img{max-width:230px}
    .con.composition .composition_lists .tit{margin-top:10px;line-height:18px;font-size:13px}
    .con.composition_01 .composition_lists li:first-of-type .img{max-width:250px}
    .con.composition_01 .composition_lists li:nth-of-type(2) .img{max-width:335px}
}