@charset "UTF-8";

.box>li{border: 1px solid #444;padding: 6vw;margin-bottom: 6vw;}
.box>li p{margin-bottom: 0;}
.box .tit{line-height: 1.4;color: var(--green01);font-weight: bold;font-size: 5vw;margin-bottom: 2vw;}
.box .tit::before{display: inline-block;width: 12vw;height: 12vw;vertical-align: middle;}
.box .delivery::before{content: "";background: url(../images/user-guide/icon01.png) no-repeat center;background-size: contain;margin-right: 2vw;}
.box .payment::before{content: "";background: url(../images/user-guide/icon02.png) no-repeat center;background-size: contain;margin-right: 2vw;}
.box .returns::before{content: "";background: url(../images/user-guide/icon03.png) no-repeat center;background-size: contain;margin-right: 2vw;}
.box .note::before{content: "";background: url(../images/user-guide/icon04.png) no-repeat center;background-size: contain;margin-right: 2vw;}
.box .maintenance::before{content: "";background: url(../images/user-guide/icon05.png) no-repeat center;background-size: contain;margin-right: 2vw;}
.box .confirmation::before{content: "";background: url(../images/user-guide/icon06.png) no-repeat center;background-size: contain;margin-right: 2vw;}
.box .text li{position: relative;padding-left: 7.6vw;margin-bottom: 2.5vw;}
.box .text li::before{content: "";position: absolute;left: 2.8vw;top: 2.6vw;background: var(--green01);border-radius: 50%;padding: 0.8vw;}
.box .text li a{display: inline;color: var(--green01);font-weight: bold;border-bottom: 1px solid var(--green01);}

ul.check-list{background: #c5f11a; color: #000; border-radius: 2vw; padding: 4vw; }
.check-list li{position: relative;border-bottom: 1px dashed #444;padding-bottom: 4vw;padding-left: 5vw;margin-bottom: 4vw;line-height: 1.3;}
.check-list li:last-child{border-bottom: none; padding-bottom: 0;margin-bottom: 0;}
.check-list li:before{content: "\f058";font-weight: normal;font-family: 'icon';position: absolute;top: 0;left: 0;font-size: 115%;}


/* =============================================
pc-size
================================================*/
@media screen and (min-width: 769px) {

.box>li{ padding: 40px; margin-bottom: 40px;}
.box .tit{font-size: 24px;margin-bottom: 20px;}
.box .tit::before{width: 45px;height: 45px;margin-right: 15px;}
.box .text li{padding-left: 35px;margin-bottom: 10px;}
.box .text li::before{padding: 3px;top: 11px;left: 15px;}

ul.check-list{padding: 34px; border-radius: 5px; display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-pack: justify;justify-content: space-between;-ms-flex-wrap: wrap;flex-wrap: wrap;}
.check-list li{padding-bottom: 15px;padding-left: 24px;margin-bottom: 15px;width: 49%;}
.check-list li:nth-last-child(2){padding-bottom: 0; margin-bottom: 0;border-bottom: none;}
.check-list li:before{width: 24px;height: 24px;margin-right: 10px;top: 1px;}
}


/* =============================================
retina用
================================================*/
@media screen and (min-width: 769px) and (-webkit-min-device-pixel-ratio: 2), screen and (min-width: 769px) and (min-resolution: 2dppx) {
}