@charset "utf-8";
/*PCSP共通設定*/
section:nth-of-type(odd) {
    background-color: #fff;
}
section:nth-of-type(even) {
    background-color: #FDEFE6;
}

.pt10{
	padding-top: 10px !important;
}

.copy{
	text-align: right;
	margin: 10px 0 0 0;
	font-size: 95%;
}

.model{
	 background-color: #FDEFE6 !important;
}

html {
    scroll-behavior: smooth;
}

main{margin-top: 0 !important;}

.anpanimg{
	max-width: 970px;
	width: 95%;
	margin: 0px auto 50px;
}

.anpanimg img{
	width: 100%;
}

	.topNavi ul li a span{
		color: #ffffff !important;
		background-color: #FF0004;
		padding: 5px;
	}

.bnL{
	margin: 0 0 0 0;
}
.bnL a{
	display: block;
	text-align: center;
	font-size: 16px;
	font-weight: bold;
}

.bnL img{
	display: block;
	max-width: 620px;
	width: 100%;
	margin: 0 auto 10px;
}


/*smooth scroll*/
/*759px以下*/
@media screen and (max-width: 759.9px) {
	
	.bnL a{
	display: block;
	text-align: center;
	font-size: 14px !important;
}
	
	.top_topic{
		margin: 0 0 50px 0;
	}
	
	.top_topicbox{
		margin: 0 0 30px 0;
		padding: 10px;
		border-radius: 10px;
		background-color: #ffffff;
		 box-shadow: 3px 3px #0066cc;
	}
	
	.top_topicbox:last-of-type{
		margin: 0 0 0 0 !important;
	}
	
	
		
	.top_topicbox_tit{
    display: flex;
    align-items: center;
    padding: .5em .7em;
    background-color: #fffdeb;
    color: #333333;
		font-size: 20px;
		font-weight: bold;
		margin: 0 0 20px 0;
}

.top_topicbox_tit::before {
    display: inline-block;
    width: 5px;
    height: 1.5em;
    margin-right: .5em;
    background-color: #0066cc;
    content: '';
}
	
	.top_topicbox_in{
		/*display: flex;
		justify-content: space-between;*/
	}
	
	.top_topicbox_img{
		max-width: 400px;
		margin: 0 0 20px 0;
		
	}
	
	.top_topicbox_img img{
		width: 100%;
	}
	
	.top_topicbox_detail{
		margin: 0px 0 0 0;
	}
	
	.top_topicbox_detail p{
		font-size: 14px;
	}
	
	
    .logodetail {
        background-color: #FFFFD9;
        padding: 10px;
        margin: 30px 0;
    }
    .logotit {
        font-size: 16px;
        color: #FF0004;
        margin: 0 0 15px 0;
        text-align: center;
        font-weight: bold;
    }
    .logodetail ul {
        /*display: flex;
		justify-content:flex-start;
		align-items: center;*/
    }
    .logomark {
        width: 30%;
        margin: 0 auto 15px;
    }
    .logomark img {
        width: 100%;
    }
    .logotxt {
        font-size: 12px;
        line-height: 1.5;
    }
	
	
	.kippu{
		margin: 20px auto 0;
		max-width: 418px;
		width: 100%;
	}
	
	.kippu img{
		width: 100%;
	}

	
    .introbox {
        padding: 10px;
        background: #FFFFD9;
		margin: 30px 0 30px 0;
    }
	
	
    .introboxtit {
        color: #C457FC;
        font-weight: bold;
        font-size: 16px;
        margin: 0 0 0 0;
        text-align: center;
    }
    .introboxtxt {
        font-size: 14px;
        margin: 10px 0 0 0;
        text-align: center;
    }
	
	.introboxtxt2{
        font-size: 14px;
        margin: 10px 0 0 0;
		text-indent: -1em;
		padding-left: 1em;
    }
	
    .introboxtxt b {
        font-size: 18px;
    }
    .intrologoarea {
        margin: 0 0 15px 0;
        /*display: flex;
		align-items: center;*/
    }
    .intrologo {
        width: 100%;
        margin: 0 auto 10px;
        max-width: 400px;
    }
    .intrologo img {
        width: 100%;
    }
    .introtit {
        font-size: 18px;
        font-weight: bold;
        text-align: center;
    }
    .introtit .minitxt {
        font-size: 12px;
    }
	  .introtit2 {
        font-size: 18px;
        font-weight: bold;
		background-color: #0B449C;
		padding: 10px;
		color: #ffffff;
		text-align: center;
    }
    .introtit2 .minitxt {
        font-size: 12px;
    }
	
    #wrapper {
        line-height: 1.4;
    }
    .spnone {
        display: none;
    }
    /* CSS */
    #dirPathBlock,
    #anchorLinkBlock {
        font-size: 10px;
        margin: 1% 1% 0 1%;
    }
    #dirPathBlock p,
    #anchorLinkBlock a {
        font-size: 12px;
    }
    h1 {
        font-size: 12px;
        margin: 0 1%;
    }
    h2 {
        padding: 1rem 2rem;
        border-bottom: 3px solid #00458C;
        background: #0066cc;
        border-radius: 10px 10px 0 0;
        font-size: 153.9%;
        color: #fff;
        text-align: center;
        margin: 0 0 30px 0;
    }
    .inner {
        width: 98%;
        margin: 0 auto;
        padding: 4% 1%;
    }
	
	.model_btn{
		max-width: 760px;
		width: 98%;
		margin: 0 auto;
	}
	
	.model_btn img{
		width: 100%;
	}
	
    /*title*/
    .titlePc {
        display: none !important;
    }
    /*スライド*/
    .titleSp {
        position: relative;
        width: 100% !important;
        text-align: center;
        background-size: 211%;
        margin: 0 auto;
        max-width: 1000px;
        overflow: hidden;
    }
    .slide {
        position: relative;
        width: 100%;
        height: 300px;
        overflow: hidden;
    }
    .slide-image {
        background-position: center;
        background-repeat: no-repeat;
        background-size: cover;
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        opacity: 0;
        animation: slider-1 24s linear infinite;
    }
    .slide-image:nth-child(1) {
        background-image: url(../images/mv_sp_1.jpg);
        animation-delay: -2s;
    }
    .slide-image:nth-child(2) {
        background-image: url(../images/mv_sp_2.jpg);
        animation-delay: 6s;
    }
    .slide-image:nth-child(3) {
        background-image: url(../images/mv_sp_3.jpg);
        animation-delay: 14s;
    }
    .titleSp img {
        width: 100%;
    }
    @keyframes slider-1 {
        0% {
            opacity: 0;
            transform: scale(1);
        }
        4.16% {
            opacity: 1;
        }
        33.33% {
            opacity: 1;
        }
        41.66% {
            opacity: 0;
            transform: scale(1.2);
        }
        100% {
            opacity: 0;
        }
    }
    h3 {
        position: relative;
        padding: 0 0.5rem 0.5rem;
        text-align: center;
        font-size: 153.9%;
        margin-bottom: 3%;
    }
    h3:after {
        position: absolute;
        bottom: 0;
        left: 0;
        width: 100%;
        height: 3px;
        content: '';
        border-radius: 3px;
        background-image: -webkit-gradient(linear, right top, left top, from(#00458C), to(#0066cc));
        background-image: -webkit-linear-gradient(right, #00458C 0%, #0066cc 100%);
        background-image: linear-gradient(to left, #00458C 0%, #0066cc 100%);
    }
    a:hover img {
        opacity: 0.8;
        filter: progid:DXImageTransform.Microsoft.Alpha(Enabled=1, Style=0, Opacity=80);
    }
    #anchorLinkBlock p.pageBackBlock {
        font-size: 11px !important;
        padding: 1%;
    }
    p.text {
        font-size: 123.1%;
        font-weight: bold;
        text-align: center;
        margin: 5% 0 2% 0;
    }
    p.attention {
        font-size: 123.1%;
        width: 96%;
        margin: 2% 2% 5% 2%;
        border: 2px #F00 solid;
        padding: 2%;
        background: #FFF;
    }
    .b_txtcenter {
        text-align: center !important;
        font-weight: bold !important;
        color: #FF0004 !important;
    }
    .borderBox {
        display: inline-block;
        padding: 4% 5%;
        border: solid 3px #1048e0;
        position: relative;
        font-size: 123.1%;
    }
    .borderBox:after {
        content: "";
        border: solid 1px #1048e0;
        position: absolute;
        top: 3px;
        left: 3px;
        width: calc(100% - 6px);
        height: calc(100% - 6px);
    }
    .borderBox strong {
        background: linear-gradient(transparent 60%, #ffff66 0%);
        display: inline-block;
    }
    .unit {
        width: 98%;
        margin: 4% 1% 3%;
        text-align: left;
        background: #FFF;
        padding: 4% 3%;
        border: 2px solid #EEE;
        box-shadow: 0px 0px 10px 0px rgba(10, 10, 10, 0.1), 0px 1px 0px 0px rgba(0, 0, 0, 0.02);
    }
    .unit span {
        font-size: 123.1%;
        font-weight: bold;
        color: #0070c0;
    }
    .unit span b {
        font-size: 14px !important;
    }
    .unit img {
        width: 100%;
        text-align: center;
        margin: 2% 0;
    }
    .unit .detail {
        font-size: 123.1%;
        line-height: 1.5;
    }
    .message {
        width: 80%x;
        margin: 4% 10%;
        font-size: 100%;
        text-align: center;
        background: #EBEBEB;
        padding: 8% 0;
        border-radius: 0.5em;
    }
    .textLeft {
        font-size: 123.1%;
        text-align: left;
    }
    .catch {
        font-size: 123.1%;
        text-align: center;
        font-weight: bold;
    }
    .catch .red {
        color: #FF0000;
    }
    .catch .blue {
        color: #0033cc;
    }
    .catch .green {
        color: #009966;
    }
    .bannertxtarea {
        width: 100%;
        margin: 30px auto 0;
    }
    .bannertit {
        font-size: 18px;
        font-weight: bold;
        margin: 0 0 10px 0;
        color: #c6021a;
    }
    .bannertxt {
        font-size: 14px;
        line-height: 1.8;
        margin: 0 0 10px 0;
    }
    .bannerBox {
        max-width: 950px;
        margin: 0 auto;
    }
    .bannerBox img {
        margin-top: 5%;
        width: 100%;
    }
    /* =========================================================
◆navigation
========================================================= */
        .topNavi {
            background-color: #ffff66;
        }

        .topNavi ul {
           /* display: grid;
            grid-template-columns: repeat(2, 1fr);*/
			display: flex;
			justify-content: space-between;
			flex-wrap: wrap;
            list-style: none;
            padding: 0;
            margin: 0;
        }

        .topNavi ul li {
            border-left: 1px dashed rgba(0, 0, 0, 1);
			 border-bottom: 1px dashed rgba(0, 0, 0, 1);
            padding: 10px;
            text-align: center;
            font-size: 14px;
			width: 50%;
        }
	
	.topNavi ul li:nth-child(2n){
		 border-left: 1px dashed rgba(0, 0, 0, 1);
		 border-right: 1px dashed rgba(0, 0, 0, 1);
	}

/*.topNavi ul li:last-child{
		width: 100%;
	border-right: 1px dashed rgba(0, 0, 0, 1);
	}*/
	
/* 均等の場合のborder
		    .topNavi ul li:nth-child(-n+8) {
            border-bottom: 1px dashed rgba(0, 0, 0, 1);
        }
	        .topNavi ul li:nth-child(even) {
            border-right: 1px dashed rgba(0, 0, 0, 1);
        }*/
/* 7と8を結合した場合のborder*/
	  /*  .topNavi ul li:nth-child(-n+7) {
            border-bottom: 1px dashed rgba(0, 0, 0, 1);
        }
	
        .topNavi ul li:nth-child(2),.topNavi ul li:nth-child(4),.topNavi ul li:nth-child(6),.topNavi ul li:nth-child(7),.topNavi ul li:last-child {
            border-right: 1px dashed rgba(0, 0, 0, 1);
        }*/
	
	

        .topNavi ul li.span-2 {
            grid-column: span 2;
            display: block;
            padding: 10px 0;
        }

        .topNavi ul li a {
            text-decoration: none;
            color: #000;
            display: block;
            height: 100%;
        }
    .topNavi ul li {
        list-style: none;
        font-size: 102.1%;
        font-weight: bold;
        margin: 0;
        display: flex;
        justify-content: center;
        align-items: center;
        flex-direction: row;
    }	
    .topNavi ul li a {
        color: #00b0f0;
        display: contents;
    }
	.span-2 span {
        display: block;
        margin-top: 10px;
    }
    .span-2 strong {
    background: red;
    padding: 5px;
    color: #FFF;
        margin: 0 5px 0 0;
}	
	
    /* =========================================================
◆photoswipe
========================================================= */
    figure {
        position: relative;
        margin-top: 2%;
    }
    figure img {
        width: 100%;
        height: auto;
        padding: 0 2%;
    }
    figure:hover:before {
        position: absolute;
        content: "";
        top: 0;
        left: 0;
        bottom: 0;
        right: 0;
        margin: auto;
        width: 60px;
        height: 60px;
        display: block;
        z-index: 99;
        background: url(../images/ic_zoom.png) no-repeat;
        background-size: 100% auto;
    }
    *, *:before, *:after {
        box-sizing: border-box;
    }
    /* =========================================================
◆slide
========================================================= */
    .slide-wrap {
        background: rgba(255, 255, 255, 0);
        /*背景白を透過*/
        display: flex;
        margin: 0 auto;
        width: 100%;
        overflow-x: scroll;
        -webkit-overflow-scrolling: touch;
        overflow-scrolling: touch;
    }
    .slide-box {
        margin: 3% 3% 0 3%;
        flex: 0 0 80%;
        text-align: center;
        position: relative;
    }
    .coupon_fukidashi {
        position: absolute;
        width: 35%;
        top: -5px;
        left: -5px;
    }
    .coupon_fukidashi img {
        width: 100%;
    }
    .slide-box .areaEast {
        background: #00C33A;
        color: #FFFFFF;
        font-size: 123.1%;
        padding: 2%;
        text-align: center;
    }
    .slide-box .areaMiddle {
        background: #FFB600;
        color: #FFFFFF;
        font-size: 123.1%;
        padding: 2%;
        text-align: center;
    }
    .slide-box .areaWest {
        background: #0099ff;
        color: #FFFFFF;
        font-size: 123.1%;
        padding: 2%;
        text-align: center;
    }
    .slide-box p {
        text-align: left;
        font-size: 123.1%;
        padding-top: 2%;
    }
    .slide-box p span {
        font-weight: bold;
    }
    .slide-box p.point {
        background: #FFFFD9;
        padding: 2%;
        margin-top: 1%;
    }
    .slide-box p.point span {
        color: #F00;
    }
	 .spotbox p.point {
        background: #FFFFD9;
        padding: 2%;
        margin: 0% 1% 1% 1%;
    }
    .spotbox p.point span {
        color: #F00;
    }
	
    .slide-box p.detail {
        line-height: 1.5;
        font-size: 123.1%;
    }
    .detail {
        padding: 10px;
    }
    .detail dl {
        font-size: 123.1%;
        line-height: 1.5;
        padding: 2% 0;
        border-bottom: 1px dotted #333;
        text-align: left;
    }
    .detail dl span {
        font-size: 80%;
    }
    .detail dt {
        clear: left;
        float: left;
        width: 30%;
        font-weight: bold;
    }
    .detail dd {
        margin-left: 30%;
    }
    .detail dl:last-child {
        border-bottom: none;
    }
    p.heed {
        font-size: 123.1%;
        background: #FFF;
        margin: 3% 0;
    }
    .slide-box2 {
        margin: 1% 3% 0 0;
        flex: 0 0 50%;
        text-align: center;
    }
    .slide-box2 img {
        width: 100%;
        image-rendering: -webkit-optimize-contrast;
    }
    .slide-box2 p {
        text-align: left;
        font-size: 123.1%;
        padding: 2% 0;
    }
    .slide-box2 p span {
        font-weight: bold;
    }
    .slide-box2 .Btn {
        overflow: hidden;
        width: 98%;
        margin: 0 1%;
        border-radius: 4px;
        -webkit-border-radius: 4px;
        -moz-border-radius: 4px;
        font-size: 123.1%;
        font-weight: bold;
        display: block;
        position: relative;
        text-align: center;
        color: #333;
        text-decoration: none;
    }
    .slide-box2 .Btn a {
        display: block;
        position: relative;
        text-align: center;
        background: #F60;
        color: #fff;
        text-decoration: none;
        padding: 8% 5%;
    }
    .slide-box2 .Btn a:hover {
        background: #F30;
        /* マウスオーバーカラー */
    }
    .slide-box2 .Btn a:before {
        /*白いひし型 */
        display: block;
        content: "";
        position: absolute;
        -webkit-transform: rotate(45deg);
        transform: rotate(45deg);
        top: 50%;
        left: 10px;
        width: 16px;
        height: 16px;
        margin-top: -8px;
        background: #fff;
    }
    .slide-box2 .Btn a:after {
        /*バックグラウンドと同じ色のひし型をずらして「before要素」を隠す */
        display: block;
        content: "";
        position: absolute;
        -webkit-transform: rotate(45deg);
        transform: rotate(45deg);
        top: 50%;
        left: 5px;
        width: 16px;
        height: 16px;
        margin-top: -8px;
        background: #F60;
    }
    .slide-box2 .Btn a:hover:after {
        /*「after要素」のマウスオーバー（カラーを合わせる） */
        background: #F30;
    }
    .slide-box2 .Btn_gray {
        overflow: hidden;
        width: 98%;
        margin: 0 1%;
        border-radius: 4px;
        -webkit-border-radius: 4px;
        -moz-border-radius: 4px;
        font-size: 123.1%;
        display: block;
        position: relative;
        text-align: center;
        color: #fff;
        text-decoration: none;
        background: #666;
        padding: 8% 5%;
    }
    .slide-box2 .Btn_gray:before {
        /*白いひし型 */
        display: block;
        content: "";
        position: absolute;
        -webkit-transform: rotate(45deg);
        transform: rotate(45deg);
        top: 50%;
        left: 10px;
        width: 16px;
        height: 16px;
        margin-top: -8px;
        background: #fff;
    }
    .slide-box2 .Btn_gray:after {
        /*バックグラウンドと同じ色のひし型をずらして「before要素」を隠す */
        display: block;
        content: "";
        position: absolute;
        -webkit-transform: rotate(45deg);
        transform: rotate(45deg);
        top: 50%;
        left: 5px;
        width: 16px;
        height: 16px;
        margin-top: -8px;
        background: #666;
    }
    /* =========================================================
◆list横並び
========================================================= */
    .itemList3>div {
        float: left;
        width: 100%;
        padding: 2% 0;
    }
    .itemList3>div .Btn {
        overflow: hidden;
        width: 94%;
        margin: 0 3%;
        border-radius: 4px;
        -webkit-border-radius: 4px;
        -moz-border-radius: 4px;
        font-size: 123.1%;
        font-weight: bold;
        display: block;
        position: relative;
        text-align: center;
        color: #333;
        text-decoration: none;
    }
    .itemList3>div .Btn a {
        display: block;
        position: relative;
        text-align: center;
        background: #F60;
        color: #fff;
        text-decoration: none;
        padding: 5%;
    }
    .itemList3>div .Btn a:hover {
        background: #F30;
        /* マウスオーバーカラー */
    }
    .itemList3>div .Btn a:before {
        /*白いひし型 */
        display: block;
        content: "";
        position: absolute;
        -webkit-transform: rotate(45deg);
        transform: rotate(45deg);
        top: 50%;
        left: 15px;
        width: 16px;
        height: 16px;
        margin-top: -8px;
        background: #fff;
    }
    .itemList3>div .Btn a:after {
        /*バックグラウンドと同じ色のひし型をずらして「before要素」を隠す */
        display: block;
        content: "";
        position: absolute;
        -webkit-transform: rotate(45deg);
        transform: rotate(45deg);
        top: 50%;
        left: 10px;
        width: 16px;
        height: 16px;
        margin-top: -8px;
        background: #F60;
    }
    .itemList3>div .Btn a:hover:after {
        /*「after要素」のマウスオーバー（カラーを合わせる） */
        background: #F30;
    }
    .itemList3>div .Btn_gray {
        overflow: hidden;
        width: 94%;
        margin: 0 3%;
        border-radius: 4px;
        -webkit-border-radius: 4px;
        -moz-border-radius: 4px;
        font-size: 123.1%;
        font-weight: bold;
        display: block;
        position: relative;
        text-align: center;
        color: #fff;
        text-decoration: none;
        background: #666;
        padding: 5% 0;
    }
    .itemList3>div .Btn_gray:before {
        /*白いひし型 */
        display: block;
        content: "";
        position: absolute;
        -webkit-transform: rotate(45deg);
        transform: rotate(45deg);
        top: 50%;
        left: 15px;
        width: 16px;
        height: 16px;
        margin-top: -8px;
        background: #fff;
    }
    .itemList3>div .Btn_gray:after {
        /*バックグラウンドと同じ色のひし型をずらして「before要素」を隠す */
        display: block;
        content: "";
        position: absolute;
        -webkit-transform: rotate(45deg);
        transform: rotate(45deg);
        top: 50%;
        left: 10px;
        width: 16px;
        height: 16px;
        margin-top: -8px;
        background: #666;
    }
    .itemList4 {
        width: 100%;
        padding: 2% 0;
        display: flex;
        display: -ms-flexbox;
        /* IE10 */
        flex-wrap: wrap;
        -ms-flex-wrap: wrap;
        /* IE10 */
    }
    .itemList4>div {
        float: left;
        width: 50%;
        padding: 1%;
        margin-top: 2%;
    }
    .itemList4>div img {
        width: 100%;
    }
    .itemList4>div dt {
        font-size: 123.1%;
        text-align: center;
    }
    .itemList4>div dd {
        font-size: 123.1%;
        text-align: left;
        padding: 2% 4% 4%;
        background: #FFF;
    }
    /* =========================================================
◆slider
========================================================= */
    .slider img {
        max-width: 100%;
        width: 100%;
        height: auto;
        padding: 0 1%;
    }
    .slider div p {
        font-size: 123.1%;
        padding: 2% 1%;
        text-align: left;
    }
    .slider div p img {
        float: left;
        max-width: 22px;
        height: auto;
        padding: 0;
        margin-right: 1%;
    }
    .slider div p .lead {
        font-size: 110%;
    }
    .slide-arrow {
        position: absolute;
        top: 50%;
        margin-top: -15px;
    }
    .prev-arrow {
        left: -40px;
        width: 0;
        height: 0;
        border-left: 0 solid transparent;
        border-right: 15px solid #113463;
        border-top: 10px solid transparent;
        border-bottom: 10px solid transparent;
        background: rgba(255, 255, 255, 0);
        /*背景白を透過*/
    }
    .next-arrow {
        right: -40px;
        width: 0;
        height: 0;
        border-right: 0 solid transparent;
        border-left: 15px solid #113463;
        border-top: 10px solid transparent;
        border-bottom: 10px solid transparent;
        background: rgba(255, 255, 255, 0);
        /*背景白を透過*/
    }
    .slick-slide {
        opacity: 0.5;
        background: rgba(255, 255, 255, 0);
        /*背景白を透過*/
    }
    .slick-active {
        opacity: 0.5;
    }
    .slick-center {
        opacity: 1 !important;
    }
    .slide_selector {
        z-index: 1 !important;
        position: relative;
        overflow: hidden;
    }
    /* =========================================================
◆アコーディオン
========================================================= */
    .cp_box *, .cp_box *:before, .cp_box *:after {
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
    }
    .cp_box {
        width: auto;
        margin: 1em auto;
    }
    .cp_box label {
        position: relative;
        display: block;
        width: 100%;
        padding: 3%;
        cursor: pointer;
        transition: all 0.3s;
        text-align: center;
        color: #FFF;
        background: #000066;
        border-radius: 4px;
        font-size: 123.1%;
        font-weight: bold;
    }
    .cp_box label span {
        font-size: 70%;
    }
    .cp_box label:hover {
        transition: all 0.3s;
        color: #ffffff;
        background: #000099;
    }
    .cp_box label::after {
        font-family: 'FontAwesome';
        content: ' \f067';
        color: #FFF;
    }
    .cp_box label:hover::after {
        color: #FFF;
    }
    .cp_box input:checked~label::after {
        font-family: 'FontAwesome';
        content: ' \f068';
        color: #FFF;
    }
    .cp_box input:checked~label:hover::after {
        color: #FFF;
    }
    .cp_box input {
        display: none;
    }
    .cp_box .cp_container {
        position: relative;
        z-index: 10;
        overflow: hidden;
        height: 0;
        margin-top: -1px;
        transition: height 0.3s ease-in-out, box-shadow 0.6s linear;
    }
    .cp_box input:checked~div {
        transition: height 0.5s ease-in-out, box-shadow 0.1s linear;
    }
    /* 続きを読むを押すと表示されるテキストの高さ */
    .cp_box input:checked~div.cp_container {
        height: auto;
    }
    /* =========================================================
◆観光列車
========================================================= */
    .aboutBox,
    .aboutBox02 {
        padding-bottom: 5%;
    }
    .aboutBox .photo {
        text-align: center;
        width: 100% !important;
        margin: 0 auto;
        padding-bottom: 2%;
    }
    .aboutBox02 .photo {
        text-align: center;
        width: 80% !important;
        margin: 0 auto;
        padding-bottom: 2%;
    }
    .aboutBox .photo img,
    .aboutBox02 .photo img {
        width: 100%
    }
    .aboutBox .detail,
    .aboutBox02 .detail {
        font-size: 123.1%;
    }
	
	.ekiin{
		max-width: 200px;
		width: 95%;
		margin: 30px auto 0;
	}
	
    /* =========================================================
◆ボタン
========================================================= */
	
	.Btn{
		width: 94%;
		margin: 0 auto 0;
	}
	
    .Btn a {
		display: block;
        color: #fff;
        margin: 4% 3%;
        text-align: center;
        background: #F60;
        border-radius: 5px;
        padding: 6% 3%;
        position: relative;
        /* 追記 */
        font-size: 123.1%;
        font-weight: bold;
    }
    .Btn a {
        color: #fff;
    }
    .Btn a span {
        font-size: 80%;
        font-weight: normal;
    }
    .Btn a::after {
        content: "＞";
        position: absolute;
        top: 50%;
        left: 10px;
        transform: translateY(-50%);
    }
    .Btn_gray {
        color: #fff;
        width: 94%;
        margin: 4% 3%;
        text-align: center;
        background: #666;
        border-radius: 5px;
        padding: 6% 3%;
        position: relative;
        /* 追記 */
        font-size: 123.1%;
        font-weight: bold;
    }
    .Btn_gray::after {
        content: "＞";
        position: absolute;
        top: 50%;
        left: 10px;
        transform: translateY(-50%);
    }
    .Btn_gray a {
        pointer-events: none;
        color: #ffffff !important;
    }
	
	.spotintro{
		margin: 0 0 50px 0;
	}
	.spotintrotit{
		text-align: center;
		font-weight: bold;
		font-size: 16px;
		color: #ffffff;
		background-color: #F89A31;
		margin: 0 0 30px 0;
		padding: 10px 10px;
	}
	
	
	.spotintro ul li{
		max-width: 970px;
		width: 95%;
		margin: 0 auto 30px;
	}
	
	.spotintro ul li:last-of-type{
		margin: 0 auto 0 !important;
	}
	.spotintro ul li img{
		width: 100%;
	}
	
    .topic_area {
        margin: 0 0 0 0;
    }
    .topic_intro {
        text-align: center;
        font-size: 5vw;
        font-weight: bold;
        margin: 50px 0;
    }
    .redtxt {
        color: #FF0004;
    }
    .purpletxt {
        color: #C457FC;
    }
    .topicboxarea {
        /*margin: 70px 0 20px 0;*/
        margin: 0px 0 20px 0;
    }
    .topicboxarea2 {
        margin: 0px 0 20px 0;
    }
    .topictit {
        padding: 1rem 0 2rem;
    }
    .topictit img {
        width: 100%;
    }
    /*
.topictit::after {
   font-size: 4.5vw;
    position: absolute;
    top: -32px;
    left: 0;
   
    padding: 5px 1em;
    color: #fff;
    border-radius: 10px 10px 0 0;
    background-color: #B90003;
  }

.point1::after{
	content: '\その①';
}


.point2::after{
	content: '\その②';
}*/
    .topic_introduction {
        margin: 20px 0 20px 0;
        /*display: flex;
	justify-content: space-between;
	align-items:flex-start;*/
        padding: 20px;
        background-color: #FFFFD9;
    }
    .introduction_txt {
        font-size: 4.3vw;
        /*width: 70%;*/
        line-height: 2;
    }
    .introduction_txt strong {
        font-size: 4.5vw;
        font-weight: bold;
        text-decoration: underline;
        display: block;
    }
    .introduction_img {
        max-width: 400px;
        width: 100;
        margin: 20px auto;
    }
    .introduction_img img {
        width: 100%;
    }
    .spotboxarea {
        /*display: flex;
	justify-content: space-between;
	align-items: stretch;
	flex-wrap: wrap;*/
        display: flex;
        margin: 0 auto 20px;
        width: 100%;
        overflow-x: scroll;
        -webkit-overflow-scrolling: touch;
        overflow-scrolling: touch;
    }
    .spottit {
        position: relative;
        padding: 1rem 1rem;
        border-radius: 10px;
        font-size: 4.5vw;
        font-weight: bold;
        margin: 0 0 20px 0;
    }
    .spottit:after {
        position: absolute;
        bottom: -9px;
        left: 1em;
        width: 0;
        height: 0;
        content: '';
        border-width: 10px 10px 0 10px;
        border-style: solid;
    }
    .spottit1 {
        color: #2f5597;
        background: #c6d9ff;
    }
    .spottit1:after {
        border-color: #c6d9ff transparent transparent transparent;
    }
    .spottit2 {
        color: #d1296d;
        background: #ffbcd7;
    }
    .spottit2:after {
        border-color: #ffbcd7 transparent transparent transparent;
    }
    .spotbox {
        border: 1px solid #cccccc;
		max-width: 400px;
        margin: 5px auto 20px;
        width: 100%;
        flex-shrink: 0;
        background-color: #ffffff;
        position: relative;
    }
    .spotbox .cp_box {
        padding: 0 10px;
    }
    .spotimg {
        max-width: 400px;
        width: 100%;
    }
    .spotimg img {
        width: 100%;
    }
    .spotdetail {
        padding: 10px 10px;
    }
    .spotdetail dt {
        margin: 0px 0 10px 0;
        font-size: 4.3vw;
        color: #C062FF;
        font-weight: bold;
    }
    .spotdetail dt span {
        display: block;
        color: #000000;
        font-size: 3.8vw;
        margin: 10px 0 0 0;
    }
    .spotdetail dd {
        padding: 10px;
        background-color: #FFFFD9;
        font-size: 4.3vw;
        line-height: 1.8;
        margin: 0;
    }
    .spotarea2 {
        /*display: flex;
	justify-content: space-between;
	align-items: flex-start;*/
        margin: 20px auto 20px;
        width: 95%;
    }
    .spotarea2img {
        max-width: 518px;
        width: 100%;
        margin: 0 auto 20px;
    }
    .spotarea2img img {
        width: 100%;
    }
    .spotarea2detail {
        font-size: 4.3vw;
        line-height: 2;
        width: 100%;
    }
    .spotarea2detail strong {
        display: block;
        margin: 0 0 10px 0;
        font-size: 4.5vw;
    }
    #coupon {
        overflow: hidden;
        background-color: rgba(255, 255, 255, 1);
        background-image: repeating-linear-gradient(0deg, transparent, transparent 8px, rgba(255, 252, 209, 1) 8px, rgba(255, 252, 209, 1) 16px);
    }
    .coupondetailalea h3.title1 {
        width: 80%;
        line-height: 50px;
        margin: 20px auto;
        font-size: 18px;
        font-weight: bold;
        color: #FFFFFF;
        text-align: center;
        background: #E2201B;
        padding: 4px;
        box-shadow: -4px 4px 0px -2px #E2201B;
    }
    .coupondetailalea h3.title1 span {
        border: 4px solid #FFFFFF;
        width: 100%;
        display: block;
    }
    .coupondetailalea h3.title1::after {
        content: '';
        background-image: none !important;
    }
    .coupondetailalea h3.title2 {
        width: 80%;
        line-height: 50px;
        margin: 20px auto;
        font-size: 18px;
        font-weight: bold;
        color: #FFFFFF;
        text-align: center;
        background: #0044FF;
        padding: 4px;
        box-shadow: -4px 4px 0px -2px #0044FF;
    }
    .coupondetailalea h3.title2 span {
        border: 4px solid #FFFFFF;
        width: 100%;
        display: block;
    }
    .coupondetailalea h3.title2::after {
        content: '';
        background-image: none !important;
    }
    .coupondetailalea .comment_box {
        width: 90%;
        margin: 20px auto 40px;
        background: rgba(255, 255, 255, 0.8);
        padding: 30px 20px;
        text-align: center;
        border-radius: 30px;
        box-shadow: 2px 2px rgba(0, 0, 0, 0.1);
    }
    .coupondetailalea .comment_box p {
        font-size: 16px;
        line-height: 1.8;
    }
    .coupondetailalea .step_unit {
        width: 100%;
        display: flex;
        flex-wrap: wrap;
        margin: 60px 0 20px;
    }
    .coupondetailalea .step_box {
        width: 80%;
        margin: 0 auto 50px;
        background: #FFFFFF;
        border: 2px solid #ffe100;
        border-radius: 20px;
        text-align: center;
        padding: 35px 15px 10px;
        position: relative;
        font-size: 14px;
    }
    .coupondetailalea .step_box h4 {
        position: absolute;
        top: -30px;
        left: 0;
        right: 0;
        width: 100%;
        background: url("../images/bg_title_step.svg")no-repeat center center;
        background-size: contain;
        font-size: 160%;
        font-weight: bold;
        color: #FFFFFF;
        text-align: center;
        padding: 10px 0 20px;
    }
    .coupondetailalea .step_box img {
        max-width: 90%;
        margin: 10px auto;
    }
    img#qrcode {
        width: 70%;
    }
    .coupondetailalea .step_box .fukidashi {
        background: url("../images/fukidashi.png")no-repeat center center;
        background-size: contain;
        padding: 30px 0 20px;
        margin-top: -10px;
    }
    .coupondetailalea a.link_pdf {
        width: 60%;
        display: block;
        margin: 30px auto 80px;
        background: #e2201b;
        font-size: 120%;
        font-weight: bold;
        color: #FFFFFF;
        text-align: center;
        line-height: 60px;
        text-decoration: none;
    }
    .coupondetailalea a.link_pdf img {
        width: 20px;
        vertical-align: middle !important;
        margin-left: 5px;
    }
    .coupondetailalea a.link_pdf:hover {
        text-decoration: none !important;
        color: #FFFFFF !important;
        opacity: 0.8;
    }
    .access_site {
        background: url("../images/icon_access.jpg")no-repeat left center;
        background-size: 40px;
        padding-left: 45px;
        text-align: left;
    }
    .entry_site {
        /*background: url("images/receiving_screen.png")no-repeat left top;
  background-size: 60%;
	padding: 40px 0 20px 60%;*/
        text-align: left;
        margin: 10px 0 15px;
        list-style: none;
        padding: 0;
    }
    .entry_site li {
        margin-bottom: 15px;
        text-indent: -1em;
        margin-left: 1em;
    }
    .entry_site li p.attention2 {
        margin-left: 1em;
    }
    .coupon_titarea {
        /* display: flex; */
        justify-content: center;
        align-items: stretch;
        background-color: #ffffff;
        padding: 10px 10px;
        border: 2px solid #ffe100;
        margin: 0 0 20px 0;
        border-radius: 10px;
    }
    .coupontitsubtop {
        border: solid 3px #E2201B;
        padding: 10px;
        border-radius: 10px;
        margin-bottom: 10px;
    }
.coupontitsubtop span {
        background: #E2201B;
        color: #FFF;
        padding: 0 5px;
        font-size: 20px;
}	
    .coupontitsubtop p {
        text-align: center;
        padding: 0px;
        color: #E2201B;
        font-weight: bold;
        font-size: 20px;
    }		
	
    .coupontitsub {
        background: #E2201B;
        padding: 10px;
        border-radius: 10px;
        width: 100%;
        margin: 0 0% 2% 0;
        text-align: center;
    }
    .coupontitsub p {
        /*border: 4px solid #ffffff;*/
        text-align: center;
        border-radius: 20px;
        padding: 0px;
        color: #ffffff;
        font-weight: bold;
        font-size: 16px;
    }
    .coupontitmain {
        width: 100%;
    }
    .couponsubtit {
        margin: 0 0 10px 0;
        font-size: 16px;
        font-weight: bold;
        text-align: center;
    }
    .coupontxt1 {
        color: #ffffff;
        background-color: #3333ff;
        padding: 5px;
        display: inline-block;
        margin: 0 5px 0 0;
    }
    .coupontxt2 {
        color: #ffffff;
        background-color: #ff66cc;
        padding: 5px;
        display: inline-block;
        margin: 0 5px 0 0;
    }
    .coupontxt3 {
        color: #ffffff;
        background-color: #00b050;
        padding: 5px;
        display: inline-block;
        margin: 0 5px 0 0;
    }
    .coupontxt4 {
        color: #ffffff;
        background-color: #ff6600;
        padding: 5px;
        display: inline-block;
        margin: 0 5px 0 0;
    }
    .coupontxt5 {
        color: #ffffff;
        background-color: #00206f;
        padding: 5px;
        display: inline-block;
        margin: 0 5px 0 0;
    }
    .couponmaintit {
        font-size: 26px;
        color: #2f5597;
        font-weight: bold;
        margin: 0 0 20px 0;
        text-align: center;
    }
    .couponkikan {
        border-radius: 10px;
        border: 2px #000000 solid;
        padding: 10px;
        font-size: 14px;
        font-weight: bold;
        background-color: #ffffff;
        text-align: center;
    }
    .couponchui {
        list-style: none;
        margin: 10px 0 0 0;
        padding: 0;
    }
    .couponchui li {
        display: flex;
        justify-content: flex-start;
        align-items: flex-start;
    }
    .couponchui li span {
        display: block;
    }
    .couponchui li span.mark {
        margin: 0 5px 0 0;
    }
    .red {
        color: #E2201B;
    }
    .coupondetailalea2 {
        margin: 20px 0 40px 0;
        background-color: #ffffff;
		padding: 0 0 20px 0;
    }
    .coupondetailalea2 .chui {
        color: #E2201B;
        font-size: 14px;
        margin: 20px 0 20px 10px;
    }
    h5.coupondetailbox_tit {
        font-size: 18px;
        color: #ffffff;
        text-align: center;
        padding: 10px 20px;
        background-color: #ff66cc;
        margin: 0;
    }
    .coupondetailbox {
        background-color: #0A75CD;
        padding: 10px 10px;
        margin: 0 0 20px 0;
    }
    .coupondetailboxin {
        /*display: flex;
	justify-content: center;
	align-items: stretch;*/
    }
    .coupondetail_koumoku {
        font-size: 18px;
        width: 100%;
        font-weight: bold;
        color: #ffffff;
        /* display: flex; */
        /* justify-content: center; */
        /* align-items: center; */
        text-align: center;
        margin: 0 0 10px 0;
    }
    .coupondetail_naiyoubox {
        background-color: #ffffff;
       /* padding: 10px;*/
        width: 100%;
    }
    .coupondetail_naiyouboxin {
        /*display: flex;
	justify-content: center;
	align-items: center;*/
    }
    .coupondetail_naiyou1 {
        width: 100%;
    }
    .coupondetail_naiyou1 ul {
        display: flex;
        justify-content: space-between;
        align-items: center;
        list-style: none;
        margin: 0 0 0 0;
        padding: 0 0 0 0;
    }
    .coupondetail_naiyou1_box1 {
        font-size: 16px;
        font-weight: bold;
        text-align: center;
    }
    .coupondetail_naiyou1_box1 span {
        font-size: 14px;
    }
    .coupondetail_naiyou1_box2 {
        font-size: 16px;
        font-weight: bold;
        text-align: center;
        color: #FFFFFF;
        background-color: #92d050;
        padding: 10px 10px;
        display: flex;
        justify-content: center;
        align-items: stretch;
        width: 60%;
    }
    .coupondetail_naiyou2 {
        font-size: 16px;
        text-align: center;
        /* display: flex; */
        /* justify-content: center; */
        /* align-items: center; */
        width: 100%;
        margin: 10px 0 10px 0;
    }
    .coupondetail_naiyou3 {
        position: relative;
        width: 100%;
        margin: 0 0 20px 0;
    }
    .coupondetail_naiyou3 ul {
        display: flex;
        justify-content: space-between;
        align-items: center;
        list-style: none;
        margin: 0;
        padding: 10px;
        background-color: #ffc000;
    }
    .coupondetail_naiyou3_box1 {
        font-size: 16px;
        font-weight: bold;
        text-align: center;
        color: #FFFFFF;
        display: flex;
        justify-content: center;
        align-items: center;
        width: 59%;
    }
    .coupondetail_naiyou3_box2 {
        width: 37%;
        max-width: 400px;
    }
    .coupondetail_naiyou3_box2 img {
        width: 100%;
    }
    .coupondetail_naiyou3 .righttxt {
        font-size: 14px;
        /* position: absolute; */
        /* right: 0px; */
        /* bottom: -34px; */
        text-align: right;
    }
    .coupondetail_naiyou_bottom1 {
        font-size: 16px;
        font-weight: bold;
        margin: 0 0 10px 0;
    }
    .coupondetail_naiyou_bottom2 {
        font-size: 12px;
        color: #E2201B;
    }
    .coupondetail_naiyouboxin2 {
        padding: 10px;
        background-color: #FFFFD9;
    }
    .coupondetail_naiyouboxin_1 {
        /*display: flex;
	justify-content: flex-start;
	align-items: stretch;*/
    }
    .coupondetail_naiyou4 {
        font-size: 16px;
        color: #ffffff;
        text-align: center;
        padding: 10px 20px;
        background-color: #ff66cc;
        margin: 0 0px 10px 0px;
        font-weight: bold;
        width: 100%;
    }
    .coupondetail_naiyou5 {
        font-size: 18px;
        color: #E2201B;
        font-weight: bold;
        display: flex;
        justify-content: center;
        align-items: center;
        margin: 0 0 10px 0;
        text-align: center;
    }
    .coupondetail_naiyou5 span {
        font-size: 12px;
        padding: 0 0 0 0px;
    }
    .nimotsutit {
        font-size: 16px;
        font-weight: bold;
        margin: 0 0 10px 0;
    }
    .nimotsutit span {
        text-decoration: underline;
    }
    .coupondetail_naiyouboxin2 ul {
        list-style: none;
        margin: 0 0 0 0;
        padding: 0 0 0 0;
    }
    .coupondetail_naiyouboxin2 ul li {
        font-size: 14px;
    }
    .couponlistarea {
        background-color: #0A75CD;
        padding: 10px;
    }
    .couponlistbox {
        margin: 0 0 20px 0;
        background-color: #ffffff;
        padding: 10px;
    }
    .couponlistbox .spotbox p.point,
    .couponlistbox .slide-box p.point {
        background: #e6ffce !important;
    }
    .areatit {
        padding: 10px 10px 20px;
        text-align: center;
        font-size: 18px;
        background-color: #0A75CD;
        color: #ffffff;
        font-weight: bold;
    }
    .bluetxt {
        color: #0054FF;
        font-size: 12px !important;
    }
    .boxlong {
        padding: 10px;
        margin: 20px 0;
    }
    .boxlong p {
        font-size: 123.1%;
    }
    .boxlong p span {
        font-weight: bold;
    }
    .boxlong p.point {
        background: #e6ffce;
        padding: 10px;
        margin-top: 10px;
        line-height: 1.4;
    }
    .boxlong p.point span {
        color: #F00;
    }
    .boxlong_couponarea {
        /*display: flex;
	justify-content: space-between;
	align-items: stretch;*/
    }
    .boxlong_coupon1 {
        width: 100%;
        max-width: 400px;
        margin: 10px auto 10px;
    }
    .boxlong_coupon2 {
        font-size: 24px;
        display: flex;
        justify-content: center;
        align-items: center;
        text-align: center;
    }
    .boxlong_coupon1 ul {
        display: flex;
        justify-content: center;
        align-items: stretch;
        list-style: none;
        margin: 0;
        padding: 0;
    }
    .boxlong_coupon1 ul li {
        width: 100%;
    }
    .boxlong_coupon1 ul li.txtarea {
        display: flex;
        justify-content: center;
        align-items: center;
        padding: 10px;
        font-size: 16px;
        font-weight: bold;
        color: #ffffff;
        background-color: #ff66cc;
    }
    .boxlong_coupon1 ul li.imgarea {
        max-width: 400px;
        margin: 0 auto;
    }
    .boxlong_coupon1 ul li.imgarea img {
        width: 100%;
        vertical-align: bottom;
    }
    .cap {
        padding: 10px;
        background-color: #e6ffce;
    }
    .cap p {
        text-align: center;
        font-size: 12px;
        font-weight: bold;
        margin: 0;
    }
    .commodityarea {
        position: relative;
        padding: 10px;
        background-color: #ffffff;
        margin: 30px 0 0px 0;
    }
    .commodity1 {
        border: 2px solid #0952d3;
    }
    .commodity2 {
        border: 2px solid #8cc457;
    }
    .commoditytit {
        font-size: 16px;
        text-align: center;
        margin: 0 0 20px 0;
        padding: 10px 0 20px 0;
        font-weight: bold;
		
    }
	
	.commoditytit .commoditytitin{
		width: 100%;
		border-radius: 10px;
		margin: 0 auto;
		color: #ffffff;
		padding: 7px;
		line-height: 1.5;
	}
	
    .commodity1 .commoditytit {
  
        border-bottom: dotted 2px #0952d3;
    }
	
	 .commodity1 .commoditytit .commoditytitin{
		background-color: #0952d3;
	}
	
    .commodity2 .commoditytit {
       
        border-bottom: dotted 2px #8cc457;
    }
	.commodity2 .commoditytit .commoditytitin{
		background-color: #8cc457;
	}
	
	.commodity_txt{
		text-align: center;
		font-size: 16px;
		margin: 0 0 20px 0;
	}
	
	
	
	.commodity_txt strong{
		font-weight: bold;
	}
	
	.commodity_txt2{
		text-align: center;
		font-size: 18px;
		padding: 10px;
		border: 2px solid #0B449C;
		margin: 20px 0 0px 0;
		border-radius: 15px;
		background-color: #ffffff;
	}
	
	.commodity_txt2 strong{
		font-weight: bold;
	}
	
    .commodity_chui {
        color: #E00003;
        font-size: 14px;
        margin: 0 0 20px 0;
        text-align: center;
    }
    .commoditybtn {
        /*display: flex;
	justify-content: center;
	align-items: center;*/
    }
    .commoditybtn .Btn {
        margin: 0 0% 10px 0%;
        width: 100% !important;
    }
	
	.commodityred {
    border: solid #E2201B;
    border-radius: 10px;
}
	
	.commodityred span {
        color: #FFFFFF;
        display: block;
        background: red;
        padding: 0 15px 0;
        margin: 0 auto 10px;
        width: fit-content;
}
	
.commodityredtit {
        color: #E2201B;
	        font-size: 24px;
        text-align: center;
        padding: 20px 0 30px 0;
        font-weight: bold;
}	
	
    .kouchiillust {
        position: absolute;
    }
    .kouchiillust img {
        width: 100%;
    }
    .illust1 {
        max-width: 122px;
        width: 5% !important;
        top: -6px;
        left: 110px;
    }
    .illust2 {
        max-width: 66px;
        width: 17%;
        top: 8%;
        right: 3%;
    }
    .illust3 {
        max-width: 51px;
        width: 13%;
        top: 3%;
        left: 3%;
    }
    .illust4 {
        max-width: 74px;
        width: 19%;
        top: 5%;
        right: 2%;
    }
    .illust5 {
        max-width: 55px;
        width: 14%;
        top: 5%;
        left: 6%;
    }

    /*　観光・イベント情報　*/
    .act_box {
        width: 100%;
        border: 1px solid #ccc;
        border-radius: 8px;
        overflow: hidden;
        background-color: #ffffff;
        box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
        margin: 0 auto 30px;
    }
    .actred {
        background-color: #e2201b;
    }
    .actyellow {
        background-color: #ffc000;
    }
    .actblue {
        background-color: #0A75CD;
    }
    .act_title {
        color: #ffffff;
        padding: 10px;
        font-weight: bold;
        display: inline-block;
        border-radius: 8px 0 0 0;
        font-size: 20px;
    }
    .act_content {
        padding: 20px;
    }
    .act_im {
        width: 100%;
        height: auto;
        object-fit: cover;
        margin-right: 20px;
    }
    .act_txtbox {
        flex-grow: 1;
        line-height: 1.5;
    }
    .act_txtbox .act_titletxt {
        font-size: 1.5rem;
        line-height: 1.8;
        font-weight: bold;
        margin-bottom: 10px;
		text-align: center;
    }
    .act_titletxt span {
        background-color: #ffff66;
        color: red;
    }
    .act_txtbox .act_subtitle {
        color: #ffffff;
        text-align: center;
        padding: 5px;
        margin-bottom: 10px;
        font-size: 20px;
        font-weight: bold;
    }
    .act_txtbox .act_txt {
        color: #0952d3;
        font-weight: bold;
        margin-bottom: 10px;
        font-size: 16px;
    }
	.act_txtbox {
    text-align: center;
}
	.event_box {
    text-align: center;
	margin: 2rem auto;
    padding: 0.5rem 0.5rem 1.5rem;
    background: #FFFFD9;
    border: 3px solid #003287;
    border-radius: 40px;
}
	
	        .eventtitle {
            position: relative;
            display: inline-block;
            padding: 10px 20px;
            color: #0066cc;
                    font-size: 1.5rem;
            font-weight: bold;
            margin-bottom: 20px;
        }

        /*.eventtitle::before,
        .eventtitle::after {
            content: '';
            position: absolute;
            top: 50%;
            width: 30px;
            height: 2px;
            background-color: #0066cc;
        }

        .eventtitle::before {
            left: -30px;
            transform: rotate(45deg);
        }

        .eventtitle::after {
            right: -30px;
            transform: rotate(-45deg);
        }*/
	
	
    .topic_txt {
        color: #000000;
        font-weight: bold;
        margin-bottom: 10px;
        font-size: 18px;
    }
    .topic_txt span {
        color: red;
    }
    .link_txt {
        color: #000000;
        margin: 10px 0 0;
        font-size: 16px;
    }
    .detail {
        width: 100%;
        box-sizing: border-box;
        padding: 10px;
    }
    .detail dl {
        font-size: 123.1%;
        line-height: 1.4;
        margin: 0;
        padding: 6px 0;
        border-bottom: 1px dotted #333;
    }
    .detail dl span {
        font-size: 80%;
    }
    .detail dt {
        clear: left;
        float: left;
        width: 5.5em;
        font-weight: bold;
    }
    .detail dd {
        margin-left: 5.5em;
    }
    .detail dl:last-child {
        border-bottom: none;
    }	
	
	
/* ----------------------------------------------- 

# modelcourse

----------------------------------------------- */
.modelin {
	margin: 0 auto 30px;
	padding: 0 15px !important;
}

#modelcourse .modellink{
width: 90%;
padding: 0;
margin: 0 auto;
/*display: flex;
justify-content: space-between;
flex-wrap: wrap;
*/
}
.modelBox_top{
z-index: 1;
position: relative;
display: block;
margin: 0 0 10px;
padding: 0 0 10px;
border-radius: 10px;
/*width: calc(100% / 2 - 10px);*/
}
.modelBox_top::after{
content:'';
opacity: 1;
top: 0;
left: 0;
bottom: 0;
right: 0;
position: absolute;
z-index: -1;
border-radius: 10px;
}
.modelBox_top a{
display: block;
text-decoration: none;
color: #fff;
/*text-shadow: 0px 0px 5px rgba(0,0,0,1);*/
text-shadow: black 1px 1px 2px, black -1px -1px 2px;
}
.modelBox_top a::after {
  content: "";
  display: block;
  height: 100%;
  left: 0;
  position: absolute;
  top: 0;
  width: 100%;
}
.modelImg_top{
margin: 0;
padding: 0;
}
.modelImg_top img{
border-radius: 10px 10px 0 0;
}

.modelTitle_top{
margin: 0;
padding: 10px 15px;
font-weight: bold;
text-align: center;
font-family: YuMincho, "Yu Mincho", "Hiragino Mincho ProN", "serif";
}
.modelTitle_top span{
font-size: 0.8rem;
font-weight: lighter;
}/*
.modelTitle_top em {
background: rgba(0,0,0,0.3);
}*/
/*
.modelBox_top:nth-child(1)::after{
background-image: url("../images/arrow_white.png"),url(../images/top-model001.jpg);
background-position:  center 97%,center center;
background-repeat: no-repeat,no-repeat;
background-size: 13px,cover;
}*/
.modelBox_top:nth-child(1)::after{
background-image: url("../images/arrow_white.png"),url(../images/top-model003.jpg);
background-position:  center 97%,center center;
background-repeat: no-repeat,no-repeat;
background-size: 13px,cover;
}
.modelBox_top:nth-child(2)::after{
background-image: url("../images/arrow_white.png"),url(../images/top-model004.jpg);
background-position:  center 97%,center center;
background-repeat: no-repeat,no-repeat;
background-size: 13px,cover;
}
	
.modelBox_top:nth-child(3)::after{
background-image: url("../images/arrow_white.png"),url(../images/top-model001.jpg);
background-position:  center 97%,center center;
background-repeat: no-repeat,no-repeat;
background-size: 13px,cover;
}
.modelBox_top:nth-child(4)::after{
background-image: url("../images/arrow_white.png"),url(../images/top-model002.jpg);
background-position:  center 97%,center center;
background-repeat: no-repeat,no-repeat;
background-size: 13px,cover;
}
#modelcourse .inner{
margin: 0 auto 30px !important;
padding: 20px 10px 30px 10px !important;
width: 90% !important;
background: #fff url(../images/section_top.png) no-repeat center top;
background-size: 100%;
}
#modelcourse h3{
position: relative;
font-size: 1.1rem;
margin: 20px 0 15px 0;
padding: 0 15%;
font-weight: bold;
font-family: YuMincho, "Yu Mincho", "Hiragino Mincho ProN", "serif";
text-align: center;
}
#modelcourse h3:first-letter{
/*margin-left:-5px;*/
}
#modelcourse h3 span{
font-size: 0.8rem;
}
#modelcourse  h3::before{
content:'';
position: absolute;
left:0;
top:0;
bottom: 10px;
width: 10%;
height: 18px;
margin: auto 0;
background:  url(../images/smp_h3_deco_left.png) no-repeat bottom;
background-size: contain;
}
#modelcourse h3::after{
content:'';
position: absolute;
right:0;
top: 0;
bottom: 10px;
width: 10%;
height: 18px;
margin: auto 0;
background:  url(../images/smp_h3_deco_right.png) no-repeat bottom;
background-size: contain;
}

#modelcourse p{
margin: 0;
line-height: 1.5;
}
#modelcourse .day{
margin: 20px 0 15px 0;
padding: 2px 10px;
background: #00b0f0;
border-left:solid 10px #0066cc;
color: #fff;
font-size: 0.8rem;
font-weight: bold;
font-family: YuMincho, "Yu Mincho", "Hiragino Mincho ProN", "serif";
}
#modelcourse .day:first-letter{
font-size: 1.2rem;
}

.ic-place{
padding: 5px 30px;
background: url(../images/ic-place.png) no-repeat 10px center;
background-size: 13px;
}
.ic-train{
padding: 5px 30px;
min-height: 20px;
background: url(../images/ic-train.png) repeat-y 13px center;
background-size: 7px auto;
}
.ic-bus{
padding: 5px 30px;
min-height: 20px;
background: url(../images/ic-bus.png) repeat-y 13px center;
background-size: 7px auto;
}
.ic-walk{
padding: 5px 30px;
min-height: 20px;
background: url(../images/ic-walk.png) repeat-y 14px center;
background-size: 4px auto;
}
.ic-arrow{
padding: 5px 5px 5px 30px;

min-height: 20px;
background: url(../images/ic-arrow.png) repeat-y 10px 2px;
background-size: 14px auto;
}
img.ic-car {
	display: inline;
	width: 35px;
	height: auto;
	vertical-align: bottom;
}
img.ic-bus2 {
	display: inline;
	width: 28px;
	height: auto;
	vertical-align: bottom;
}
img.ic-ropeway {
	display: inline;
	width: 25px;
	height: auto;
	vertical-align: bottom;
}
img.ic-train2 {
	display: inline;
	width: 30px;
	height: auto;
	vertical-align: bottom;
}
img.ic-walk2 {
	display: inline;
	width: 25px;
	height: auto;
	vertical-align: bottom;
}

.spotlist dt{
margin: 0;
padding:0;
font-weight: bold;
color:#d02e58;
}
.spotlist dt span{
font-weight: normal;
}
.spotlist dd{
margin: 0;
padding:0 0 5px 0;
}

.mImage{
position: relative;
margin-top:1px !important;
background: #fff;
}
	
	.mImage img{
		width: 100%;
	}
.mImage span.font12{
position: absolute;
right:5px;
bottom:2px;
display: block;
color: #fff;
font-size: 10px;
line-height: 1.2;
text-align: right;
text-shadow: black 1px 1px 2px, black -1px -1px 2px;
}

.mPlace{
margin: 10px 0;
background: #fffddf;
}
.mName{
position: relative;
padding: 5px 10px;
background: #00b0f0;
color: #fff;
font-weight: bold;
font-size: 1rem !important;
}
.mName .font14{
font-size: 0.8rem;
}
.mName-parts{
margin-left: 15px;
padding: 2px 6px;
background: #fff;
color: #fb7d85;
font-size: 10px !important;
font-weight: lighter;
border-radius: 10px;
}
.mTxt{
padding: 10px;
}
.mTxt p{
padding-bottom: 10px;
}
.mTxt p.frame {
	padding: 5px;
	border: 1px dashed #696de5;
}

#section04 h2 {
margin: 20px auto 0px auto;
font-size: 16px;
}
div#tripabox{
	padding:10px;
	margin-bottom:30px;
}

div#tripabox div{
	overflow:hidden;
	padding:15px;
	margin:0 0 0 0;
	background:#FFF;
	float:none!important;
	width:auto!important;
	border-bottom:1px dashed #CCC
}



div#tripabox div p{
	float:left;
	margin:0 20px 0 0;
	width:75px;
	height:75px;
}

#tripauncer div p img{
	width:100%;
	height:auto;
}

#tripauncer div dl{
	overflow:hidden;
	display:block;
	padding:0 0 0 0;
}

#tripauncer div:last-child{
	border-bottom:none
}


#tripauncer div dl dt{
	font-size:14px;
	margin:0 0 10px 0;
	padding:0;
}

#tripauncer div dl dt a{
	color:#000;
}

#tripauncer div dl dd{
	font-size:12px;
	color:#999;
}

#tripauncer div dl dd > span{
	display:block;
	margin:5px 0 0 0;
}

#tripauncer div dl dd > span a{
	color:#CCC;
	display:inline-block;
	background:none;
	padding:0;
	text-align:center;
	margin-top:0;
	font-size:14px;
	-webkit-border-radius: 0;
	border-radius: 0;
	border-bottom:none;
}

#tripauncer div dl dd > span span{
	color:#F69;
	display:inline;
}

#tripauncer .commonTit{
	margin:0;
}

.offer {
	margin: -30px 0 15px !important;
}
.modelin .offer {
	margin: 0 0 15px !important;
}
.in.modelbtn {
	margin: -40px auto 20px;
}
#guidance ul {
	margin-bottom: 15px;
}
#guidance ul li {
	list-style-type: disc;
	margin-left: 24px;
	font-size: 12px;
}
#guidance h3 {
	margin-bottom: 10px !important;
	font-size: 15px !important;
	font-family: "Helvetica Neue",Arial,"Hiragino Kaku Gothic ProN","Hiragino Sans",Meiryo,sans-serif !important;
}
#guidance h3::before, 
#guidance h3::after {
	display: none;
}

/*
.modelin h3.guidance span {
	padding: 7px 10px !important;
	color: #fff;
	background: #555;
}
*/

.wappen {
	position: absolute;
	top: -0.3em;
	overflow: hidden;
	width: 2.6em;
	height: 2.6em;
	line-height: 2.6em;
	background: #fff;
	border-radius: 50%;
	box-shadow: 0px 0px 0px 2px #fff;
	border: dashed 1px #00b0f0;
	text-align: center;
	color: #00b0f0;
	font-size: 15px;
	font-weight: bold;
}
span.wappen_txt {
	display: block;
	margin-left: 3em;
}


/*modal*/
	
.modal {
  display: none;
  position: fixed;
  z-index: 20;
  left: 0;
  top: 0;
  height: 100%;
  width: 100%;
  overflow: auto;
  background-color: rgba(0,0,0,0.5);

}
	
 .modal-wrap{
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
  }

.modal-box {
    background-color: #fff;
    margin: 10% auto;
    max-width: 760px;
    width: 90%;
    border-radius: 10px;
    animation-name: modalopen;
    animation-duration: 1s;
    position: relative;
	padding: 20px;
	transition: all 0.3s;
}
	
	.modal-boxin{
		/*display: flex;
		justify-content: space-between;*/
		
	}

.modalClose{
      position: absolute;
      top: 0;
      right: 0;
    }
	
	
	
.modalOpen {
        position: relative;
        display: block;
         width: 90%;
	margin: 0 auto 15px;
        padding: 10px;
        cursor: pointer;
        transition: all 0.3s;
        text-align: center;
        color: #FFF;
        background: #000066;
        border-radius: 0.2em;
        font-size: 123.1%;
    }
.modalOpen span {
        font-size: 70%;
    }
.modalOpen:hover {
        transition: all 0.3s;
        color: #ffffff;
        background: #000099;
    }
.modalOpen::after {
        font-family: 'FontAwesome';
        content: ' \f067';
        color: #FFF;
    }
.modalOpen:hover::after {
        color: #FFF;
    }
	
	.modal-img{
		width:95%;
		margin: 0 auto 10px;
		max-width: 400px;
	}
	
	.modal-img img{
		width: 100%;
	}
	
	.modal-detail{
		width: 95%;
		margin: 0 auto;
	}
	
	.detail_intro{
		margin: 0 0 10px 0;
	}
	
	.detail_intro dl dt{
		font-size: 16px;
		font-weight: bold;
		margin: 0 0 10px 0;
		padding: 0 0 10px 0;
		border-bottom: 2px dotted #000000;
		
	}
	
	.detail_intro dl dd{
		font-size: 14px;
		line-height: 1.8;
	}
	
 /* 閉じるボタン */
  .modal-close-btn {
      position: absolute;
      right: 0px;
      top: 0px;
      width: 30px;
      height: 30px;
      cursor: pointer;
      z-index: 20;
      /* background-color: white; */
      /* border-radius: 50%; */
  }
	
  .modal-close-btn:hover {
          opacity: 0.8;
      }
  /* 閉じるボタンのX */
  .lineClose {
      display: inline-block;
      vertical-align: middle;
      color: var(--c-white);
      line-height: 1;
      width: 1rem;
      height: .2rem;
      background: currentColor;
      border-radius: 0.1rem;
      transform: rotate(45deg);
      position: absolute;
      top: 50%;
      left: 20%;
  }
  .lineClose::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: inherit;
    border-radius: inherit;
    transform: rotate(90deg);
  }
	
	.spottitle{
		font-size: 16px;
		font-weight: bold;
		padding: 10px 10px;
		color: #C062FF;
		display: flex;
		align-items: center;
	}
	
	.accordion {
margin: 3em auto;

}
.toggle {
display: none;
}
.option {
position: relative;
margin-bottom: 1em;
}
.coupondetail_title,
.content {
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
transform: translateZ(0);
transition: all 0.3s;
}
.coupondetail_title {
padding: 1em;
border: 2px solid #0A75CD;
display: block;
color: #333;
font-weight: bold;
	font-size: 16px;
}
.coupondetail_title::after,
.coupondetail_title::before {
content: "";
position: absolute;
right: 1.25em;
top: 1.25em;
width: 2px;
height: 0.75em;
background-color: #333;
transition: all 0.3s;
}
.coupondetail_title::after {
transform: rotate(90deg);
}
.content {
max-height: 0;
overflow: hidden;

}

.toggle:checked + .coupondetail_title + .content {
max-height: 500px;
transition: all 1.5s;
padding: 15px;
}
.toggle:checked + .coupondetail_title::before {
transform: rotate(90deg) !important;
}
	
}
/*760px以上*/
@media screen and (min-width: 760px), print {
    /* CSS */
	
	.top_topic{
		margin: 0 0 50px 0;
	}
	
	.top_topicbox{
		margin: 0 0 30px 0;
		padding: 20px;
		border-radius: 20px;
		background-color: #ffffff;
		 box-shadow: 6px 6px #0066cc;
	}
	
	.top_topicbox:last-of-type{
		margin: 0 0 0 0 !important;
	}
	
	
		
	.top_topicbox_tit{
    display: flex;
    align-items: center;
    padding: .5em .7em;
    background-color: #fffdeb;
    color: #333333;
		font-size: 20px;
		font-weight: bold;
		margin: 0 0 20px 0;
}

.top_topicbox_tit::before {
    display: inline-block;
    width: 5px;
    height: 1.5em;
    margin-right: .5em;
    background-color: #0066cc;
    content: '';
}
	
	.top_topicbox_in{
		display: flex;
		justify-content: space-between;
	}
	
	.top_topicbox_img{
		max-width: 400px;
		width: 48%;
		
	}
	
	.top_topicbox_img img{
		width: 100%;
	}
	
	.top_topicbox_detail{
		width: 52%;
		/*margin: 10px 0 0 0;*/
	}
	
	.top_topicbox_detail p{
		font-size: 16px;
	}
	
    .logodetail {
        background-color: #FFFFD9;
        padding: 20px;
        margin: 30px 0;
    }
    .logotit {
        font-size: 18px;
        color: #FF0004;
        margin: 0 0 10px 0;
        font-weight: bold;
    }
    .logodetail ul {
        display: flex;
        justify-content: flex-start;
        align-items: center;
    }
    .logomark {
        width: 15%;
        margin: 0 10px 0 0;
    }
    .logomark img {
        width: 100%;
    }
    .logotxt {
        font-size: 16px;
        line-height: 1.5;
    }
    .introbox {
        padding: 20px;
        background: #FFFFD9;
		margin: 0 0 50px 0;
    }
	
	.introbox2{
		margin: 0 0 0 0 !important;
	}
    .introboxtit {
        color: #C457FC;
        font-weight: bold;
        font-size: 18px;
        margin: 0 0 0 0;
        text-align: center;
    }
	
	/*.introbox2 .introboxtxt{
		text-align: left !important;
	}*/
	
	.kippu{
		margin: 20px auto 0;
		max-width: 418px;
		width: 100%;
	}
	
	.kippu img{
		width: 100%;
	}
	
    .introboxtxt {
        font-size: 16px;
        line-height: 1.6;
        margin: 10px 0 0 0;
        text-align: center;
    }
	
		
	.introboxtxt2{
         font-size: 16px;
        line-height: 1.6;
        margin: 10px 0 0 0;
		text-indent: -1em;
		padding-left: 1em;
		 text-align: center;
    }
	
    .introboxtxt b {
        font-size: 24px;
    }
    .intrologoarea {
        margin: 0 0 15px 0;
        display: flex;
        align-items: center;
		justify-content: center;
    }
    .intrologo {
        width: 47%;
        margin: 0 10px 0 0;
        max-width: 400px;
    }
    .intrologo img {
        width: 100%;
    }
	.introbox2 .introtit {
		text-align: center;
	}
	
    .introtit {
        font-size: 24px;
        font-weight: bold;
    }
    .introtit .minitxt {
        font-size: 16px;
    }
	
	 .introtit2 {
        font-size: 24px;
        font-weight: bold;
		background-color: #0B449C;
		 padding: 10px;
		 color: #ffffff;
		 text-align: center;
    }
    .introtit2 .minitxt {
        font-size: 16px;
    }
    #wrapper {
        line-height: 1.231;
    }
    #dirPathBlock,
    h1,
    .iframe_end-content_gadget,
    #anchorLinkBlock {
        width: 100%;
        max-width: 970px;
        min-width: 760px;
        margin: auto;
    }
    /*panlist&back*/
    #dirPathBlock,
    #anchorLinkBlock {
        width: 100%;
        margin: 0 auto;
        display: block;
        font-size: 12px;
    }
    #dirPathBlock p,
    #anchorLinkBlock a {
        font-size: 12px;
    }
    h1 {
        font-size: 14px;
        width: auto;
        max-width: 970px;
        margin: 0 auto 5px;
    }
    h2 {
        padding: 1rem 2rem;
        border-bottom: 3px solid #00458C;
        background: #0066cc;
        border-radius: 10px 10px 0 0;
        font-size: 220%;
        color: #fff;
        text-align: center;
        margin: 0 0 30px 0;
    }
    .inner {
        max-width: 950px;
		width: 95%;
        margin: 0 auto;
        padding: 20px 0;
    }
	
	.model_btn{
		max-width: 970px;
		width: 96%;
		margin: 0 auto;
	}
	
	.model_btn img{
		width: 100%;
	}
	
    /*title*/
    /*スライド*/
    .titlePc {
        position: relative;
        width: 100%;
        height: 600px;
        overflow: hidden;
    }
main article .titlePc.spnone {
}
#top #wrapper {
}
#top #wrapper {
}



    .titlePc img {
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        margin: auto;
        width: 525px;
        height: 600px;
        opacity: 1;
        z-index: 999;
    }
    .slide {
        position: relative;
        width: 100%;
        height: 600px;
        overflow: hidden;
    }
    .slide-image {
        background-position: center;
        background-repeat: no-repeat;
        background-size: cover;
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        opacity: 0;
        animation: slider-1 24s linear infinite;
    }
    .slide-image:nth-child(1) {
        background-image: url(../images/mv_pc_1.jpg);
        animation-delay: -2s;
    }
    .slide-image:nth-child(2) {
        background-image: url(../images/mv_pc_2.jpg);
        animation-delay: 6s;
    }
    .slide-image:nth-child(3) {
        background-image: url(../images/mv_pc_3.jpg);
        animation-delay: 14s;
    }
    @keyframes slider-1 {
        0% {
            opacity: 0;
            transform: scale(1);
        }
        4.16% {
            opacity: 1;
        }
        33.33% {
            opacity: 1;
        }
        41.66% {
            opacity: 0;
            transform: scale(1.2);
        }
        100% {
            opacity: 0;
        }
    }
    h3 {
        position: relative;
        padding: 0 0.5rem 1rem;
        text-align: center;
        font-size: 200%;
    }
    h3:after {
        position: absolute;
        bottom: 0;
        left: 0;
        width: 100%;
        height: 4px;
        content: '';
        border-radius: 3px;
        background-image: -webkit-gradient(linear, right top, left top, from(#00458C), to(#0066cc));
        background-image: -webkit-linear-gradient(right, #00458C 0%, #0066cc 100%);
        background-image: linear-gradient(to left, #00458C 0%, #0066cc 100%);
    }
    a:hover img {
        opacity: 0.8;
        filter: progid:DXImageTransform.Microsoft.Alpha(Enabled=1, Style=0, Opacity=80);
    }
    p.text {
        font-size: 153.9%;
        line-height: 1.5;
        font-weight: bold;
        text-align: center;
        margin: 30px 0 5px 0;
    }
    p.attention {
        font-size: 123.1%;
        line-height: 1.5;
        margin-bottom: 30px;
        padding: 20px;
        border: 2px #F00 solid;
        text-align: left;
        background: #FFF;
    }
    .borderBox {
        display: inline-block;
        padding: 20px 20px;
        border: solid 3px #1048e0;
        position: relative;
        font-size: 123.1%;
        line-height: 1.5;
    }
    .borderBox:after {
        content: "";
        border: solid 1px #1048e0;
        position: absolute;
        top: 3px;
        left: 3px;
        width: calc(100% - 6px);
        height: calc(100% - 6px);
    }
    .borderBox strong {
        font-size: 150%;
        line-height: 1.5;
        background: linear-gradient(transparent 60%, #ffff66 0%);
        display: inline-block;
    }
    .unit {
        width: 950px;
        margin: 20px auto 10px;
        text-align: left;
        background: #FFF;
        padding: 30px 20px;
        line-height: 1.6;
        border: 3px solid #EEE;
        box-shadow: 0px 0px 10px 0px rgba(10, 10, 10, 0.1), 0px 1px 0px 0px rgba(0, 0, 0, 0.02);
    }
    .unit span {
        font-size: 30px;
        color: #0070c0;
        font-weight: bold;
        display: block;
        margin: 20px 0 20px 0;
        text-align: center;
    }
    .unit span b {
        font-size: 16px !important;
    }
    .unit img {
        width: 880px;
        text-align: center;
        margin: 10px 15px 0;
    }
    .unit .detail {
        font-size: 123.1%;
        line-height: 1.5;
    }
    .message {
        width: 650px;
        margin: 70px auto 50px;
        font-size: 200%;
        text-align: center;
        background: #EBEBEB;
        padding: 80px 0;
        border-radius: 0.5em;
    }
    .textLeft {
        font-size: 123.1%;
        text-align: left;
    }
    .catch {
        font-size: 153.9%;
        text-align: center;
        font-weight: bold;
		margin: 0 0 30px 0;
    }
    .catch .red {
        color: #FF0000;
    }
    .catch .blue {
        color: #0033cc;
    }
    .catch .green {
        color: #009966;
    }
    .bannertxtarea {
        width: 850px;
        margin: 30px auto 0;
    }
    .bannertit {
        font-size: 24px;
        font-weight: bold;
        margin: 0 0 10px 0;
        color: #c6021a;
    }
    .bannertxt {
        font-size: 16px;
        line-height: 1.8;
        margin: 0 0 10px 0;
    }
    .bannerBox img {
        width: 850px;
        height: auto;
        margin: 10px 50px 20px;
    }
    /* =========================================================
◆navigation
========================================================= */
        .topNavi {
            background-color: #ffff66;
        }

        .topNavi ul {
            display: grid;
            grid-template-columns: repeat(3, 2fr);
            list-style: none;
            padding: 0;
            margin: 0;
        }

        .topNavi ul li {
            border-left: 1px dashed rgba(0, 0, 0, 1);
            padding: 10px;
            text-align: center;
            font-size: 14px;
        }

      .topNavi ul li:nth-child(-n+3) {
            border-bottom: 1px dashed rgba(0, 0, 0, 1);
        }

        /*.topNavi ul li:nth-child(4),
        .topNavi ul li:last-child {
            border-right: 1px dashed rgba(0, 0, 0, 1);
        }*/

        .topNavi ul li.span-2 {
            grid-column: span 2;
        }

        .topNavi ul li a {
            text-decoration: none;
            color: #000;
            display: block;
            height: 100%;
        }
	

	
    .topNavi ul li {
        list-style: none;
        font-size: 153.9%;
        font-weight: bold;
        margin: 0;
        display: flex;
        justify-content: center;
        align-items: center;
        flex-direction: column;
    }	
    .topNavi ul li a {
        color: #00b0f0;
        display: contents;
    }
	.span-2 span {
        display: block;
        margin-top: 5px;
}
	.span-2 strong {
    background: red;
    padding: 5px;
    color: #FFF;
    display: inline-block;
    margin-right: 10px;
    /*width: 100%;*/
}

    /* =========================================================
◆photoswipe
========================================================= */
    figure {
        position: relative;
        margin-top: 20px;
    }
    figure img {
        width: 100%;
    }
    figure:hover:before {
        position: absolute;
        content: "";
        top: 0;
        left: 0;
        bottom: 0;
        right: 0;
        margin: auto;
        width: 100px;
        height: 100px;
        display: block;
        z-index: 99;
        background: url(../images/ic_zoom.png) no-repeat;
        background-size: 100% auto;
    }
    /* =========================================================
◆slide
========================================================= */
    .slide-wrap {
        width: 100%;
        margin: 0;
        padding: 0;
        display: -webkit-box;
        display: -moz-box;
        display: -ms-box;
        display: -webkit-flexbox;
        display: -moz-flexbox;
        display: -ms-flexbox;
        display: -webkit-flex;
        display: -moz-flex;
        display: -ms-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;
    }
    .slide-box {
        width: 33.33333%;
        padding: 10px;
        position: relative;
    }
    .coupon_fukidashi {
        position: absolute;
        width: 35%;
        top: -5px;
        left: -5px;
    }
    .coupon_fukidashi img {
        width: 100%;
    }
    .slide-box:nth-child(4n) {
        margin-right: 0;
    }
    .slide-box:nth-child(-n+4) {
        margin-top: 0;
    }
    .slide-box .areaEast {
        background: #00C33A;
        color: #FFFFFF;
        font-size: 123.1%;
        padding: 10px;
        text-align: center;
    }
    .slide-box .areaMiddle {
        background: #FFB600;
        color: #FFFFFF;
        font-size: 123.1%;
        padding: 10px;
        text-align: center;
    }
    .slide-box .areaWest {
        background: #0099ff;
        color: #FFFFFF;
        font-size: 123.1%;
        padding: 10px;
        text-align: center;
    }
    .slide-box img {
        display: block;
        height: auto;
        width: 100%;
    }
    .slide-box p {
        font-size: 123.1%;
        margin: 15px 0;
    }
    .slide-box p span {
        font-weight: bold;
    }
    .slide-box p.point {
        background: #FFFFD9;
        padding: 10px;
        margin-top: 10px;
        line-height: 1.4;
    }
    .slide-box p.point span {
        color: #F00;
    }
	
	
	.spotbox p.point {
        background: #FFFFD9;
        padding: 10px;
        margin: 0px 10px 10px 10px;
        line-height: 1.4;
    }
    .spotbox p.point span {
        color: #F00;
    }
	
    .detail {
        padding: 10px;
    }
    .detail dl {
        font-size: 123.1%;
        line-height: 1.4;
        padding: 0;
        margin: 0;
        padding: 6px 0;
        border-bottom: 1px dotted #333;
    }
    .detail dl span {
        font-size: 80%;
    }
    .detail dt {
        clear: left;
        float: left;
        width: 30%;
        font-weight: bold;
    }
    .detail dd {
        margin-left: 30%;
    }
    .detail dl:last-child {
        border-bottom: none;
    }
    .heed {
        font-size: 123.1%;
        background: #FFF;
        margin: 5px 0;
    }
    .slide-box2 {
        width: 25%;
        padding: 10px 14px;
    }
    .slide-box2:nth-child(5n) {
        margin-right: 0;
    }
    .slide-box2:nth-child(-n+5) {
        margin-top: 0;
    }
    .slide-box2 img {
        display: block;
        height: auto;
        width: 100%;
    }
    .slide-box2 p {
        font-size: 153.9%;
        font-weight: bold;
        margin: 0;
        margin: 5px 0;
    }
    .slide-box2 p span {
        font-weight: bold;
    }
    .slide-box2 .Btn {
        overflow: hidden;
        width: 100%;
        height: 60px;
        margin: 0 auto;
        border-radius: 4px;
        /* CSS3草案 */
        -webkit-border-radius: 4px;
        /* Safari,Google Chrome用 */
        -moz-border-radius: 4px;
        /* Firefox用 */
        font-size: 153.9%;
        font-weight: bold;
        margin-bottom: 30px;
    }
    .slide-box2 .Btn a {
        display: block;
        position: relative;
        text-align: center;
        background: #F60;
        color: #fff;
        line-height: 60px;
        text-decoration: none;
    }
    .slide-box2 .Btn a:hover {
        background: #F30;
        /* マウスオーバーカラー */
    }
    .slide-box2 .Btn a:before {
        /*白いひし型 */
        display: block;
        content: "";
        position: absolute;
        -webkit-transform: rotate(45deg);
        transform: rotate(45deg);
        top: 50%;
        left: 15px;
        width: 16px;
        height: 16px;
        margin-top: -8px;
        background: #fff;
    }
    .slide-box2 .Btn a:after {
        /*バックグラウンドと同じ色のひし型をずらして「before要素」を隠す */
        display: block;
        content: "";
        position: absolute;
        -webkit-transform: rotate(45deg);
        transform: rotate(45deg);
        top: 50%;
        left: 10px;
        width: 16px;
        height: 16px;
        margin-top: -8px;
        background: #F60;
    }
    .slide-box2 .Btn a:hover:after {
        /*「after要素」のマウスオーバー（カラーを合わせる） */
        background: #F30;
    }
    .slide-box2 .Btn_gray {
        overflow: hidden;
        width: 100%;
        height: 60px;
        padding-top: 12px;
        border-radius: 4px;
        /* CSS3草案 */
        -webkit-border-radius: 4px;
        /* Safari,Google Chrome用 */
        -moz-border-radius: 4px;
        /* Firefox用 */
        font-size: 123.1%;
        display: block;
        position: relative;
        text-align: center;
        background: #666;
        color: #FFF;
        text-decoration: none;
    }
    .slide-box2 .Btn_gray:before {
        /*白いひし型 */
        display: block;
        content: "";
        position: absolute;
        -webkit-transform: rotate(45deg);
        transform: rotate(45deg);
        top: 50%;
        left: 15px;
        width: 16px;
        height: 16px;
        margin-top: -8px;
        background: #fff;
    }
    .slide-box2 .Btn_gray:after {
        /*バックグラウンドと同じ色のひし型をずらして「before要素」を隠す */
        display: block;
        content: "";
        position: absolute;
        -webkit-transform: rotate(45deg);
        transform: rotate(45deg);
        top: 50%;
        left: 10px;
        width: 16px;
        height: 16px;
        margin-top: -8px;
        background: #666;
    }
    /* =========================================================
◆list横並び
========================================================= */
    *, *:before, *:after {
        box-sizing: border-box;
    }
    .itemList3 {
        float: left;
        width: 100%;
        display: flex;
        display: -ms-flexbox;
        /* IE10 */
        flex-wrap: wrap;
        -ms-flex-wrap: wrap;
        /* IE10 */
    }
    .itemList3>div {
        width: 33.33333%;
        padding: 10px;
    }
    .itemList3>div .Btn {
        overflow: hidden;
        width: 100%;
        height: 80px;
        margin: 0 auto;
        border-radius: 4px;
        /* CSS3草案 */
        -webkit-border-radius: 4px;
        /* Safari,Google Chrome用 */
        -moz-border-radius: 4px;
        /* Firefox用 */
        font-size: 153.9%;
        font-weight: bold;
        margin-bottom: 30px;
    }
    .itemList3>div .Btn a {
        display: block;
        position: relative;
        text-align: center;
        background: #F60;
        color: #fff;
        line-height: 80px;
        text-decoration: none;
    }
    .itemList3>div .Btn a:hover {
        background: #F30;
        /* マウスオーバーカラー */
    }
    .itemList3>div .Btn a:before {
        /*白いひし型 */
        display: block;
        content: "";
        position: absolute;
        -webkit-transform: rotate(45deg);
        transform: rotate(45deg);
        top: 50%;
        left: 15px;
        width: 16px;
        height: 16px;
        margin-top: -8px;
        background: #fff;
    }
    .itemList3>div .Btn a:after {
        /*バックグラウンドと同じ色のひし型をずらして「before要素」を隠す */
        display: block;
        content: "";
        position: absolute;
        -webkit-transform: rotate(45deg);
        transform: rotate(45deg);
        top: 50%;
        left: 10px;
        width: 16px;
        height: 16px;
        margin-top: -8px;
        background: #F60;
    }
    .itemList3>div .Btn a:hover:after {
        /*「after要素」のマウスオーバー（カラーを合わせる） */
        background: #F30;
    }
    .itemList3>div .Btn_gray {
        overflow: hidden;
        width: 100%;
        height: 80px;
        margin: 0 auto;
        border-radius: 4px;
        /* CSS3草案 */
        -webkit-border-radius: 4px;
        /* Safari,Google Chrome用 */
        -moz-border-radius: 4px;
        /* Firefox用 */
        font-size: 153.9%;
        font-weight: bold;
        display: block;
        position: relative;
        text-align: center;
        background: #666;
        color: #FFF;
        line-height: 80px;
        text-decoration: none;
    }
    .itemList3>div .Btn_gray:before {
        /*白いひし型 */
        display: block;
        content: "";
        position: absolute;
        -webkit-transform: rotate(45deg);
        transform: rotate(45deg);
        top: 50%;
        left: 15px;
        width: 16px;
        height: 16px;
        margin-top: -8px;
        background: #fff;
    }
    .itemList3>div .Btn_gray:after {
        /*バックグラウンドと同じ色のひし型をずらして「before要素」を隠す */
        display: block;
        content: "";
        position: absolute;
        -webkit-transform: rotate(45deg);
        transform: rotate(45deg);
        top: 50%;
        left: 10px;
        width: 16px;
        height: 16px;
        margin-top: -8px;
        background: #666;
    }
    .itemList4 {
        width: 100%;
        display: flex;
        display: -ms-flexbox;
        /* IE10 */
        flex-wrap: wrap;
        -ms-flex-wrap: wrap;
        /* IE10 */
    }
    .itemList4>div {
        width: 25%;
        padding: 10px;
    }
    .itemList4>div img {
        width: 100%;
    }
    .itemList4>div dt {
        font-size: 123.1%;
        text-align: center;
    }
    .itemList4>div dd {
        margin: 0;
        /* これがないとずれる */
        font-size: 123.1%;
        line-height: 1.5;
        text-align: left;
        padding: 5px 8px 8px;
        background: #FFFFFF;
    }
    /* =========================================================
◆slider
========================================================= */
    .slider img {
        max-width: 100%;
        width: 100%;
        height: auto;
        padding: 0 10px;
    }
    .slider div p {
        font-size: 123.1%;
        padding: 0 10px 10px;
        text-align: left;
        line-height: 1.5;
    }
    .slider div p img {
        float: left;
        max-width: 32px;
        height: auto;
        padding: 0;
        margin-right: 4px;
    }
    .slider div p .lead {
        font-size: 140%;
    }
    .slide-arrow {
        position: absolute;
        top: 50%;
        margin-top: -120px;
        /*矢印の高さ*/
        cursor: pointer;
    }
    .prev-arrow {
        left: -40px;
        width: 0;
        height: 0;
        border-left: 0 solid transparent;
        border-right: 15px solid #113463;
        border-top: 10px solid transparent;
        border-bottom: 10px solid transparent;
        background: rgba(255, 255, 255, 0);
        /*背景白を透過*/
    }
    .next-arrow {
        right: -40px;
        width: 0;
        height: 0;
        border-right: 0 solid transparent;
        border-left: 15px solid #113463;
        border-top: 10px solid transparent;
        border-bottom: 10px solid transparent;
        background: rgba(255, 255, 255, 0);
        /*背景白を透過*/
    }
    .slick-slide {
        opacity: 0.5;
        background: rgba(255, 255, 255, 0);
        /*背景白を透過*/
    }
    .slick-active {
        opacity: 0.5;
    }
    .slick-center {
        opacity: 1 !important;
    }
    .slide_selector {
        z-index: 1 !important;
        position: relative;
        overflow: hidden;
    }
    /* =========================================================
◆アコーディオン
========================================================= */
    .cp_box *, .cp_box *:before, .cp_box *:after {
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
    }
    .cp_box {
        width: auto;
        margin: 0.5em auto 2em;
    }
    .cp_box label {
        position: relative;
        display: block;
        width: 100%;
        padding: 10px;
        cursor: pointer;
        transition: all 0.3s;
        text-align: center;
        color: #FFF;
        background: #000066;
        border-radius: 0.2em;
        font-size: 123.1%;
    }
    .cp_box label span {
        font-size: 70%;
    }
    .cp_box label:hover {
        transition: all 0.3s;
        color: #ffffff;
        background: #000099;
    }
    .cp_box label::after {
        font-family: 'FontAwesome';
        content: ' \f067';
        color: #FFF;
    }
    .cp_box label:hover::after {
        color: #FFF;
    }
    .cp_box input:checked~label::after {
        font-family: 'FontAwesome';
        content: ' \f068';
        color: #FFF;
    }
    .cp_box input:checked~label:hover::after {
        color: #FFF;
    }
    .cp_box input {
        display: none;
    }
    .cp_box .cp_container {
        position: relative;
        z-index: 10;
        overflow: hidden;
        height: 0;
        margin-top: -1px;
        transition: height 0.3s ease-in-out, box-shadow 0.6s linear;
    }
    .cp_box input:checked~div {
        transition: height 0.5s ease-in-out, box-shadow 0.1s linear;
    }
    /* 続きを読むを押すと表示されるテキストの高さ */
    .cp_box input:checked~div.cp_container {
        height: auto;
    }
    /* =========================================================
◆観光列車
========================================================= */
    .aboutBox,
    .aboutBox02 {
        margin: 10px 20px;
    }
    .aboutBox .photo,
    .aboutBox02 .photo {
        float: left;
        margin-right: 10px;
    }
    .aboutBox .photo img {
        width: 500px;
        height: auto;
    }
    .aboutBox02 .photo img {
        width: 300px;
        height: auto;
    }
    .aboutBox .detail,
    .aboutBox02 .detail {
        width: 100%;
        font-size: 123.1%;
        line-height: 1.5;
		
    }
    .aboutBox02 .detail img {
        margin-top: 30px;
    }
	.ekiin{
		max-width: 200px;
		float: right;
		
		margin: 50px 0 0 0;
	}
	
    /* =========================================================
◆ボタン
========================================================= */
	.Btn {
		width: 70%;
		margin: 0 auto;
	}
	
    .Btn a {
		display: block;
        color: #fff;
        
        margin: 20px auto 5px;
        text-align: center;
        background: #F60;
        border-radius: 5px;
        padding: 20px 30px;
        position: relative;
        /* 追記 */
        font-size: 153.9%;
        line-height: 1.4;
        font-weight: bold;
    }
    .Btn a {
        color: #fff;
    }
    .Btn a span {
        font-size: 75%;
        font-weight: normal;
    }
    .Btn a::after {
        content: "＞";
        position: absolute;
        top: 50%;
        left: 10px;
        transform: translateY(-50%);
    }
	
	.Btn a:hover{
		opacity: 0.8;
	}
	
    .Btn_gray {
        color: #fff;
        width: 70%;
        margin: 20px 1% 5px;
        text-align: center;
        background: #666;
        border-radius: 5px;
        padding: 20px 30px;
        position: relative;
        /* 追記 */
        font-size: 153.9%;
        font-weight: bold;
    }
    .Btn_gray::after {
        content: "＞";
        position: absolute;
        top: 50%;
        left: 10px;
        transform: translateY(-50%);
    }
    .Btn_gray a {
        pointer-events: none;
        color: #ffffff !important;
    }
    /*固定ボタン
.upper a {
	position: fixed;
	right: 110px;
	bottom: 26px;
	transition: 1s;
	width: 300px;
	padding: 20px 10px;
	border-radius: 4px;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
	font-size: 153.9%;
	font-weight: bold;
	background: #F60;
	color: #fff;
	text-align: center;
	z-index: 1000;
}
.upper a:hover{
	opacity: 1;
	background: #F30;
}
*/
	.spotintro{
		margin: 0 0 50px 0;
	}
	
	.spotintrotit{
		text-align: center;
		font-weight: bold;
		font-size: 20px;
		color: #ffffff;
		background-color: #F89A31;
		margin: 0 0 30px 0;
		padding: 10px 10px;
	}
	
	.spotintro ul li{
		max-width: 970px;
		width: 100%;
		margin: 0 auto 30px;
	}
	
	.spotintro ul li:last-of-type{
		margin: 0 auto 0 !important;
	}
	.spotintro ul li img{
		width: 100%;
	}
	
    .topic_area {
        margin: 0 0 0 0;
    }
    .topic_intro {
        text-align: center;
        font-size: 24px;
        font-weight: bold;
        margin: 50px 0;
    }
    .redtxt {
        color: #FF0004;
    }
    .purpletxt {
        color: #C457FC;
    }
    .topicboxarea {
        /*margin: 70px 0 20px 0;*/
        margin: 0px 0 20px 0;
    }
    .topicboxarea2 {
        margin: 0px 0 20px 0;
    }
    .topictit {
        padding: 1rem 0 3rem;
    }
    /*
.topictit::after {
   font-size: 18px;
    position: absolute;
    top: -32px;
    left: 0;
     height: 24px; 
    padding: 5px 1em;
    color: #fff;
    border-radius: 10px 10px 0 0;
    background-color: #B90003;
  }

.point1::after{
	content: '\その①';
}


.point2::after{
	content: '\その②';
}
*/
    .topic_introduction {
        margin: 20px 0 20px 0;
        display: flex;
        justify-content: space-between;
        align-items: flex-start;
        padding: 20px;
        background-color: #FFFFD9;
    }
    .topic_introduction2 {
        margin: 20px 0 20px 0;
        padding: 20px;
        background-color: #FFFFD9;
    }
    .topic_introduction2 .introduction_txt {
        font-size: 18px;
        width: 100% !important;
        line-height: 2.3;
    }
    .introduction_txt {
        font-size: 18px;
        width: 78%;
        line-height: 2.3;
    }
    .introduction_txt strong {
        font-size: 18px;
        font-weight: bold;
        text-decoration: underline;
        display: block;
    }
    .introduction_img {
        max-width: 400px;
        width: 17%;
    }
    .introduction_img img {
        width: 100%;
    }
    /*
.spotboxarea{
	display: flex;
	justify-content: space-between;
	align-items: stretch;
	flex-wrap: wrap;
	
}
*/
    .spotboxarea {
        display: flex;
        justify-content: flex-start;
        align-items: stretch;
        flex-wrap: wrap;
    }
    .spottit {
        position: relative;
        padding: 1rem 1rem;
        border-radius: 10px;
        font-size: 18px;
        font-weight: bold;
        margin: 0 0 20px 0;
    }
    .spottit:after {
        position: absolute;
        bottom: -9px;
        left: 1em;
        width: 0;
        height: 0;
        content: '';
        border-width: 10px 10px 0 10px;
        border-style: solid;
    }
    /*
.spotbox{
	border: 1px solid #cccccc;
	margin: 0 0 20px 0;
	width: 32.5%;
	background-color: #ffffff;
}
*/
    .spotbox {
        border: 1px solid #cccccc;
        margin: 0 0px 20px 0px;
        width: 100%;
        background-color: #ffffff;
        position: relative;
		max-width: 400px;
    }
    .spotbox .cp_box {
        padding: 0px 10px;
    }
    .spotimg {
        max-width: 400px;
        width: 100%;
    }
    .spotimg img {
        width: 100%;
    }
    .spotdetail {
        padding: 10px 10px;
    }
    .spotdetail dt {
        margin: 0px 0 10px 0;
        font-size: 16px;
        color: #C062FF;
        font-weight: bold;
    }
    .spotdetail dt span {
        display: block;
        color: #000000;
        font-size: 14px;
        margin: 10px 0 0 0;
    }
    .spotdetail dd {
        padding: 10px;
        background-color: #FFFFD9;
        font-size: 16px;
        line-height: 1.8;
        margin: 0;
    }
    .spotarea2 {
        display: flex;
        justify-content: space-between;
        align-items: flex-start;
        margin: 20px 0 20px 0;
    }
    .spotarea2img {
        max-width: 518px;
        width: 50%;
    }
    .spotarea2img img {
        width: 100%;
    }
    .spotarea2detail {
        font-size: 16px;
        line-height: 2;
        width: 48%;
    }
    .spotarea2detail strong {
        display: block;
        margin: 0 0 10px 0;
        font-size: 18px;
    }
    #coupon {
        overflow: hidden;
        background-color: rgba(255, 255, 255, 1);
        background-image: repeating-linear-gradient(0deg, transparent, transparent 8px, rgba(255, 252, 209, 1) 8px, rgba(255, 252, 209, 1) 16px);
    }
    .coupondetailalea p.title1 {
        width: 50%;
        line-height: 60px;
        margin: 20px auto;
        font-size: 24px;
        font-weight: bold;
        color: #FFFFFF;
        text-align: center;
        background: #E2201B;
        padding: 4px;
        box-shadow: -4px 4px 0px -2px #E2201B;
        display: block;
    }
    .coupondetailalea p.title1 span {
        border: 4px solid #FFFFFF;
        width: 100%;
        display: block;
    }
    .coupondetailalea p.title1::after {
        content: '';
        background-image: none !important;
    }
    .coupondetailalea h3.title2 {
        width: 50%;
        line-height: 60px;
        margin: 20px auto;
        font-size: 24px;
        font-weight: bold;
        color: #FFFFFF;
        text-align: center;
        background: #0044FF;
        padding: 4px;
        box-shadow: -4px 4px 0px -2px #0044FF;
    }
    .coupondetailalea h3.title2 span {
        border: 4px solid #FFFFFF;
        width: 100%;
        display: block;
    }
    .coupondetailalea h3.title2::after {
        content: '';
        background-image: none !important;
    }
    .coupondetailalea .comment_box {
        width: 90%;
        margin: 20px auto 40px;
        background: rgba(255, 255, 255, 0.8);
        padding: 30px 20px;
        text-align: center;
        border-radius: 30px;
        box-shadow: 2px 2px rgba(0, 0, 0, 0.1);
    }
    .coupondetailalea .comment_box p {
        font-size: 16px;
        line-height: 1.8;
    }
    .coupondetailalea .step_unit {
        width: 100%;
        display: flex;
        flex-wrap: wrap;
        margin: 60px 0 20px;
    }
    .coupondetailalea .step_box {
        width: 30.3%;
        margin: 0 1.5%;
        background: #FFFFFF;
        border: 2px solid #ffe100;
        border-radius: 20px;
        text-align: center;
        padding: 35px 15px 10px;
        position: relative;
        font-size: 14px;
    }
    .coupondetailalea .step_box h4 {
        position: absolute;
        top: -55px;
        left: 0;
        right: 0;
        width: 100%;
        background: url("../images/bg_title_step.svg")no-repeat center center;
        background-size: contain;
        font-size: 160%;
        font-weight: bold;
        color: #FFFFFF;
        text-align: center;
        padding: 10px 0 20px;
    }
    .coupondetailalea .step_box img {
        max-width: 90%;
        margin: 10px auto;
    }
    img#qrcode {
        width: 70%;
    }
    .coupondetailalea .step_box .fukidashi {
        background: url("../images/fukidashi.png")no-repeat center center;
        background-size: contain;
        padding: 30px 0 20px;
        margin-top: -10px;
    }
    .coupondetailalea a.link_pdf {
        width: 50%;
        display: block;
        margin: 30px auto 80px;
        background: #e2201b;
        font-size: 180%;
        font-weight: bold;
        color: #FFFFFF;
        text-align: center;
        line-height: 60px;
        text-decoration: none;
    }
    .coupondetailalea a.link_pdf img {
        width: 25px;
        vertical-align: middle !important;
        margin-left: 5px;
    }
    .coupondetailalea a.link_pdf:hover {
        text-decoration: none !important;
        color: #FFFFFF !important;
        opacity: 0.8;
    }
    .access_site {
        background: url("../images/icon_access.jpg")no-repeat left center;
        background-size: 40px;
        padding-left: 45px;
        text-align: left;
    }
    .entry_site {
        /*background: url("images/receiving_screen.png")no-repeat left top;
  background-size: 60%;
	padding: 40px 0 20px 60%;*/
        text-align: left;
        margin: 10px 0 15px;
        list-style: none;
        padding: 0;
    }
    .entry_site li {
        margin-bottom: 15px;
        text-indent: -1em;
        margin-left: 1em;
    }
    .entry_site li p.attention2 {
        margin-left: 1em;
    }
    .coupon_titarea {
        display: flex;
        justify-content: center;
        align-items: center;
        background-color: #ffffff;
        padding: 20px 20px;
        border: 2px solid #ffe100;
        margin: 0 0 20px 0;
        border-radius: 20px;
    }
	.couponflex{
		padding: 0 30px 0 0;
        width: 26%;
	}
    .coupontitsubtop {
        display: flex;
        justify-content: center;
        align-items: center;
        border: solid 3px #E2201B;
        padding: 10px;
        border-radius: 10px;
        margin-bottom: 10px;
    }
.coupontitsubtop span {
        background: #E2201B;
        display: block;
        color: #FFF;
        padding: 5px 0 0;
        font-size: 20px;
        margin-bottom: 10px;
}	
    .coupontitsubtop p {
        text-align: center;
        padding: 0px;
        color: #E2201B;
        font-weight: bold;
        font-size: 24px;
    }	
    .coupontitsub {
        display: flex;
        justify-content: center;
        align-items: center;
        background: #E2201B;
        padding: 5px;
        border-radius: 10px;
    }
    .coupontitsub p {
        /*border: 4px solid #ffffff;*/
        text-align: center;
        border-radius: 20px;
        padding: 0px;
        display: flex;
        justify-content: center;
        align-items: center;
        color: #ffffff;
        font-weight: bold;
        font-size: 24px;
    }
    .coupontitmain {
        /*width: 75%;*/
    }
    .couponsubtit {
        margin: 0 0 10px 0;
        font-size: 18px;
        font-weight: bold;
    }
    .coupontxt1 {
        color: #ffffff;
        background-color: #3333ff;
        padding: 5px;
        display: inline-block;
        margin: 0 5px 0 0;
    }
    .coupontxt2 {
        color: #ffffff;
        background-color: #ff66cc;
        padding: 5px;
        display: inline-block;
        margin: 0 5px 0 0;
    }
    .coupontxt3 {
        color: #ffffff;
        background-color: #00b050;
        padding: 5px;
        display: inline-block;
        margin: 0 5px 0 0;
    }
    .coupontxt4 {
        color: #ffffff;
        background-color: #ff6600;
        padding: 5px;
        display: inline-block;
        margin: 0 5px 0 0;
    }
    .coupontxt5 {
        color: #ffffff;
        background-color: #00206f;
        padding: 5px;
        display: inline-block;
        margin: 0 5px 0 0;
    }
    .couponmaintit {
        font-size: 60px;
        color: #2f5597;
        font-weight: bold;
        margin: 0 0 0 0;
    }
    .couponkikan {
        border-radius: 10px;
        border: 2px #000000 solid;
        padding: 10px;
        font-size: 16px;
        font-weight: bold;
        background-color: #ffffff;
        text-align: center;
    }
    .couponchui {
        list-style: none;
        margin: 10px 0 0 0;
        padding: 0;
    }
    .couponchui li {
        display: flex;
        justify-content: flex-start;
        align-items: flex-start;
    }
    .couponchui li span {
        display: block;
    }
    .couponchui li span.mark {
        margin: 0 5px 0 0;
    }
    .coupondetailalea2 {
        margin: 20px 0 40px 0;
        background-color: #ffffff;
		padding: 0 0 20px 0;
    }
    .coupondetailalea2 .chui {
        color: #E2201B;
        font-size: 14px;
        margin: 20px 0 20px 10px;
    }
    h5.coupondetailbox_tit {
        font-size: 24px;
        color: #ffffff;
        text-align: center;
        padding: 10px 20px;
        background-color: #ff66cc;
        margin: 0;
    }
    .coupondetailbox {
        background-color: #0A75CD;
        padding: 20px 20px;
        margin: 0 0 20px 0;
    }
    .coupondetailboxin {
        /*display: flex;
	justify-content: center;
	align-items: stretch;*/
    }
    .coupondetail_koumoku {
        font-size: 24px;
        width: 100%;
        font-weight: bold;
        color: #ffffff;
        text-align: center;
        margin: 0 0 20px 0;
        padding: 0;
    }
    .coupondetail_naiyoubox {
        background-color: #ffffff;
       /* padding: 20px;*/
        width: 100%;
    }
    .coupondetail_naiyouboxin {
        display: flex;
        justify-content: flex-start;
        align-items: stretch;
        flex-wrap: wrap;
    }
    .coupondetail_naiyou1 {
        width: 35%;
    }
    .coupondetail_naiyou1 ul {
        display: flex;
        justify-content: space-between;
        align-items: center;
        list-style: none;
        margin: 0 0 0 0;
        padding: 0 0 0 0;
    }
    .coupondetail_naiyou1_box1 {
        font-size: 20px;
        font-weight: bold;
        text-align: center;
    }
    .coupondetail_naiyou1_box1 span {
        font-size: 16px;
    }
    .coupondetail_naiyou1_box2 {
        font-size: 18px;
        font-weight: bold;
        text-align: center;
        color: #FFFFFF;
        background-color: #92d050;
        padding: 10px 10px;
        display: flex;
        justify-content: center;
        align-items: stretch;
        width: 51%;
    }
    .coupondetail_naiyou2 {
        font-size: 18px;
        text-align: center;
        display: flex;
        justify-content: center;
        align-items: center;
        width: 10%;
    }
    .coupondetail_naiyou3 {
        position: relative;
        width: 33.7%;
    }
    .coupondetail_naiyou3 ul {
        display: flex;
        justify-content: space-between;
        align-items: center;
        list-style: none;
        margin: 0;
        padding: 10px;
        background-color: #ffc000;
    }
    .coupondetail_naiyou3_box1 {
        font-size: 20px;
        font-weight: bold;
        text-align: center;
        color: #FFFFFF;
        display: flex;
        justify-content: center;
        align-items: center;
        width: 59%;
    }
    .coupondetail_naiyou3_box2 {
        width: 37%;
        max-width: 400px;
    }
    .coupondetail_naiyou3_box2 img {
        width: 100%;
    }
    .coupondetail_naiyou3 .righttxt {
        font-size: 14px;
        position: absolute;
        right: 0px;
        bottom: -34px;
    }
    .coupondetail_naiyou_bottom1 {
        font-size: 20px;
        font-weight: bold;
    }
    .coupondetail_naiyou_bottom2 {
        font-size: 14px;
        color: #E2201B;
    }
    .coupondetail_naiyouboxin2 {
        padding: 10px;
        background-color: #FFFFD9;
    }
    .coupondetail_naiyouboxin_1 {
        display: flex;
        justify-content: flex-start;
        align-items: stretch;
    }
    .coupondetail_naiyou4 {
        font-size: 20px;
        color: #ffffff;
        text-align: center;
        padding: 10px 20px;
        background-color: #ff66cc;
        margin: 0 20px 0 0px;
        font-weight: bold;
        width: 40%;
    }
    .coupondetail_naiyou5 {
        font-size: 24px;
        color: #E2201B;
        font-weight: bold;
        display: flex;
        justify-content: center;
        align-items: center;
    }
    .coupondetail_naiyou5 span {
        font-size: 14px;
        padding: 0 0 0 10px;
    }
    .nimotsutit {
        font-size: 18px;
        font-weight: bold;
        margin: 0 0 10px 0;
    }
    .nimotsutit span {
        text-decoration: underline;
    }
    .coupondetail_naiyouboxin2 ul {
        list-style: none;
        margin: 0 0 0 0;
        padding: 0 0 0 0;
    }
    .coupondetail_naiyouboxin2 ul li {
        font-size: 16px;
    }
    .couponlistarea {
        background-color: #0A75CD;
        padding: 20px 20px;
    }
    .couponlistbox {
        margin: 0 0 20px 0;
        background-color: #ffffff;
        padding: 10px;
    }
    .couponlistbox .slide-box p.point,
    .couponlistbox .slide-box p.point {
        background: #e6ffce !important;
    }
    .areatit {
        padding: 10px 0px 25px;
        text-align: center;
        font-size: 24px;
        background-color: #0A75CD;
        color: #ffffff;
        font-weight: bold;
    }
    .bluetxt {
        color: #0054FF;
        font-size: 14px !important;
    }
    .boxlong {
        padding: 10px;
    }
    .boxlong p {
        font-size: 123.1%;
    }
    .boxlong p span {
        font-weight: bold;
    }
    .boxlong p.point {
        background: #e6ffce;
        padding: 10px;
        margin-top: 10px;
        line-height: 1.4;
    }
    .boxlong p.point span {
        color: #F00;
    }
    .boxlong_couponarea {
        display: flex;
        justify-content: space-between;
        align-items: stretch;
    }
    .boxlong_coupon1 {
        width: 45%;
    }
    .boxlong_coupon2 {
        font-size: 24px;
        display: flex;
        justify-content: center;
        align-items: center;
        text-align: center;
    }
    .boxlong_coupon1 ul {
        display: flex;
        justify-content: center;
        align-items: stretch;
        list-style: none;
        margin: 0;
        padding: 0;
    }
    .boxlong_coupon1 ul li {
        width: 100%;
    }
    .boxlong_coupon1 ul li.txtarea {
        display: flex;
        justify-content: center;
        align-items: center;
        padding: 0 10px;
        font-size: 18px;
        font-weight: bold;
        color: #ffffff;
        background-color: #ff66cc;
        line-height: 1.5;
        height: 143px;
    }
    .boxlong_coupon1 ul li.imgarea {
        max-width: 400px;
    }
    .boxlong_coupon1 ul li.imgarea img {
        width: 100%;
        vertical-align: bottom;
    }
    .cap {
        padding: 10px;
        background-color: #e6ffce;
    }
    .cap p {
        text-align: center;
        font-size: 14px;
        font-weight: bold;
        margin: 0;
    }
    .commodityarea {
        position: relative;
        padding: 20px;
        background-color: #ffffff;
        margin: 30px 0 0px 0;
    }
    .commodity1 {
        border: 2px solid #0952d3;
    }
    .commodity2 {
        border: 2px solid #8cc457;
    }
	
	.commodityred {
    border: solid #E2201B;
    border-radius: 10px;
}
	
	.commodityred span {
        color: #FFFFFF;
        display: block;
        background: red;
        padding: 5px 15px 0;
        margin: 0 auto 10px;
        width: fit-content;
}
	
.commodityredtit {
        color: #E2201B;
	        font-size: 24px;
        text-align: center;
        padding: 20px 0 30px 0;
        font-weight: bold;
}
    .commoditytit {
        font-size: 24px;
        text-align: center;
        margin: 0 0 20px 0;
        padding: 20px 0 30px 0;
        font-weight: bold;
    }
	
	.commoditytit .commoditytitin{
		/*width: 100%;*/
		border-radius: 20px;
		margin: 0 auto;
		color: #ffffff;
		padding: 20px;
	}
	
	
    .commodity1 .commoditytit {
        border-bottom: dotted 2px #0952d3;
    }
	
	 .commodity1 .commoditytit .commoditytitin{
		background-color: #0952d3;
		
	}
	
	
    .commodity2 .commoditytit {

        border-bottom: dotted 2px #8cc457;
    }
	
	 .commodity2 .commoditytit .commoditytitin{
		background-color: #8cc457;
		
	}
	
	.commodity_txt{
		text-align: center;
		font-size: 18px;
		margin: 0 0 20px 0;
	}
	
	.commodity_txt strong{
		font-weight: bold;
	}
	
	.commodity_txt2{
		text-align: center;
		font-size: 20px;
		padding: 20px;
		border: 2px solid #0B449C;
		margin: 20px 0 0px 0;
		border-radius: 15px;
		background-color: #ffffff;
	}
	
	.commodity_txt2 strong{
		font-weight: bold;
	}
	
    .commodity_chui {
        color: #E00003;
        font-size: 16px;
        margin: 0 0 20px 0;
        text-align: center;
    }
    .commoditybtn {
        display: flex;
        justify-content: center;
        align-items: center;
    }
    .commoditybtn .Btn {
        margin: 0 2% 0 2%;
        /*width: 48% !important;*/
        /*width: 32% !important;*/
    }
    .kouchiillust {
        position: absolute;
    }
    .kouchiillust img {
        width: 100%;
    }
    .illust1 {
        max-width: 122px;
        width: 5% !important;
        top: -6px;
        left: 110px;
    }
    .illust2 {
        max-width: 165px;
        width: 9%;
        top: 48px;
        right: 75px;
    }
    .illust3 {
        max-width: 133px;
        width: 7%;
        top: 34px;
        left: 90px;
    }
    .illust4 {
        max-width: 161px;
        width: 10%;
        top: 49px;
        right: 74px;
    }
    .illust5 {
        max-width: 144px;
        width: 8%;
        top: 33px;
        left: 77px;
    }
    .b_txtcenter {
        text-align: center !important;
        font-weight: bold;
        color: #FF0004;
        font-size: 20px !important;
    }
    .spottit1 {
        color: #2f5597;
        background: #c6d9ff;
    }
    .spottit1:after {
        border-color: #c6d9ff transparent transparent transparent;
    }
    .spottit2 {
        color: #d1296d;
        background: #ffbcd7;
    }
    .spottit2:after {
        border-color: #ffbcd7 transparent transparent transparent;
    }
    .spottit3 {
        color: #18A84C;
        background: #B7FDCC;
    }
    .spottit3:after {
        border-color: #B7FDCC transparent transparent transparent;
    }
    .spottit4 {
        color: #B234F3;
        background: #F5CAFF;
    }
    .spottit4:after {
        border-color: #F5CAFF transparent transparent transparent;
    }
    .red {
        color: #E2201B;
    }
    .purple {
        color: #6500F5;
    }
    .deepblue {
        color: #0B449C;
    }
    /*　観光・イベント情報　*/
    .act_box {
        width: 950px;
        border: 1px solid #ccc;
        border-radius: 8px;
        overflow: hidden;
        background-color: #ffffff;
        box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
        margin: 0 auto 30px;
    }
	
    .act_txtbox {
        display: flex;
        flex-direction: column;
        justify-content: flex-start;
        /*align-items: center;*/
    }
    .actred {
        background-color: #e2201b;
    }
    .actyellow {
        background-color: #ffc000;
    }
    .actblue {
        background-color: #0A75CD;
    }
    .act_title {
        color: #ffffff;
        padding: 10px;
        font-weight: bold;
        display: inline-block;
        border-radius: 8px 0 0 0;
        font-size: 20px;
    }
    .act_content {
        display: flex;
        padding: 20px;
    }
    .act_im {
        width: auto;
        height: 300px;
        object-fit: cover;
        margin-right: 20px;
    }
    .act_txtbox {
        flex-grow: 1;
        line-height: 1.5;
    }
    .act_txtbox .act_titletxt {
        font-size: 1.5rem;
        line-height: 1.8;
        font-weight: bold;
        margin-bottom: 10px;
		text-align: center;
    }
    .act_titletxt span {
        background-color: #ffff66;
        color: red;
    }
    .act_txtbox .act_subtitle {
        color: #ffffff;
        text-align: center;
        padding: 5px;
        margin-bottom: 10px;
        font-size: 20px;
        font-weight: bold;
    }
    .act_txtbox .act_txt {
        color: #0952d3;
        font-weight: bold;
        margin-bottom: 10px;
        font-size: 16px;
    }
	
	.event_box {
    margin: 3rem auto;
    text-align: center;
    padding: 2rem;
    background: #FFFFD9;
    border: 3px solid #003287;
    border-radius: 40px;
}
	
        .eventtitle {
            position: relative;
            display: inline-block;
            padding: 10px 20px;
            color: #0066cc;
                    font-size: 2rem;
            font-weight: bold;
            margin-bottom: 20px;
        }

        .eventtitle::before,
        .eventtitle::after {
            content: '';
            position: absolute;
            top: 50%;
            width: 30px;
            height: 2px;
            background-color: #0066cc;
        }

        .eventtitle::before {
            left: -20px;
            transform: rotate(45deg);
        }

        .eventtitle::after {
            right: -20px;
            transform: rotate(-45deg);
        }
    .topic_txt {
        color: #000000;
        font-weight: bold;
        margin-bottom: 10px;
                font-size: 17px;
        text-align: center;
    }
    .topic_txt span {
        color: red;
    }
    .link_txt {
        color: #000000;
        margin: 10px 0 0;
        font-size: 16px;
    }
    .detail {
        width: 100%;
        box-sizing: border-box;
        padding: 10px;
    }
    .detail dl {
        font-size: 123.1%;
        line-height: 1.4;
        margin: 0;
        padding: 6px 0;
        border-bottom: 1px dotted #333;
    }
    .detail dl span {
        font-size: 80%;
    }
    .detail dt {
        clear: left;
        float: left;
        width: 5.5em;
        font-weight: bold;
    }
    .detail dd {
        margin-left: 5.5em;
    }
    .detail dl:last-child {
        border-bottom: none;
    }
	



/* ----------------------------------------------- 

# modelcourse

----------------------------------------------- */
.modelin {
	margin: 0 auto 30px;
	padding: 0 !important;
}

/*modelBox_top*/
.modelBox_top{
position: relative;
margin: 0 0 20px;
padding: 0 0 10px 0;
width: calc(100% / 2 - 20px);
background-size: 13px;
border-radius: 10px;
}
#modelcourse.kansai .modelBox_top{
width: calc(100% / 2 - 20px);
}

.modelBox_top a{
display: block;
text-decoration: none;
color: #fff;
/*text-shadow: 0px 0px 5px rgba(0,0,0,1);*/
text-shadow: black 1px 1px 2px, black -1px -1px 2px;

}
.modelBox_top a:hover{
text-decoration: none !important;
}
.modelBox_top:nth-child(4n){
margin-right:0;
}
.modelImg_top{
margin: 0;
padding: 0;
}
.modelImg_top img{
width: 100%;
border-radius: 10px 10px 0 0;
}

.modelTitle_top{
margin: 0;
padding: 10px 15px;
font-weight: bold;
text-align: center;
font-family: YuMincho, "Yu Mincho", "Hiragino Mincho ProN", "serif";
	font-size: 1rem;

}
.modelTitle_top span{
font-size: 0.8rem;
font-weight: lighter;
}
.modelBox_top a::after {
  content: "";
  display: block;
  height: 100%;
  left: 0;
  position: absolute;
  top: 0;
  width: 100%;
}


#modelcourse {
padding-bottom: 50px;
}
.modellink{
display: -webkit-flex;
display: -moz-flex;
display: -ms-flex;
display: -o-flex;
display: flex;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
	flex-wrap: wrap;
margin: 30px auto 0;
width: 950px;
text-align: center;
}
.modelBox_top{
position: relative;
display: block;
z-index: 1;
padding: 30px 0;
}
.modelBox_top::after{
content:'';
opacity: 1;
top: 0;
left: 0;
bottom: 0;
right: 0;
position: absolute;
z-index: -1;
border-radius: 10px;
filter: grayscale(100%);
transition-duration: 0.5s;
}
.modelBox_top:hover::after{
filter: grayscale(0);
transition-duration: 0.5s;
}

/*.modelBox_top:nth-child(1)::after{
background-image: url("../images/arrow_white.png"),url(../images/top-model001.jpg);
background-position:  center 97%,center center;
background-repeat: no-repeat,no-repeat;
background-size: auto,cover;
}*/
.modelBox_top:nth-child(1)::after{
background-image: url("../images/arrow_white.png"),url(../images/top-model003.jpg);
background-position:  center 97%,center center;
background-repeat: no-repeat,no-repeat;
background-size: auto,cover;
}
.modelBox_top:nth-child(2)::after{
background-image: url("../images/arrow_white.png"),url(../images/top-model004.jpg);
background-position:  center 97%,center center;
background-repeat: no-repeat,no-repeat;
background-size: auto,cover;
}
	
.modelBox_top:nth-child(3)::after{
background-image: url("../images/arrow_white.png"),url(../images/top-model001.jpg);
background-position:  center 97%,center center;
background-repeat: no-repeat,no-repeat;
background-size: auto,cover;
}
.modelBox_top:nth-child(4)::after{
background-image: url("../images/arrow_white.png"),url(../images/top-model002.jpg);
background-position:  center 97%,center center;
background-repeat: no-repeat,no-repeat;
background-size: auto,cover;
}	

#modelcourse.kansai .modelBox_top:nth-child(1)::after{
background-image: url("../images/arrow_white.png"),url(../images/top-model004.jpg);
background-position:  center 97%,center center;
background-repeat: no-repeat,no-repeat;
background-size: auto,cover;
}
#modelcourse.kansai .modelBox_top:nth-child(2)::after{
background-image: url("../images/arrow_white.png"),url(../images/top-model005.jpg);
background-position:  center 97%,center center;
background-repeat: no-repeat,no-repeat;
background-size: auto,cover;
}
#modelcourse .modelTitle_top{
box-sizing: border-box;
font-size: 16px;
/*
background: rgba(0,0,0,0.3);
height: 4.5em;
padding-top: 1em;*/
}
/*
.modelBox_top:nth-child(2) .modelTitle_top {
padding-top: 0.5em;
}

#modelcourse.kansai .modelTitle_top{
height: 5em;
padding-top: .5em;
}
*/
/*
.modelBox_top:nth-child(1) .modelTitle_top {
background: rgba(0,0,0,0.3);
}
.modelBox_top:nth-child(3) .modelTitle_top {
padding-top: 1.5em;
}
*/

#modelcourse .inner{
margin: 0 auto 60px auto !important;
padding: 20px !important;
width:910px !important;
background: #fff;
}



#modelcourse h3{
position: relative;
padding: 20px 115px 10px;
font-size: 24px;
text-align: center;

}
/*#modelcourse h3 br{display: none;}*/
#modelcourse h3 span{
padding: 0 0 0 30px;
font-size: 16px;
text-align: center;
}



#modelcourse .lead{
text-align: center;
}
#modelcourse p{
margin: 0;
font-size: 13px;
line-height: 1.5;
}

#modelcourse .day{
margin: 20px 0 15px 0;
padding: 3px 20px 3px 20px;
background: #00b0f0;
border-left:solid 15px #0066cc;
color: #fff;
font-size: 20px;
font-weight: bold;
font-family: YuMincho, "Yu Mincho", "Hiragino Mincho ProN", "serif";
}
#modelcourse .day:first-letter{
font-size: 28px;
}

.modelbox{
position: relative;
/*width: 440px;*/
padding-left: 470px;
box-sizing: unset;
}
.ic-place{
padding: 5px 5px 5px 50px;
background: url(../images/ic-place.png) no-repeat 25px center;
background-size: 13px;
}
.ic-train{
padding: 5px 5px 5px 50px;
min-height: 20px;
background: url(../images/ic-train.png) repeat-y 28px center;
background-size: 7px auto;
}
.ic-bus{
padding: 5px 5px 5px 50px;
min-height: 20px;
background: url(../images/ic-bus.png) repeat-y 28px center;
background-size: 7px auto;
}
.ic-walk{
padding: 5px 5px 5px 50px;
min-height: 20px;
background: url(../images/ic-walk.png) repeat-y 29px center;
background-size: 4px auto;
}
.ic-arrow{
padding: 5px 5px 5px 50px;
min-height: 20px;
background: url(../images/ic-arrow.png) repeat-y 24px top;
background-size: 16px auto;
}


img.ic-car {
	display: inline;
	width: 44px;
	height: auto;
}
img.ic-bus2 {
	display: inline;
	width: 38px;
	height: auto;
}
img.ic-ropeway {
	display: inline;
	width: 35px;
	height: auto;
}
img.ic-train2 {
	display: inline;
	width: 40px;
	height: auto;
}
img.ic-walk2 {
	display: inline;
	width: 35px;
	height: auto;
}







.spotlist dt{
margin: 0;
padding:0;
font-weight: bold;
color:#d02e58;
}
.spotlist dt span{
font-weight: normal;
}
.spotlist dd{
margin: 0;
padding:0;
}

.mImage{
position: absolute;
left: 0;
width:440px;
height: auto;
}
.mImage img{
margin-bottom: 5px;
}
.mPlace{
margin: 10px 0;
background: #fffddf;
}
.mName{
position: relative;
padding: 5px 10px;
background: #d02e58;
color: #fff;
font-size: 18px !important;
font-weight: bold;
}
.ic-photo{
padding-left: 50px;
background: #00b0f0 url(../images/ic-photo.png) no-repeat 12px 10px;
background-size: 22px auto;
}
.mName-parts{
position: absolute;
right:10px;
top:5px;
margin-top: 2px;
padding: 2px 6px;
background: #fff;
color: #d02e58;
font-size: 12px !important;
font-weight: lighter;
border-radius: 14px;
}
.mTxt{
padding: 16px 20px 6px 20px;
}
.mTxt p{
padding-bottom: 10px;
}
.mTxt p.frame {
	padding: 5px;
	border: 1px dashed #696de5;
}


/*各モデルコースの設定・写真の位置調整*/
/*model1*/
#model1 .modelbox.day1{
min-height: 360px;
}
#model1 .modelbox.day2 {
/*min-height: 920px;*/
}
#model1 .model1-day1-1,
#model1 .model1-day2-1 {
top:70px;
}
#model1 .model1-day1-2,
#model1 .model1-day2-2 {
top:360px;
}
#model1 .model1-day1-3,
#model1 .model1-day2-3 {
top:650px;
}

#model1 .model1-day1-4,
#model1 .model1-day2-4 {
top:900px;
}
	
/*model2*/
#model2 .modelbox.day1{
min-height: 1250px;
}
#model2 .modelbox.day2 {
min-height: 920px;
}

#model2 .model2-day1-1{
top:88px;
}


#model2 .model2-day2-1 {
top:70px;
}
#model2 .model2-day1-2{
top:380px;
}
#model2 .model2-day2-2 {
top:360px;
}
#model2 .model2-day1-3{
top:670px;
}
#model2 .model2-day2-3 {
top:650px;
}
#model2 .model2-day1-4{
top:960px;
}
#model2 .model2-day2-4 {
top:900px;
}


/*model3*/
#model3 .modelbox.day1{
min-height: 950px;
}
#model3 .modelbox.day2 {
min-height: 1250px;
}

#model3 .modelbox.day3 {
min-height: 1220px;
}

#model3 .model3-day1-1{
/*top:90px;*/
top:85px;
}
#model3 .model3-day2-1{
top:70px;
} 
#model3 .model3-day3-1 {
top:70px;
}
#model3 .model3-day1-2{
/*top:380px;*/
top:375px;
}
#model3 .model3-day2-2{
top:360px;
}
#model3 .model3-day3-2 {
top:360px;
}
#model3 .model3-day1-3{
top:670px;
}
#model3 .model3-day2-3{
top:650px;
}
	
#model3 .model3-day2-4{
top:940px;
}
	
#model3 .model3-day3-3 {
top:650px;
}
	
#model3 .model3-day3-4 {
top:940px;
}

/*model4*/
#model4 .modelbox.day1{
min-height: 360px;
}
#model4 .modelbox.day2{
min-height: 600px;
}
#model4 .model4-day1-1{
top:70px;
}
#model4 .model4-day1-2{
top:300px;
}
#model4 .model4-day2-1{
top:0px;
}
#model4 .model4-day2-2{
top:300px;
}
#model4 .model4-day2-3{
top:620px;
}


	#height1{
		/*height: 62px;*/
	}
	
	#height1_2{
		/*height: 62px;*/
	}	
	
	#height2{
		height: 98px;
	}	
	#height3{
		height: 142px;
	}	
	#height4{
		height: 142px;
	}	
	#height5{
		/*height: 62px;*/
	}	
	#height6{
		/*height: 62px;*/
	}	
	#height7{
		height: 162px;
	}	
	
	#height7_2{
		height: 162px;
	}	
	#height8{
		height: 162px;
	}
	
	#height8_2{
		height: 162px;
	}	
	
	#height9{
		/*height: 62px;*/
	}
	
	#height9_2{
		height: 111px;
	}	
	
	#height10{
		/*height: 62px;*/
	}	
	#height11{
		height: 123px;
	}	
	#height12{
		/*height: 105px;*/
		height: 60px;
	}	
	#height13{
		/*height: 62px;*/
		height: 100px;
	}	
	#height14{
		/*height: 62px;*/
	}	
	#height15{
		/*height: 122px;*/
		height: 104px;
	}	
	
	#height15_2{
		height: 122px;
	}	
	
	#height16{
		/*height: 143px;*/
		height: 45px;
	}	
	
	
	#height16_2{
		height: 143px;
	}	
	
	#height17{
		/*height: 62px;*/
		height: 123px;
	}
	
		
	#height17_2{
		/*height: 62px;*/
		height: 93px;
	}	
	
	#height18{
		/*height: 62px;*/
	}	
	#height19{
		/*height: 162px;*/
		height: 124px;
	}	
	#height20{
		/*height: 142px;*/
		height: 122px;
	}	
	
	#height21{
		/*height: 143px;*/
		height: 123px;
	}	
	
	#height22{
		/*height: 62px;*/
		height: 91px;
	}	

.offer {
	margin: -30px 0 15px !important;
	text-align: center;
}
.modelin .offer {
	margin: 0 0 15px !important;
}
#guidance ul {
	margin-bottom: 15px;
}
#guidance ul li {
	list-style-type: disc;
	margin-left: 24px;
	font-size: 13px;
}
#guidance h3 {
	margin-bottom: 10px !important;
	font-size: 16px !important;
	font-family: "Helvetica Neue",Arial,"Hiragino Kaku Gothic ProN","Hiragino Sans",Meiryo,sans-serif !important;
}
#guidance h3::before, 
#guidance h3::after {
	display: none;
}
/*
.modelin h3.guidance span {
	padding: 7px 10px !important;
	color: #fff;
	background: #555;
}
*/


.in.modelbtn {
	margin: -50px auto 30px;
}
.wappen {
	position: absolute;
	top: -0.2em;
	overflow: hidden;
	width: 2.6em;
	height: 2.6em;
	line-height: 2.6em;
	background: #fff;
	border-radius: 50%;
	box-shadow: 0px 0px 0px 2px #fff;
	border: dashed 1px #00b0f0;
	text-align: center;
	color: #00b0f0;
	font-size: 16px;
}
span.wappen_txt {
	padding-left: 3em;
}

/*modal*/
	
.modal {
  display: none;
  position: fixed;
  z-index: 20;
  left: 0;
  top: 0;
  height: 100%;
  width: 100%;
  overflow: auto;
  background-color: rgba(0,0,0,0.5);

}
	

 .modal-wrap{
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
  }

.modal-box {
    background-color: #fff;
    margin: 10% auto;
    max-width: 970px;
    width: 90%;
    border-radius: 10px;
    animation: show 0.6s linear 0s;
    position: relative;
	padding: 20px;
	
}
	
	.modal-boxin{
		display: flex;
		justify-content: space-between;
		
	}

.modalClose{
      position: absolute;
      top: 0;
      right: 0;
    }
	
	.modalOpen{
		
	}
	
.modalOpen {
        position: relative;
        display: block;
        width: 90%;
	margin: 0 auto 15px;
        padding: 10px;
        cursor: pointer;
        transition: all 0.3s;
        text-align: center;
        color: #FFF;
        background: #000066;
        border-radius: 0.2em;
        font-size: 123.1%;
    }
.modalOpen span {
        font-size: 70%;
    }
.modalOpen:hover {
        transition: all 0.3s;
        color: #ffffff;
        background: #000099;
    }
.modalOpen::after {
        font-family: 'FontAwesome';
        content: ' \f067';
        color: #FFF;
    }
.modalOpen:hover::after {
        color: #FFF;
    }
	
	.modal-img{
		width: 48%;
		max-width: 400px;
	}
	
	.modal-detail{
		width: 55%;
	}
	
	.detail_intro{
		margin: 0 0 20px 0;
	}
	
	.detail_intro dl dt{
		font-size: 20px;
		font-weight: bold;
		margin: 0 0 10px 0;
		padding: 0 0 10px 0;
		border-bottom: 2px dotted #000000;
		
	}
	
	.detail_intro dl dd{
		font-size: 16px;
		line-height: 1.8;
	}
	
 /* 閉じるボタン */
  .modal-close-btn {
      position: absolute;
      right: 0px;
      top: 0px;
      width: 30px;
      height: 30px;
      cursor: pointer;
      z-index: 20;
      /* background-color: white; */
      /* border-radius: 50%; */
  }
	
  .modal-close-btn:hover {
          opacity: 0.8;
      }
  /* 閉じるボタンのX */
  .lineClose {
      display: inline-block;
      vertical-align: middle;
      color: var(--c-white);
      line-height: 1;
      width: 1rem;
      height: .2rem;
      background: currentColor;
      border-radius: 0.1rem;
      transform: rotate(45deg);
      position: absolute;
      top: 50%;
      left: 20%;
  }
  .lineClose::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: inherit;
    border-radius: inherit;
    transform: rotate(90deg);
  }
	
	.spottitle{
		font-size: 18px;
		font-weight: bold;
		padding: 10px 10px;
		color: #C062FF;
		display: flex;
		align-items: center;
	}
	
	.accordion {
margin: 3em auto;

}
.toggle {
display: none;
}
.option {
position: relative;
margin-bottom: 1em;
}
.coupondetail_title,
.content {
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
transform: translateZ(0);
transition: all 0.3s;
}
.coupondetail_title {
padding: 1em;
border: 2px solid #0A75CD;
display: block;
color: #333;
font-weight: bold;
	font-size: 18px;
}
.coupondetail_title::after,
.coupondetail_title::before {
content: "";
position: absolute;
right: 1.25em;
top: 1.25em;
width: 2px;
height: 0.75em;
background-color: #333;
transition: all 0.3s;
}
.coupondetail_title::after {
transform: rotate(90deg);
}
.content {
max-height: 0;
overflow: hidden;

}

.toggle:checked + .coupondetail_title + .content {
max-height: 500px;
transition: all 1.5s;
padding: 15px;
}
.toggle:checked + .coupondetail_title::before {
transform: rotate(90deg) !important;
}
	
}


.swiper-wrapper{
		padding: 0px 0px 0 0;
	}
	
	.swiper-button-next:after, .swiper-button-prev:after{
		font-size: 24px !important;
		font-weight: bold;
		 text-shadow: 2px 3px 3px rgba(0, 0, 0, 0.4);
		
	}
	
	.swiper-button-next, .swiper-button-prev{
		color: #ffffff !important;
	}
	
	.swiper-container-horizontal>.swiper-pagination-bullets, .swiper-pagination-custom, .swiper-pagination-fraction{
		bottom: -5px !important;
	}


.spotbox .point2{
	background-color: #e6ffce !important;
}


.commodity_txt a{
	text-decoration: underline !important;
}

.btbgred{
	background-color: #DB0003 !important;
}

.trainarea {
	margin: 0 0 50px 0;
}

.trainarea:last-of-type{
	margin: 0 0 0 0 !important;
}

.trainarea .spotbox{
	background: none !important;
	border: none !important;
}

.trainarea .spotbox .spottitle{
	padding: 10px 0 !important;
	color: #000000 !important;
}

.trainarea .spotbox .point{
	margin: 0 0 10px 0 !important;
}
