@charset "utf-8";
/* CSS Document */

/*----------------------------------------------------------------------------------------------
 LP css
----------------------------------------------------------------------------------------------*/
.btn{ line-height:1; font-weight: bold;}
/*.wine_lp_wrap{ font-size:16px; position:absolute; z-index: -100; top:0;}*/
.lp_mainvisual{ position: relative; }
.lp_mainvisual .inner{
  width:1100px;
  height:530px;
  margin:0 auto;
  padding-top:110px;
}
.lp_mainvisual .main_desc{
  width: 480px;
  max-width: 100%;
  padding: 12px;
  /*margin-bottom:16px;*/
  margin: 4px 0 40px 0;
  font-size:18px;
  font-weight:bold;
  color:#000;
  text-shadow: 0 0 0.4em rgb(255, 253, 253);
  border-radius: 8px;
  background-color: rgba(255,255,255, .52);
}
.lp_mainvisual a.btn{ border-radius: 5px; }
.lp_mainvisual .tag{ width:300px; height:300px; position: absolute; right:100px; top:60px; z-index:2;}

.wine_lp_wrap .inner .msub_ttl{ color:#da1913; font-weight:bold; font-size:24px; line-height:1.0; text-shadow: 0 0 0.4em rgb(255, 253, 253);}
.wine_lp_wrap .inner .main_ttl{ font-size:64px; font-weight:bold; color:#da1913; text-shadow: 0 0 0.4em rgb(255, 253, 253);}
.wine_lp_wrap .lp_mainvisual{ background: url("../img/mainvisual_bk1.jpg") center center no-repeat; background-size: cover; height:540px;}
.wine_lp_wrap .lp_mainvisual a.btn{ width:320px; }

@media screen and (max-width: 640px) {
  .lp_wrap{ font-size:14px;}
  .lp_mainvisual .inner{ width:90%; height:300px;}

  .wine_lp_wrap .lp_mainvisual .inner{ height: 338px; padding-top:40px; }
  .wine_lp_wrap .inner .msub_ttl{ font-size:16px; }
  .wine_lp_wrap .inner .main_ttl{ font-size:26px; }
  .wine_lp_wrap .lp_mainvisual .main_desc{ font-size:14px; font-weight:normal; line-height:1.4; padding-top: 8px; margin-bottom:16px;}
  .wine_lp_wrap .lp_mainvisual a.btn{ width:100%; }
  .wine_lp_wrap .lp_mainvisual{ background: url("../img/mainvisual_sp_bk1.jpg") center center no-repeat; background-size: cover; height:280px}
  .lp_mainvisual .tag{ width:96px; height:96px; top:10px; right:10px; }
}

.jump_wrap{ background-color: #bf1a20; padding:40px 0; margin-bottom: 40px;}
.jump_wrap p{ margin-bottom:24px; font-size:20px; text-align:center; color:#FFF; line-height:1.6;}
.jump_wrap p.subttl{ font-size:18px; text-align:center; font-weight: bold; margin-bottom:0;}
.jump_wrap span{ display:block; font-size:14px; padding-top: 8px;}
.jump_wrap ul{ width:100%;}
.jump_wrap ul li{ width:542px; float:left; margin-right:16px;}
.jump_wrap ul li:last-child{ margin-right:0; }
/*.jump_wrap ul li a{
  font-size:24px;
  display: inline-block;
  text-decoration:none;
  text-align:center;
  color:inherit;
  cursor:pointer;
  box-sizing:border-box;
  transition:0.2s;
  border:1px solid transparent;
  font-weight:normal;
  vertical-align: middle;
  background-color: #fff;
  padding:16px;
  width:100%;
  border-radius: 5px;
  line-height: 1.0;
}*/
@media screen and (max-width: 640px) {
  .jump_wrap{ padding:40px 0 16px; }
  .jump_wrap p{ margin-bottom:24px; font-size:16px;}
  .jump_wrap span{ font-size:12px;}
  .jump_wrap ul{ width:100%;}
  .jump_wrap ul li{ width:100%; float:none; margin-right:0; margin-bottom:16px;}
  .jump_wrap ul li:last-child{ margin-right:0; margin-bottom:0;}
/*  .jump_wrap ul li a{
    font-size:18px;
    padding:8px 16px;
  }*/
}

.content{ padding:40px 0 0; }
h2.content_ttl{ font-size:40px; font-weight: bold; text-align:center; padding: 24px 0;}
.desc{ font-size:16px; text-align:center;}
@media screen and (max-width: 640px) {
  .content{ padding:32px 0 0; }
  .desc{ font-size:16px; text-align:left; }
  h2.content_ttl{ font-size:24px; padding: 16px 0;}
}

.box1{ width:100%; padding:40px 0 0; text-align:}
@media screen and (max-width: 640px) {
  .box1{ width:100%; padding:32px 0 0;}
}

.box2{ padding:40px 0 0; }
.box2 ul li{ width:530px; float:left; margin-right:40px; margin-bottom:16px;}
.box2 ul li:nth-child(2n){ margin-right:0; }
.box2 ul li h2.ttl{ font-size:24px; font-weight: bold; margin:16px 0; line-height:1.3; }
.box2 ul li .desc{ text-align:left; font-size:16px;}
@media screen and (max-width: 640px) {
  .box2{ padding:32px 0 0; }
  .box2 ul li{ width:100%; float:none; margin:0 0 16px 0;}
  .box2 ul li:last-child{ margin:0; }
  .box2 ul li .img{ margin-bottom:16px; }
  .box2 ul li h2.ttl{ font-size:20px; margin:8px 0;}
}

.box3{ padding:40px 0; }
.box3 ul{ width:1140px; margin-right:-40px; }
.box3 ul li{ width:340px; float:left; margin-right:40px;}
.box3 ul li:last-child{ margin-right:0; }
/*.box3 ul li .img{ height:200px; outline: 1px solid #ccc;}*/
.box3 ul li h2.ttl{ font-size:24px; font-weight: bold; margin:16px 0; color: #a88f5b;}
.box3 ul li .desc{ text-align:center; }
@media screen and (max-width: 640px) {
  .box3{ padding:32px 0; }
  .box3 ul{ width:100%; margin-right:0; }
  .box3 ul li{ width:100%; float:none; margin:0 0 16px 0;}
  .box3 ul li:last-child{ margin:0; }
  /*.box3 ul li .img{ height:200px; }*/
  .box3 ul li h2.ttl{ font-size:18px; margin:8px 0;}
  .box3 ul li .desc{ text-align:left; }
}

.box4_inner{ width:600px; background-color: #FFF; padding:36px; margin-top:32px;}
.wine_lp_wrap .box4{ background:url("../img/wine/winelp_content_bk1.png") center center #f2f2f2 no-repeat; }

ul.check_list li{ font-size:20px; font-weight: bold; margin:0 0 10px; }
ul.check_list li:last-child{ margin-bottom:0; }
ul.check_list li::before {
    font-family: "Font Awesome 5 Free";
    font-weight: normal;
    content: "\f14a";
    margin-right: 10px;
}
ul.check_list .underline{ background: linear-gradient(transparent 60%, #ffbf00 0%); }
@media screen and (max-width: 640px) {
  .box4_inner{ width:100%; padding:24px; margin-top:24px;}
  ul.check_list li{ font-size:18px; margin:0 0 10px; }
}

.box5 { padding:40px 0; }
.box5 ul { width:100%; display: table; border:1px solid #333;}
.box5 ul li{ width:33.3%; display: table-cell; border:1px solid #333; box-sizing: border-box; background-color: #FFF;}
.box5 ul li h2.ttl{ color:#FFF; text-align:center; font-size:18px; font-weight:bold; padding:16px; line-height: 1.0;}
.box5 ul li h2.ttl.step1{ background-color: #333; }
.box5 ul li h2.ttl.step2{ background-color: #666; }
.box5 ul li h2.ttl.step3{ background-color: #999; }
.box5 ul li h3.subttl{ text-align: center; font-weight:bold; font-size:24px; line-height:1.3; padding:16px 0 0;}
.box5 ul li .desc{ padding:24px; font-size:16px; text-align: left;}
@media screen and (max-width: 640px) {
  .box5 { padding:32px 0 0; }
  .box5 ul { width:100%; display: block; border:1px solid #333;}
  .box5 ul li{ width:100%; display: block;}
  .box5 ul li h2.ttl{ font-size:20px;}
  .box5 ul li h3.subttl{ font-size:20px; padding:8px 0 0;}
  .box5 ul li .desc{ padding:16px; font-size:14px;}
}

.box6{ padding:40px 0; }
.box6 ul{ margin-right:-40px; overflow: hidden;}
.box6 ul li{ width:20%; float:left; padding-right:40px;}
.box6 ul li .img{ margin-bottom:24px; width:100%; height:180px;}
.box6 ul li .ttl{ text-align:center; font-weight:bold; }
@media screen and (max-width: 640px) {
  .box6{ padding:32px 0 0; }
  .box6 ul{ margin-right:0; overflow: hidden;}
  .box6 ul li{ width:auto; float:none; padding-right:0; margin:0; position: relative; line-height:72px; margin-top:10px;}
  .box6 ul li .img{ margin-bottom:0; width:72px; height:72px; position: absolute; top:0;}
  .box6 ul li .ttl{ text-align:left; padding-left:80px; font-size: 16px;}
}

.box7{ padding: 40px 0; }
.box7 .ttl{ font-size:20px; font-weight:bold; }
@media screen and (max-width: 640px) {
  .box7{ padding: 0; }
  .box7 .ttl{ font-size:18px;}
}

.box8{ padding: 40px 0; }
.box8 .txt{ width:600px; float:left; text-align: left;}
.box8 .txt .main_ttl{ font-size:40px; text-align:left; margin-bottom:0;}
.box8 .txt .ttl{ font-size: 24px; text-align: left; line-height:1.3; margin-bottom: 24px; font-weight: bold;}
.box8 .img{ width:460px; float:left; margin-left:40px;}
@media screen and (max-width: 640px) {
  .box8{ padding: 0; }
  .box8 .txt{ width:100%; float:left;}
  .box8 .txt .main_ttl{ font-size:24px; }
  .box8 .txt .ttl{  font-size:18px; }
  .box8 .img{  width:100%; float:none; margin-left:0; }
}

.lp_contact{ display: table; width:100%; border-top:1px solid #a88f5b; }
.contact_box{ display: table-cell; width:50%; padding:40px; box-sizing: border-box; text-align:center;}
.contact_box:last-child{ border-left:1px solid #a88f5b; }
.contact_box i{ font-size:68px; }
.contact_box .ttl{ font-weight: bold; font-size:20px; padding:16px 0 8px; }
.contact_box .desc{ font-size:16px; margin-bottom:24px; text-align: center;}
.contact_box .tel{ font-size: 40px; font-weight:bold; }
@media screen and (max-width: 640px) {
  .lp_contact{ display: block; border-top:2px solid #333; border-bottom:0;}
  .contact_box{ display: block; width:100%; padding:24px; border-bottom:2px solid #333;}
  .contact_box:last-child{ border-left:0; border-bottom:0; padding-bottom:56px;}
  .contact_box i{ font-size:48px; }
  .contact_box .ttl{ font-weight: bold; font-size:20px; padding:16px 0 8px; }
  .contact_box .desc{ font-size:14px; margin-bottom:16px;}
  .contact_box .tel{ font-size: 32px; font-weight:bold; }
}

.lp_subcontact{ background-color: #333; padding:24px 0 16px; }
.subcontact_wrap{ display: table; width:100%; }
.subcontact_box{ display: table-cell; text-align:center; color:#FFF; vertical-align: top; }
.subcontact_box .main{ color:#FFF; border:1px solid #fff; padding: 16px 0; }
.subcontact_box .ttl{ font-size:24px; font-weight:bold;}
.subcontact_box .ttl i{ font-size:30px; margin-right:10px;}
.subcontact_box .desc{ font-size:16px; margin-bottom:24px;}
.subcontact_box .tel a{ font-size: 40px; font-weight:bold; color:#FFF;}
.subcontact_box a.btn{ padding:32px; }
@media screen and (max-width: 640px) {
  .lp_subcontact{ padding:24px 0; }
  .subcontact_wrap{ display: block; width:100%; }
  .subcontact_box{ display: block; width:100%; vertical-align: top;}
  .subcontact_box .main{ margin-bottom:24px; padding:10px; font-size:14px;}
  .subcontact_box .ttl{ font-size:18px; }
  .subcontact_box .ttl i{ font-size:24px;}
  .subcontact_box .desc{ font-size:14px; margin-bottom:24px;}
  .subcontact_box .tel{ margin-bottom:16px; }
  .subcontact_box .tel a{ font-size: 24px;}
  .subcontact_box a.btn{ padding:16px; }
}

.price_wrap .table_type01{ background-color: #FFF; }
.price_wrap .table_type01 th{ background-color: #666; color:#FFF; font-size:14px; font-weight:normal;}

.lp_contact a.btn,
.lp_subcontact a.btn{ border-radius: 5px; }
.lp_contact a:hover,
.lp_subcontact a:hover{ text-decoration: none;}

.lp_message_wrap{ background: #da1913; text-align: center; position: relative;}
.lp_message{ font-size:32px; color:#FFF; padding:16px; font-weight:bold;}
.lp_message_wrap::after {
    position: absolute;
    display: block;
    top: 70px;
    left: 50%;
    width: 0;
    height: 0;
    content: "";
    margin-left: -40px;
    border-style: solid;
    border-width: 40px 40px 0 40px;
    border-color: #da1913 transparent transparent transparent;
}
@media screen and (max-width: 640px) {
  .lp_message{ font-size:24px;}
  .lp_message_wrap::after { top:100px; }
}
@media(min-width: 641px){
  a[href^="tel:"]{
    pointer-events: none;
  }
}
.box2 ul.business li img{ border-radius: 5px 5px 0 0; }
.box2 ul.business li{ background-color: #FFF; box-shadow: 2px 2px 5px #ccc; border-radius: 5px;}
.box2 ul.business li .body{ padding:8px 24px 24px; }
@media screen and (max-width: 640px) {
  .box2 ul.business li .body{ padding:0 16px 16px; }
}



/*----------------------------------------------------------------------------------------------
 EC物流
----------------------------------------------------------------------------------------------*/
.eclogi_mainvisual{ background: url(../img/eclogi_mainvisual_bk.png) center center no-repeat; background-size: cover; position: relative;}
.eclogi_mainvisual .tag { width:100%; height: 200px; position: absolute; text-align: center; top:80px;}
.eclogi_mainvisual .inner{
  width:1100px;
  height:530px;
  margin:0 auto;
}

.eclogi_center_ttl { color:#FFF; font-size:40px; font-weight: bold; text-align:center; margin-bottom:16px; }
.eclogi_center{ width:100%; margin-bottom:8px;}

.box3.eclogi_merit_list ul li{ background-color: #f2f2f2; padding:24px 24px 0; box-sizing: border-box; }
.box3.eclogi_merit_list ul li .sub_ttl{ text-align: center; font-size: 20px;margin-bottom: 16px; line-height: 1.4;}
.box3.eclogi_merit_list ul li .desc{ font-size:16px; line-height: 1.4; }
.box3.eclogi_merit_list ul li .img{ margin-bottom:16px; }

.eclogi_merit_wrap{ background-color: #333; padding: 24px 0 16px; }
.eclogi_merit_ttl{ color:#FFF; text-align: center; font-size:36px; font-weight:bold; }
.eclogi_merit{ margin: 40px 0 0; }
.eclogi_merit ul li{ width:100%; min-height: 240px; margin-bottom:24px; background-color: #f2f2f2; padding:24px; display: table;}
.eclogi_merit ul li .img{ display: table-cell; width:40%; }
.eclogi_merit ul li .text{ display: table-cell; width:auto; padding-left:24px; line-height:1.6;}
.eclogi_merit ul li .text h3.ttl{ font-size:24px; border-bottom:1px solid #CCC; margin-bottom:12px; font-weight: bold; padding-bottom:4px;}
.eclogi_merit ul li .text h3.ttl span{ font-size:14px; margin-left:8px; }
.eclogi_merit ul li .text h4.sub_ttl{ font-size:18px; margin-bottom:8px; font-weight:bold; }
.eclogi_merit ul li .text .desc{ font-size: 16px; line-height: 1.6; }

ul.eclogi_screen li{ margin-bottom:24px; }

@media screen and (max-width: 640px) {
  .eclogi_mainvisual{ background: url(../img/eclogi_mainvisual_sp_bk.png) center center no-repeat; background-size: cover;}
  .eclogi_mainvisual .tag { top:70px;}
  .eclogi_center_ttl{ font-size: 24px; }
  .eclogi_merit_ttl{ font-size: 24px; }
  .eclogi_merit ul li{ direction: block; width:auto;}
  .eclogi_merit ul li .img{ display: block; width:100%; min-height: 180px; margin-bottom:16px;}
  .eclogi_merit ul li .text{ display: block; width:100%; padding-left:0;}
  .eclogi_merit ul li .text h3.ttl{ font-size:18px; margin-bottom:10px; padding-bottom:4px;}
  .eclogi_merit ul li .text h4.sub_ttl{ font-size:16px;}
  .eclogi_merit ul li .text{ line-height:1.4;}

  ul.eclogi_screen li{ margin-bottom:16px; }
}