@charset "UTF-8";
@font-face {
    font-family: 'Noto Sans Japanese';
    font-style: normal;
    font-weight: 400;
    src: url(//fonts.gstatic.com/ea/notosansjapanese/v6/NotoSansJP-Regular.woff2) format('woff2'),
    url(//fonts.gstatic.com/ea/notosansjapanese/v6/NotoSansJP-Regular.woff) format('woff'),
    url(//fonts.gstatic.com/ea/notosansjapanese/v6/NotoSansJP-Regular.otf) format('opentype');
}
@font-face {
    font-family: 'Noto Sans Japanese';
    font-style: normal;
    font-weight: 500;
    src: url(//fonts.gstatic.com/ea/notosansjapanese/v6/NotoSansJP-Medium.woff2) format('woff2'),
    url(//fonts.gstatic.com/ea/notosansjapanese/v6/NotoSansJP-Medium.woff) format('woff'),
    url(//fonts.gstatic.com/ea/notosansjapanese/v6/NotoSansJP-Medium.otf) format('opentype');
}

/*閉鎖*/
.main_visual{
    position: relative;
}
.end_box_o{
    position: relative;
    max-width: none!important;
}

.end_box_o img{
/*    max-width: 1080px!important;*/
}

.end_box {
    background: rgba(0,119,73,0.9);
    text-align: center;
    font-weight: bold;
    color: #fff;
/*    padding: 5% 0;*/
    position: absolute;
    top: 0;
    width: 100%;
    height: 100%;
}

.end_box p {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    width: 100%;
    font-size: 200%;
}

@media screen and (max-width:767px){
    .end_box p{
        font-size: 110%;
        padding: 0 0.5em;
    }
}


/* common */
#cp_main {
	font-family: "Noto Sans JP", sans-serif;
	margin-top: 70px;
}
#cp_main h1 {
	font-size: 150%;
}
#cp_main h2 {
	font-size: 130%;
}
.tl{
    text-align: left;
    display: inline-block;
    margin: 20px auto 30px auto;
    line-height: 1.5!important;
}

.tl span{
    border-bottom: 1px solid #fff;
    display: block;
    margin-bottom: 10px;
    padding-bottom: 5px;
}

#join_top .btn-primary{
    background: #fff!important;
    color: #007749;
}

#join_bottom .btn-primary{
    background: #007749!important;
    color: #fff;
}

#entry .btn-primary{
    background: #007749!important;
    color: #fff;
}

#cp_main #join_top,
#cp_main #share,
#cp_main #target{
/*	background-color: #007749!important;*/
    color: #fff!important;
}

#join_top .text-muted{
    color: #fff!important;
    font-weight: bold;
    
    font-size: 110%;
}

#note .text-muted,
#note h3{
/*    color: #000!important;*/
}
#note h3{
/*    border-color: #007749!important;*/
}

#present{
    background-color: #fff;
    color: #007749!important;
}

#entry,
#join_bottom{
    background-color: #fff;
}

.text-danger{
    color: #fff;
}

#entry .text-danger{
    color: #fff;
}

#entry .receipt-image{
    color: #000;
}

.receipt-ng .text-danger{
/*    color: #fff!important;*/
}

.bg_color{
    background: linear-gradient(131deg, #07BA66 21.78%, #007749 49.16%, #012A1A 100%);
    color: #fff;
}

#entry .list-group-item{
    background-color: #fff !important;
    color: #000;
    
    display: grid;
    grid-template-rows: subgrid;
    grid-row: span 4;
    margin: 0 auto;
}

#entry .list-group{
    display: grid!important;
    grid-template-columns: repeat(4, 1fr);
}

#entry .list-group-item .image.text-center {
    align-content: center;
}

#entry .list-group-item .image.text-center .btn:not(:disabled):not(.disabled) {
    cursor: auto;
}

#entry .step_box li .image img{
    width: 90%;
    max-width: 200px;
}

#entry .list-group-item.step2{
    border-right: none;
    border-left: none;
}

#entry .list-group-item.step3{
    border-right: none;
}

@media screen and (max-width:767px){
    #entry .list-group-item{
        display: block;
    }

    #entry .list-group{
        display: block!important;
    }
    #entry .list-group-item.step2{
        border-right: 1px solid rgba(0,0,0,.125);
        border-left: 1px solid rgba(0,0,0,.125);
    }

    #entry .list-group-item.step3{
        border-right: 1px solid rgba(0,0,0,.125);
    }
}


#cp_main nav a img {
/*    filter: brightness(0) saturate(100%) invert(100%) sepia(13%) saturate(246%) hue-rotate(84deg) brightness(111%) contrast(100%);*/
}

#present .container,
#target .container{
    max-width: 1500px;
}

#cp_main #present .present_title {
    font-size: 200%!important;
    font-weight: bold;
    margin-bottom: 0.5em;
}

.present_title br.sp,
.target_title br.sp,
.pickup_text br.sp{
    display: none;
}

#cp_main #present .present_koukan {
    line-height: 1.8!important;
    font-size: 100%!important;
}
#cp_main #present .present_koukan span {
    font-size: 110%;
    font-weight: bold;
}

.present_flex{
/*
    display: flex;
    justify-content: space-between;
*/
    display: block;
}

.present_flex ul:first-child{
/*    width: 78%;*/
    width: 100%;
    margin: 0 auto;
    padding: 0;
}

.present_flex ul:last-child{
/*    width: 20%;*/
    width: 100%;
    background: #fff;
    padding: 1.5em;
    color: #000;
    border: 1px solid #000;
    margin-top: 20px;
}

.present_flex li{
    list-style: none;
}

.present_min {
    font-size: 80%;
    color: #000;
    border-top: 1px solid #ccc;
    padding-top: 20px;
    margin-top: 20px;
}

.pre_img,
.pre_img_1357{
    width: 100%;
}

.pre_img_1357{
    display: none;
}

@media screen and (max-width:767px){
    .pre_img_1357{
        display: inherit!important;
    }
    .pre_img{
        display: none;
    }
}

#cp_main nav a img,
#cp_main #entry .list-group-item .image img,
#cp_main #entry .receipt-image p img{
    filter: brightness(0) saturate(100%) invert(30%) sepia(83%) saturate(992%) hue-rotate(123deg) brightness(89%) contrast(101%);
}

#cp_main #entry .list-group-item h4 img{
    filter: brightness(0) saturate(100%)
}

#entry .receipt-image .text-danger{
    color: #007749!important;
}



.disc,
.asterisk{
    display: block;
    text-indent: -1em;
    margin-left: 1em;
}

.disc::before{
    content: '・'
}
.asterisk::before{
    content: '※'
}

.target_box{
    text-align: center;
}

.target_title{
    font-size: 100%;
}

.target_title strong{
    font-size: 200%;
    display: block;
    word-break: break-word;
}

.pickup{
    background: #fff;
    text-align: center;
    color: #007749;
    padding: 20px 0;
    margin-top: 40px;
}

.pickup_title{
    font-size: 230%!important;
    font-weight: bold;
    word-break: break-all;
    color: #007749!important;
    margin: 0;
}

.pickup_text{
    font-size: 120%!important;
    color: #000!important;
}

.pickup_text span{
    font-size: 150%;
    font-weight: bold;
}

.pickup ul{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    padding: 0 30px;
}

.pickup li{
    list-style: none;
/*    padding: 0 10px;*/
    width: 23%;
}

.pickup li:first-child {
/*    width: 28.7%;*/
}

.pickup li img{
    width: 100%;
}

.pickup li span:last-child{
    background: #007749;
    display: block;
    width: 100%;
    margin: 20px auto auto auto;
    color: #fff;
}

.pickup li span:last-child a{
    color: #fff;
    text-decoration: none;
    padding: 10px;
    display: block;
    width: 100%;
    height: 100%;
}

.pickup small {
    color: #000;
    text-align: right;
    width: 100%;
    display: inline-block;
    padding-right: 20px;
}

.main_visual{
/*    max-width: 1080px;*/
    margin: 0 auto;
}

#join_bottom .red_box{
    border: 3px solid red;
    color: red;
    padding: 20px;
    font-size: 98%;
    font-weight: bold;
    margin-bottom: 30px;
}

#join_bottom .red_box p,
#join_top .early_box p{
    padding: 0;
    margin: 0;
}


#join_top .early_box{
    background: red;
    color: #fff;
    text-align: center;
/*    font-weight: bold;*/
    font-size: 120%;
    padding: 1em;
    margin-bottom: 50px;
}

.btn-primary:not(:disabled):not(.disabled).active:focus,
.btn-primary:not(:disabled):not(.disabled):active:focus,
.show>.btn-primary.dropdown-toggle:focus,
.btn-primary.focus, .btn-primary:focus {
	box-shadow: 0 0 0 0.2rem rgba(0, 119, 73, 0.5);
}

#present .item,
#entry .detail,
#entry .receipt-title,
.btn-primary {
	border-color: #007749 !important;
}

#entry h2,
#entry h3,
#entry .receipt-ok h4,
#note h3,
#join_bottom h2,
#contact h2,
#share h2:after,
#contact h2:after {
	color: #007749;
}

@media screen and (max-width:767px){
    #cp_main #present .present_title {
        font-size: 170% !important;
        text-align: center;
    }
    
    .present_title br.sp,
    .target_title br.sp,
    .pickup_text br.sp{
        display: inherit;
    }
    
    .pickup_text span{
        font-size: 125%;
    }
    
    .present_flex{
        display: block;
    }

    .present_flex ul:first-child{
        max-width: 500px;
        width: 100%;
    }

    .present_flex ul:last-child{
        max-width: 500px;
        width: 100%;
        margin: 30px auto auto auto;
    }

    .present_min {
        width: 95%;
        margin: 20px auto auto auto;
    }
    
    .pickup ul{
        padding: 0 20px;
    }
    
    .pickup li{
        width: 48%;
        margin-bottom: 40px;
    }

    .pickup li:first-child {
/*        width: 100%;*/
    }
    
    .pickup li:last-child {
         margin-bottom: 0;
    }
    
    .target_title strong{
        font-size: 165%;
    }
}

@media screen and (max-width:575px){
    #cp_main #present .title {
        font-size: 140% !important;
        margin-top: 20px;
    }
    #cp_main #present .text{
        font-size: 110%!important;
    }
}

/* md and up */
@media (min-width: 768px) {
	#cp_main h1 {
		font-size: 200%;
	}
	#cp_main h2 {
		font-size: 180%!important;
	}
}