@charset "UTF-8";

/*first
----------------------------------------------- */
.exclusive{margin-bottom: 12vw;}
.exclusive img{width: 100%;}

.flow{background: #f1f8e9;padding: 10vw 0;}
.flow ul{width: 90%;margin: 0 auto;position: relative;}
.flow ul:after {content:"";display:block;width: 1px;height: 100%;background-color: #ddd;position: absolute;top:0;left: 50%;z-index: 1;}
.flow li{background: #fff;padding: 6% 6% 4%;border: 1px solid #ddd;margin-bottom: 6vw;z-index: 2;position: relative;}
.flow li:last-child{margin-bottom: 0;}
.flow img{width: 100%;margin-bottom: 4vw;}

.flow .number{margin-bottom: 1vw;text-align:left;}
.flow .number span{font-size: 18px;display: -webkit-box;display: -moz-box;display: -webkit-flex;display: box;display: flex;align-items: center;-webkit-align-items: center;font-family: var(--font_marcellus);color: #136c3c;}
.flow .number span:after{content: '';height: 1px;background: #136c3c;display: inline-block;width: 80px;margin-left: 12px;}
.flow p{ line-height: 1.7;font-feature-settings: "palt";letter-spacing: .04em;text-align: justify; margin-bottom: 3vw;}

/* =============================================
pc-size 
================================================*/
@media screen and (min-width: 736px) {
	
.exclusive{margin-bottom: 90px;}
.exclusive img{width: 700px;margin: 0 auto;}

.flow{padding: 90px 0;}
.flow ul{width: 900px;}
.flow li{padding: 40px 40px 30px;margin-bottom: 30px;display: -webkit-flex;display: -ms-flexbox;display: flex;-webkit-justify-content: space-between;-ms-flex-pack: justify;justify-content: space-between;-webkit-align-items: flex-start;-ms-flex-align: start;align-items: flex-start;}
.flow img{width: auto;margin-bottom: 0;order: 2;margin-left: 30px;}

.flow .number{margin-bottom: 10px;}
.flow .number span{font-size: 20px;}
.flow .number span:after{margin-left: 12px;margin-bottom: 0;}
.flow p{margin-bottom: 16px;}

    
}