@charset "UTF-8";
@import url("./reset.css?date=20250408");
@import url("./plugin.css?date=20250408");
@import url("./base.css?date=20250408");
@import url("./module.css?date=20250725");
/* ==========================================================

Name:
    top.css

Description:
    トップページ共用モジュール

/* ==========================================================
*
*   layout
*
========================================================== */
.c-section {
    margin-top: 60px;
}
/* sp size */
@media screen and (max-width: 767px) {
    .c-section {
        margin-top: 30px;
    }
}

/* sp size */
@media screen and (max-width: 767px) {
	.top-slider {
		padding-bottom: 10px;
	}
	.top-slider img {
        border-radius: 25px;
        -webkit-border-radius: 25px;
        -moz-border-radius: 25px;
        
        padding: 0 5px;
	}
}



/*  main_image-area メインイメージエリア
--------------------------------------------- */

/* ---- [#main_image-area] ---- */

@media screen and (min-width: 768px) { /* pc size */
    #main_image-area {
        background: url(../img/top/main_image-back.webp) top center no-repeat;
        height: 1083px;
        position: relative;
        font-family: "HiraKaku M5";
    }
    .close {
        background: url(../img/top/main_close-back.jpg) top center no-repeat !important;
        height: 1083px;
        position: relative;
        font-family: "HiraKaku M5";
    }
}
@media screen and (max-width: 767px) { /* sp size */
    #main_image-area {
        background: url(../img/top/sp/main_image-back.webp) top center no-repeat;
    }
}

/* ---- [.welcome-message] ---- */

@media screen and (min-width: 768px) { /* pc size */
    #main_image-area .welcome-message {
        position: relative;
        padding-top: 118px;
    }
    #main_image-area .welcome-message img {
        max-width: 764px;
    }
}
@media screen and (max-width: 767px) { /* sp size */
    #main_image-area .welcome-message {
        background-color: rgba(255,255,255, 0.70);
        position: relative;
        padding: 30px 0;
        top: 80px;
    }
    #main_image-area .welcome-message img {
        max-width: 70.46667vw;
    }
}

/* ---- [.case-message] ---- */

#main_image-area .case-message {
    position: relative;
    font-weight: bold;
}
#main_image-area .case-message .event,
#main_image-area .case-message .sports,
#main_image-area .case-message .seminar,
#main_image-area .case-message .food {
    position: absolute;
}

@media screen and (min-width: 1369px) {
    #main_image-area .case-message .event { padding-left: 194px; padding-top: 224px; }
    #main_image-area .case-message .sports { padding-left: 426px; padding-top: 264px; }
    #main_image-area .case-message .seminar { padding-left: 695px; padding-top: 264px; }
    #main_image-area .case-message .food { padding-left: 954px; padding-top: 224px; }
}
@media screen and (min-width: 768px) and (max-width: 1368px) {
    #main_image-area .case-message .event {
        display: inline-block;
        padding-top: 224px;
        margin-left: -433px;
    }
    #main_image-area .case-message .sports {
        display: inline-block;
        padding-top: 264px;
        margin-left: -198px;
    }
    #main_image-area .case-message .seminar {
        display: inline-block;
        padding-top: 264px;
        margin-left: 70px;
    }
    #main_image-area .case-message .food {
        display: inline-block;
        padding-top: 224px;
        margin-left: 335px;
    }
}

/* ---- [.copy-message] ---- */

#main_image-area .copy-message {
    position: relative;
    font-family: "HiraKaku M7";
    color: #111;
}

@media screen and (min-width: 768px) { /* pc size */
    #main_image-area .copy-message {
        padding-top: 320px;
        font-size:  26px;
    }
}
@media screen and (max-width: 767px) { /* sp size */
    #main_image-area .copy-message {
        padding-top: 150px;
        font-size: 5.86667vw;
        /*text-shadow:1px 1px 0 #FFF, -1px -1px 0 #FFF,
              -1px 1px 0 #FFF, 1px -1px 0 #FFF,
              0px 1px 0 #FFF,  0-1px 0 #FFF,
              -1px 0 0 #FFF, 1px 0 0 #FFF;*/
    }
}

/* ---- [.tel-message] ---- */

#main_image-area .tel-message {
    position: relative;
    padding-top: 28px;
}
#main_image-area .tel-message img {
    max-width: 458px;
}
#main_image-area .tel-message p {
    margin-top: 10px;
    font-weight: bold;
}
@media screen and (max-width: 767px) { /* sp size */
    #main_image-area .tel-message {
        padding-top: 38px;
    }
    #main_image-area .tel-message img {
        width: 100%;
    }
    #main_image-area .tel-message p {
        font-size: 3.66667vw;
        font-weight: normal;
    }
}

/* ---- [.order-message] ---- */

.order-message {
    /* margin-top: 47px;*/
     margin-top: 44px;
}
.stop-message {
	font-size: 88.71%;
	/*color: #df043a;*/
	/*font-weight: bold;*/
	margin-bottom: 5px;
}
.order-btn a {
	font-size: 24px;
    /*font-weight: bold;*/
    color: #FFF;
    width: 60%;
    display: inline-block;
    text-align: center;
    vertical-align: middle;
    background-color: #df043a;
    font-family: "HiraKaku M7";
    border: 0;
/*     padding: 24px; */
    padding: 18px 24px;

    border-radius: 40px;
    -webkit-border-radius: 40px;
    -moz-border-radius: 40px;
}
.order-btn a:hover {
    background-color: #c3000d;
    cursor: pointer;
}
.order-message p {
    margin-top: 10px;
}
@media screen and (max-width: 767px) { /* sp size */
    .order-message {
        background-color: rgba(255,255,255, 0.70);
        padding-top: 16px;
        padding-bottom: 10px;
        margin-top: 20px;
    }
    .order-btn a {
        font-size: 24px;
        width: 100%;
        padding: 20px;
        line-height: 1;

        border-radius: 10px;
        -webkit-border-radius: 10px;
        -moz-border-radius: 10px;
    }
    .sp-order--version {
	    font-size: 3.46667vw;
    }
    .sub-links-top {
	    gap: 10px;
	    padding: 10px 0;
    }
    .sub-links-Area {
	    width: 100%;
    }
    .order-message p {
	    font-size: 3.26667vw;
	    margin-top: 0;
    }
    
	/* ボタンのスタイル */
	.sub-links-btn {
		display: flex;
		gap: 8px;
		align-items: center;
		justify-content: center;
		width: 100%;
		background-color: #df043a;
		height: 64px;
		padding: 8px 12px 8px 8px;
		font-family: "HiraKaku M7";
		font-size: 16px;
		color: #fff;
		text-align: center;
		overflow-wrap: anywhere;
		
        border-radius: 10px;
        -webkit-border-radius: 10px;
        -moz-border-radius: 10px;
	}
	.sub-links-btn_Icon {
		display: flex;
		align-items: center;
		justify-content: center;
		height: 20px;
		aspect-ratio: 1;
	}
	.icon-guide {
		height: 18px;
	}
	.sp_tel-message {
		padding-bottom: 20px;
	}
	.sp_tel-message div {
		color: #fff;
		background-color: #061F6D;
		padding: 5px 10px;
		font-family: "HiraKaku M7";
		font-size: 16px;
		
	    border-radius: 40px;
	    -webkit-border-radius: 40px;
	    -moz-border-radius: 40px;
	}
	.sp_tel-message img {
		width: 80%;
		padding: 10px 0 3px;
	}
	.sp_tel-message p {
		font-size: 3.46667vw;
	}
    
}

/* ---- [.under-message] ---- */
.under-message {
     margin-top: 178px;
     
     /* close用 */
     /*margin-top: 90px;*/
}
@media screen and (max-width: 767px) { /* sp size */
    .under-message {
        /*margin-top: 65px;*/
        margin-top: 35px;
        font-size: 3.26667vw;
        background-color: rgba(255,255,255, 0.70);
        padding: 20px;
        margin-bottom: 20px;
    }
}

/*  news_ticker-area ニュースティッカーエリア
--------------------------------------------- */
.news_ticker-area .ticker {
    margin: 0 auto;
    padding: 20px 5px;
    width: calc(100% - 0px);
    text-align: left;
    position: relative;
    overflow: hidden;
    z-index:0;
    background-color:#ffffff;
}
@media screen and (max-width: 767px) { /* sp size */
    .news_ticker-area .ticker {
        height: calc(100% - 0px);
        padding: 0px 5px 40px;
        font-size: 3.26667vw;
    }
}
.news_ticker-area .ticker ul {
    width: 100%;
    position: relative;
}

.news_ticker-area .ticker ul li {
    width: 100%;
    display: none;
}

/*  corona-area 感染予防エリア
--------------------------------------------- */

.corona-area .btn-blue a {
    padding: 16px;
}
@media screen and (max-width: 767px) { /* sp size */
    .corona-area .btn-blue a {
        padding: 12px;
        font-size: 3.86667vw;
    }
}

/*  commitment-area こだわりエリア
--------------------------------------------- */

.commitment-title { max-width: 468px; }
.commitment-title1 { max-width: 48px; }
.commitment-title2 { max-width: 90px }
.commitment-title3 { max-width: 48px }
.commitment-image1,
.commitment-image2,
.commitment-image3 { max-width: 240px; margin-left: 10px; }

#commitment-area {
    border-top: 1px dotted #ccc;
    margin-top: 20px;
    padding-top: 30px;
}


/* ---- [.commitment-back] ---- */

@media screen and (min-width: 768px) { /* pc size */
    .commitment-back {
        background: url(../img/top/commitment-image.jpg) top center no-repeat;
        height: 336px;
        margin: 20px 0 60px;
    }
    .commitment-point {
        background: url(../img/top/commitment-point.svg?20250106) 40% top no-repeat;
        height: 914px;
    }
    .commitment-point-back {
        background: url(../img/top/commitment-back.webp) bottom center no-repeat;
        min-height: 1504px;
    }
}
@media screen and (max-width: 767px) { /* sp size */
    .commitment-back {
        background: url(../img/top/sp/commitment-image.jpg) top center no-repeat;
        height: 240px;
        margin: 20px 0 30px;
    }
    .sp-commitment-point-back {
        background: url(../img/top/sp/commitment-back.webp) bottom center no-repeat;
        min-height: 548px;
        margin-bottom: 30px;
    }
    .point-image {
        margin: 0 auto;
        text-align: center;
    }
    .point-image p {
        display: inline-block;
        vertical-align: middle;
    }
}

/* ---- [.commitment-point-back] ---- */


.commitment-point h3 {
    display: block;
    font-size: 24px;
/*     font-weight: bold; */
    margin-bottom: 20px;
    font-family: "HiraKaku M7";
}
@media screen and (max-width: 767px) {  /* sp size */
    .commitment-point h3 {
        font-size: 5.83333vw;
        line-height: 1.4;
        margin-bottom: 20px;
        text-align: center;
        position: relative;
    }
    .commitment-point h3 {
        margin-top: 30px;
    }
    .commitment-point .point-desc {
        margin-bottom: 40px;
        font-size: 3.86667vw;
        line-height: 1.8;
    }
}
/* iphone 6/7/8/X */
@media screen and (max-width: 375px) {
    .commitment-point h3:before {
        content: '';
        display: block;
        height: 4px;
        width: 40%;
        position: absolute;
        bottom: 80px;
        left: 30%;
        background: #f18d00;
    }
    .commitment-point .point1 h3 {
        margin-top: 30px;
    }
    .commitment-point .point2 h3 {
        margin-top: 40px;
    }
    .commitment-point .point3 h3 {
        margin-top: 40px;
    }
    .commitment-point .point1 h3:before {
        background: #fdeacc;
    }
    .commitment-point .point2 h3:before {
        background: #d0e5d0;
    }
    .commitment-point .point3 h3:before {
        background: #cce1f1;
    }
}


/* ---- [.commitment-point] ---- */

@media screen and (min-width: 768px) { /* pc size */
    .commitment-point .point-cont {
        position: relative;
    } 
    .commitment-point .point1 {
        position: absolute;
        max-width: 1200px;
        padding-left: 574px;
        padding-top: 64px;
    }
    .commitment-point .point2 {
        position: absolute;
        max-width: 1200px;
        padding-left: 654px;
        padding-top: 324px;
    }
    .commitment-point .point3 {
        position: absolute;
        max-width: 1200px;
        padding-left: 748px;
        padding-top: 600px;
    }
}
@media screen and (min-width: 768px) and (max-width: 1368px) {
    .commitment-point {
        margin: 0 auto;
        text-align: center;
    }
    .commitment-point .point1 {
        display: inline-block;
        max-width: 100%;
        padding-left: calc(100% * 592 / 1368 );
    }
    .commitment-point .point2 {
        display: inline-block;
        max-width: 100%;
        padding-left: calc(100% * 674 / 1368 );
    }
    .commitment-point .point3 {
        display: inline-block;
        max-width: 100%;
        padding-left: calc(100% * 778 / 1368 );
    }
}
@media screen and (min-width: 768px) and (max-width: 1124px) {
    .commitment-point .point2 {
        display: inline-block;
        max-width: 100%;
        padding-left: calc(100% * 684 / 1368 );
    }
    .commitment-point .point3 {
        display: inline-block;
        max-width: 100%;
        padding-left: calc(100% * 800 / 1368 );
    }
}

/*  scene-area ご利用シーンエリア
--------------------------------------------- */

.scene-title { max-width: 489px; margin: 40px 0; }
.scene-cont .title-adjust {
    margin-bottom: 15px;
}
.scene-cont p { line-height: 1.8; }
.scene1_1 { max-width: 178px; }
.scene1_2 { max-width: 178px; }
.scene1_3 { max-width: 178px; }

.scene-image .u-inner {
    position: relative;
}
.scene1 {
    background: url(../img/top/scene-back1.jpg) bottom center no-repeat;
    height: 620px;
}
.scene2 {
    background: url(../img/top/scene-back2.jpg) bottom center no-repeat;
    height: 620px;
}
.scene3 {
    background: url(../img/top/scene-back3.jpg) bottom center no-repeat;
    height: 620px;
}
.scene4 {
    background: url(../img/top/scene-back4.jpg) bottom center no-repeat;
    height: 620px;
}

/* ---- [.scene-cont] ---- */

.scene-cont {
    display: inline-block;
    background-color: rgba(255,255,255, 0.94);
    padding: 30px;
    margin-top: 30px;
}
@media screen and (min-width: 768px) { /* pc size */
    .scene-cont {
        width: 500px;
    }
}
@media screen and (max-width: 767px) { /* sp size */
    .scene-cont {
        margin-top: 50px;
        font-size: 3.86667vw;
    }
    .scene-cont h3 {
        font-size: 5.86667vw;
    }
}

.scene2 .u-inner,
.scene4 .u-inner {
    text-align: right;
}
.scene1 .scene-cont,
.scene2 .scene-cont,
.scene3 .scene-cont,
.scene4 .scene-cont {
    text-align: center;
}

/* ---- [.bento-position-area] ---- */

@media screen and (min-width: 768px) { /* pc size */
    .bento-position-area ul {
        position: absolute;
        top: 360px;
    }
    .bento-position-area .position-scene1 li,
    .bento-position-area .position-scene2 li,
    .bento-position-area .position-scene3 li,
    .bento-position-area .position-scene4 li {
        width: 280px;
        height: 280px;
        display: inline-block;
        position: relative;
        border: 4px solid #84ccc9;
        background-color: #fff;
        padding-top: 40px;
        margin-right: 10px;
        text-align: center;

        border-radius: 280px;
        -webkit-border-radius: 280px;
        -moz-border-radius: 280px;
    }
}
@media screen and (max-width: 767px) { /* sp size */
    .bento-position-area ul {
        position: absolute;
        top: 500px;
        left: 50%;
        transform: translate(-50%, -50%);
        -webkit-transform: translate(-50%, -50%);
        -ms-transform: translate(-50%, -50%);

        width: 280px;
        height: 280px;

        border: 4px solid #84ccc9;
        background-color: #fff;

        border-radius: 280px;
        -webkit-border-radius: 280px;
        -moz-border-radius: 280px;
    }
    .bento-position-area li {
    }
    .bento-position-area img {
        margin: 34px auto 5px;
    }
    .slider {
        text-align: center;
        margin: 0 auto;
    }
}

/* ---- [.position-scene] ---- */

@media screen and (min-width: 768px) { /* pc size */
    .bento-position-area .position-scene1 p,
    .bento-position-area .position-scene2 p,
    .bento-position-area .position-scene3 p,
    .bento-position-area .position-scene4 p {
        position: absolute;
        width: 280px;
        top: 226px;
        color: #df043a;
        font-weight: bold;
        margin: 0 auto;
        vertical-align: bottom;

        left: 50%;
        transform: translate(-50%, -50%);
        -webkit-transform: translate(-50%, -50%);
        -ms-transform: translate(-50%, -50%);

        }

    .bento-position-area .position-scene1,
    .bento-position-area .position-scene3 {
        right: 0%;
        transform: translateX(0%);
        -webkit-transform: translateX(0%);
        -ms-transform: translateX(0%);
    }
    .bento-position-area .position-scene2,
    .bento-position-area .position-scene4 {
        left: 0%;
        transform: translateX(0%);
        -webkit-transform: translateX(0%);
        -ms-transform: translateX(0%);
    }

    .t-scene1 { text-align: right; }
    .t-scene2 { text-align: left; }
    .t-scene3 { text-align: right; }
    .t-scene4 { text-align: left; }
}
@media screen and (max-width: 767px) { /* sp size */
    .t-scene1,
    .t-scene2,
    .t-scene3,
    .t-scene4 { text-align: right; }
}

.annotation-image {
    color: #777;
    margin-top: 30px;
}

/* ---- [.case-block] ---- */

.case-block-scene1 { background-color: #f2faf9; }
.case-block-scene3 { background-color: #f2fafe; }

@media screen and (min-width: 768px) { /* pc size */
    .case-block {
        padding: 20px 40px;
    }
    .case-block li {
        display: inline-block;
        vertical-align: middle;
        width: 60%;
    }
    .case-block li.case-block-image { 
        width: 40%;
        display: inline-block;
        margin: 0 auto;
    }
    .case-block img { max-width: 360px; padding-right: 20px; }
}
@media screen and (max-width: 767px) { /* sp size */
    .case-block {
        padding-top: 20px;
        padding-bottom: 20px;
        font-size: 3.86667vw;
    }
    .case-block img {
        margin-bottom: 10px;
    }
}

/* ---- [.case-title] ---- */

.case-title {
    font-size: 30px;
    color: #309d98;
    margin-bottom: 14px;
    padding-bottom: 8px;
    border-bottom: 4px solid #84ccc9;
}
.case-scene3 .case-title {
    color: #4f849d;
    border-bottom: 4px solid #7ecef4;
}
.case-company {
    margin-bottom: 20px;
    font-size: 26px;
}
.case-other-message {
    line-height: 2;
    margin-bottom: 40px;
}
.customerLink {
	
}
@media screen and (min-width: 768px) { /* pc size */
	.customerLink img {
		width: 720px;
		position:relative;
		top:0;
	}
	.customerLink img:hover {
		top:3px;
		transition:0.3s;
		opacity: 0.8;
	}
}
@media screen and (max-width: 767px) { /* sp size */
    .case-title {
        font-size: 6.23333vw;
        margin-top: 20px;
    }
    .case-company {
        font-size: 5.83333vw;
    }
    .case-other-message {
        margin-top: 30px;
        line-height: 1.6;
    }
	.customerLink img {
		width: 480px;
	}
}


/*  flow-area お弁当が届くまでの流れ
--------------------------------------------- */

#flow-area {
    margin: 40px 0;
}

/* ---- [.title-top-desc] ---- */

.title-top-desc {
    font-size: 20px;
    font-weight: bold;
    color: #FFF;
    width: 100%;
    display: inline-block;
    text-align: center;
    background-color: #2b9f7d;
    padding: 18px;

    border-radius: 40px;
    -webkit-border-radius: 40px;
    -moz-border-radius: 40px;
}
@media screen and (max-width: 767px) { /* sp size */
    .title-top-desc {
        font-size: 4.46667vw;
        padding: 12px;
    }
}

/* ---- [.flow-main-title] ---- */

.flow-main-title {
    font-family: "Ryumin ExBold";
    margin: 10px ;
}
@media screen and (max-width: 767px) { /* sp size */
    .flow-main-title {
        margin-top: 15px ;
    }
}

/* ---- [.step] ---- */

#flow-area .step {
    font-family: "DIN Bold";
    color: #df043a;
    font-size: 24px;
}
#flow-area .step .step-number {
    font-size: 32px;
}
#flow-area .triangle {
  width: 0;
  height: 0;
  border-left: 13px solid transparent;
  border-right: 13px solid transparent;
  border-bottom: 17px solid #2b9f7d;
  margin: 0 auto;
}
.arrow {
  width: 24px;
  height: 24px;
  border: 4px solid;
  border-color:  transparent transparent #565656 #565656;
  transform: rotate(-45deg);
  margin: 0 auto;
  margin-bottom: 30px;
}

/* ---- [.step-box] ---- */

#flow-area .step-box {
    border: 3px solid #2b9f7d;
    padding: 40px 20px;

    border-radius: 8px;
    -webkit-border-radius: 8px;
    -moz-border-radius: 8px;
}
@media screen and (max-width: 767px) { /* sp size */
    #flow-area .step-box {
        padding: 20px 20px;
    }
    #flow-area .step-box .sub-contents-title {
        font-size: 4.66667vw;
        line-height: 1.5;
    }
    #flow-area .step-box .order-btn a {
        width: 100%;
    }
}

/* ---- [.tel] ---- */

#flow-area .step-box .tel-title {
    font-size: 18px;
    margin: 26px 0 20px;
}
#flow-area .tel-size { max-width: 400px; }
#flow-area .tel-time {
    border-top: 1px dotted #ccc;
    margin-top: 10px;
    padding-top: 10px;
    font-size: 14px;
}
@media screen and (max-width: 767px) { /* sp size */
    #flow-area .tel-time {
        font-size: 3.26667vw;
    }
}

/* ---- [.yellow-box] ---- */

#flow-area .yellow-box {
    padding: 20px;
    margin-top: 10px;
    background-color: #fffabc;
}
@media screen and (max-width: 767px) { /* sp size */
    #flow-area .yellow-box {
        font-size: 3.46667vw;
    }
}

/* ---- [.step-wide] ---- */

#flow-area .step-wide {
    border-top: 1px dotted #ccc;
    padding-top: 30px;
}
.flow-image1,
.flow-image2 { width: 320px; }

.step-wide .two-block {
    width: 100%;
}
@media screen and (min-width: 768px) { /* pc size */
    .step-wide .two-block li {
        display: inline-block;
        vertical-align: top;
        width: 70%;
        text-align: left;
    }
    .step-wide .two-block li:first-child {
        width: 30%;
        text-align: center;
    }
    .step-wide .two-block img {
        padding-right: 20px;
    }
    .step-wide .two-image-block li {
        display: inline-block;
        vertical-align: top;
        width: 50%;
        border-left: 1px dotted #ccc;
    }
    .step-wide .two-image-block li:first-child {
        border-left: 0;
    }
}
@media screen and (max-width: 767px) { /* sp size */
    #flow-area .step-wide {
        padding-top: 20px;
    }
    .step-wide .two-image-block li {
        border-top: 1px dotted #ccc;
        margin-top: 20px;
        padding-top: 20px;
    }
    .step-wide .two-image-block li:first-child {
        border-top: 0;
        margin-top: 0;
        padding-top: 0;
    }
    .step-wide p {
	    font-size: 3.86667vw;
    }
}
.step-wide .two-block img {
    margin: 0 auto;
}
.step-wide .two-image-block img {
    margin: 10px 0 20px;
}

/*  footer
--------------------------------------------- */
.login-logo {
    width: 72px;
    margin: 0 auto;
}
@media screen and (max-width: 767px) {
    .login-logo {
        width: 14.4vw;
    }
}
.login-logo__link {
    display: block;
    overflow: hidden;
    padding-top: 208px;
    width: 100%;
    background: url(../img/common/login-logo.svg) 0 0 no-repeat;
    background-size: 100% auto;
    text-indent: -9999px;
}
@media screen and (max-width: 767px) {
    .login-logo__link {
        padding-top: 38.33333vw;
    }
}

.layout--login,
.layout--regist,
.layout--post {
    text-align: center;
}
.layout--login input[type="text"],
.layout--regist input[type="text"],
.layout--login input[type="password"],
.layout--regist input[type="password"]
 {
    display: inline-block;
    margin: 0 0 10px;
}
.input--text--login {
    width: 300px;
}
.input--text--name {
    width: 400px;
}
@media screen and (max-width: 767px) {
    .input--text--login {
        width: 82.8888vw;
    }
    .input--text--name {
        width: 82.8888vw;
    }
}
#attachment-img { margin-bottom: 20px; }
#attachment-img img {
    width: 280px;
}
input.submit,
input.delete {
    /*background: url("../images/contact/btn_check_bg.jpg") repeat-x;*/
    font-size: 1.0em;
    font-weight: bold;
    color: #FFF;
    width: 300px;
    display: inline-block;
    text-align: center;
    vertical-align: middle;
    background-color: #68964B;
    border: 0;
    padding: 10px;
}
input.delete {
    background-color: #AD5332;
}
@media screen and (max-width: 767px) {
    input.submit,
    input.delete {
        width: 82.8888vw;
        margin-bottom: 10px;
    }
}
.layout--list .cmn-tbl input.submit {
    width: 100px;
    padding: 6px;
    background-color: #4B968A;
}
input.submit:hover {
    background-color: #447426;
    cursor: pointer;
}
input.delete:hover {
    background-color: #80351A;
    cursor: pointer;
}
.layout--list .cmn-tbl input.submit:hover {
    background-color: #215D54;
}
textarea.coupon {
    width: 400px;
    padding: 10px;
    margin: 0 auto;
}
@media screen and (max-width: 767px) {
    textarea.coupon {
        width: 82.8888vw;
    }
}
.form_basic {
    margin: 0 auto;
}
.err {
    color: red;
    display: block;
    margin-top: 10px;
    font-weight: bold;
}
.annotation {
    display: block;
    margin-top: 10px;
}
.post-btn {
    text-align: center;
    margin-bottom: 40px;
}
.cat-list li {
    display: inline-block;
}
/* ---------------------------------------------
*   cmn-tbl
--------------------------------------------- */
.cmn-tbl {
    width: 100%;
    font-size: 14px;
    border-collapse: collapse;
}
.cmn-tbl th {
    padding: 15px;
    text-align: center;
    vertical-align: top;
    color: #333;
    background-color: #fafafa;
    border: 1px solid #eee;
    vertical-align: middle;
    text-align: center;
    font-weight: bold;
}
.cmn-tbl td {
    padding: 15px;
    background-color: #fff;
    border: 1px solid #eee;
    vertical-align: middle;
    text-align: center;
    line-height: 1.5;
}
@media screen and (max-width: 767px) {
    .scroll {
        overflow-x: auto;
    }
    .cmn-tbl {
    min-width: 727px;
    margin: 0 10px 30px;
    }
}

/* ---------------------------------------------
*   pagination
--------------------------------------------- */
#page nav {
    display: flex;
    justify-content: center;
    margin-top: 1em;
    padding-top: .5em;
    font-size: 14px;
}
#page .pagination {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
}
#page .pagination li {
    margin: 0 1px;
}
#page .pagination a {
    display: block;
    padding: .5em 1em;
    border: 1px solid #68964B;
    border-radius: .2em;
    text-decoration: none;
}
#page .pagination a[aria-current="page"] {
    background-color: #68964B;
    color: #fff;
}

.c-ttl3__jp {
    border-bottom: 1px solid #68964B;
    padding-bottom: 5px;
    margin-bottom: 20px;
}