@charset "UTF-8";
@media screen and (min-width: 768px),print {
main{ width: 100%; }
article{ width: 1100px; margin: 0 auto; }
.side-fix{ display: none; }
#con01{width: 100%;max-width: 1920px;margin: 53px auto 81px;padding-bottom: 140px;background: url(../images/order/con01-bg01.jpg) no-repeat center bottom;}
#con01 .inner-Box{ width: 1200px; margin: 0 auto; position: relative; }
#con01 .ttl{ text-align: center; }
#con01 .ttl span{font-size: 36px;font-weight: 700;line-height: 60px;letter-spacing: 4px;color: #fff;width: 600px;margin: 0 auto 7px auto;
	text-align: center;background-color: #0E7AFF;border: 2px solid #0328AD; position: relative; display:inline-block; text-align: center;}

#con01 .pic{ margin-top: -100px; }
#con01 .icon{position: absolute;top: -49px;left: 101px;}
#con01 .txt{margin-top: -116px;text-align: center;margin-bottom: 8px;}
#con01 .txt span{font-size: 24px;font-weight: 700;line-height: 28px;letter-spacing: 2.5px;background-color: #fff;padding: 5px 14px;display: inline-block;margin-bottom: 4px;border: 2px solid;}
#con01 .txt1{width: 960px;margin: 0 auto 55px;background: url(../images/order/con01-bg02.png) no-repeat center top;padding: 32px 12px 70px;text-align: center;font-size: 34px;font-weight: 700;line-height: 20px;letter-spacing: 3.5px;position: relative;}
#con01 .box1{ width: 1200px; margin: 0 auto; }
#con01 .box1 .ttl1{text-align: center;width: 240px;margin: 0 auto 58px;font-size: 34px;font-weight: 700;line-height: 28px;letter-spacing: 3.5px;background: linear-gradient(transparent 80%, #FFD800 0%);}
#con01 .box1 .list{ display: -webkit-box; display: -webkit-flex; display: -moz-flex; display: -ms-flex; display: -o-flex; display: flex; -webkit-box-lines: multiple; -moz-box-lines: multiple; -webkit-flex-wrap: wrap; -moz-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; }
#con01 .box1 .list li{width: 350px;margin-right: 30px; position: relative;}
#con01 .box1 .list li::before{content: url(../images/order/arrow.png);position: absolute;top: 165px;right: -24px;transform: scale(1);}
#con01 .box1 .list li:first-child{margin-left: 41px;}
#con01 .box1 .list li:last-child{ margin-right: 0px; }
#con01 .box1 .list li:last-child::before{display: none;}
.system-ttl{ font-size: 34px; text-align: center; font-weight: 700; letter-spacing: 4px; }
.system-list{ width: 1100px; margin: 0 auto; }

}

@media screen and (max-width: 767px) {

#con01{margin: 5vw auto 8vw;padding-bottom: 14vw;background: url(../images/order/con01-bg01.jpg) no-repeat center bottom;}
#con01 .inner-Box{ margin: 0 auto; position: relative; }

#con01 .ttl{ text-align: center; }
#con01 .ttl span{font-size: 5vw;font-weight: 700;line-height: 1.8;letter-spacing: 0.8vw;color: #fff;width: 90%;margin: 0 auto 1.5vw;
	text-align: center;background-color: #0E7AFF;border: 2px solid #0328AD; position: relative;padding: 0.5vw 1vw 0.5vw 1vw; display: inline-block;}

#con01 .pic{ margin-top: -5vw; }
#con01 .icon{position: absolute;top: 29vw;left: 5vw;width: 33%;}
#con01 .txt{margin-top: -23vw;text-align: center;margin-bottom: 1vw;}
#con01 .txt span{font-size: 3.6vw;font-weight: 700;line-height: 1.8;letter-spacing: 0.5vw;background-color: #fff;padding: 0vw 3vw;display: inline-block;margin-bottom: 1vw;border: 2px solid;}
#con01 .txt1{width: 90%;margin: 0 auto 6vw;background: url(../images/order/sp-con01-bg02.png) no-repeat center top;
	background-size: 100% auto; padding: 4.5vw 0 8vw;text-align: center;font-size: 5vw;font-weight: 700;line-height: 1.6;letter-spacing: 0.4vw;position: relative;}
#con01 .box1{ margin: 0 auto; }
#con01 .box1 .ttl1{text-align: center;width: 50%;margin: 0 auto 8vw;font-size: 5vw;font-weight: 700;line-height: 1.8;letter-spacing: 0.6vw;background: linear-gradient(transparent 80%, #FFD800 0%);}
#con01 .box1 .list{ display: -webkit-box; display: -webkit-flex; display: -moz-flex; display: -ms-flex; display: -o-flex; display: flex; -webkit-box-lines: multiple; -moz-box-lines: multiple; -webkit-flex-wrap: wrap; -moz-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; }
#con01 .box1 .list li{width: 100%; margin-bottom: 16vw; padding: 0 16vw; position: relative;}
#con01 .box1 .list li::before{content: url(../images/order/sp-arrow.png);position: absolute;top: 70vw;right: 40vw;transform: scale(1);}
#con01 .box1 .list li:first-child{}
#con01 .box1 .list li:last-child{ margin-bottom: 0; }
#con01 .box1 .list li:last-child::before{display: none;}

.system-ttl{ font-size: 5vw; text-align: center; font-weight: 700; letter-spacing: 0.8vw; margin-bottom: 2vw; }
.form-Box h2.sub-title{margin-top: -16vw!important;}


}