﻿@charset "utf-8";

/* -----------------------------------------
	common
----------------------------------------- */
.hidden_show {display: none;}
.fontBlack {color: #333;}
.m0auto {margin: 0 auto;}
.fWrap {flex-wrap: wrap;}
.cardsBox_link.blank {
    position: relative;
}
.cardsBox_link.blank:after {
    content: "";
    display: inline-block;
    background: url(/material/img/ico_blank.svg) no-repeat;
    background-size: contain;
    width: 12px;
    height: 12px;
    position: absolute;
    right: 10px;
    bottom: 10px;
}

@media screen and (min-width: 751px) {
    .w230 {width: 230px;}
    .w90{width: 90px;}
}

@media screen and (max-width: 750px) {
    .sp_ta-l {text-align: left!important;}
    .sp_mb5p {margin-bottom: 5%;}
    .sp_font36vw {font-size: 3.6vw!important;}
    .sp_col3 {
        display: flex;
        flex-wrap: wrap;
    }
    .sp_col3 > * {
        width: 31.3%;
        margin-right: 3%;
        margin-bottom: 20px;
    }
    .sp_col3 > *:nth-child(3n){
        margin-right: 0;
    }
    .sp_rowReverse_col {
        display: flex;
        flex-direction: column-reverse;
    }
}

/* -----------------------------------------
	search box
----------------------------------------- */
.contents02_search {
    width: 410px;
    margin: 0 auto 10px;
}
.contents02_search .searchBox form {
    background: #fff;
    padding: 10px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    border: 1px solid #ddd;
    margin-bottom: 10px;
}
.contents02_search .searchBox form:before {
    content: "";
    display: block;
    background: url(/material/img/ico_search_g.svg) no-repeat;
    background-size: contain;
    width: 20px;
    height: 20px;
}
.contents02_search .searchBox .searchbtn {
    width: 60px;
    border: none;
    background: #008803;
    color: #fff;
    border-radius: 3px;
    padding: 3px 5px;
    font-size: 1.6rem;
    cursor: pointer;
}
.contents02_search .searchBox .station {
    color: #999;
    margin-right: 5px;
    font-size: 1.2rem;
}
.contents02_search .searchBox .textArea {
    border: none;
    padding: 5px 2px;
    margin: 0 5px;
    width: 265px;
}
.etc_searchBox {
    background: #eee;
    padding: 10px;
    display: flex;
    justify-content: center;
    margin: 10px 0 0;
}
.etc_searchBox .aLot {
    display: flex;
    flex-wrap: wrap;
    margin-right: 30px;
}
.etc_searchBox .link {
    display: flex;
    flex-wrap: wrap;
}
.etc_searchBox .link li:not(:last-child) {
    margin-right: 10px;
}
.etc_searchBox .link a {
    padding-left: 15px;
}

@media screen and (max-width: 750px) {
    .contents02_search {
        width: 100%;
        margin: 0 auto 5%;
    }
    .contents02_search .searchBox form {
        padding: 2% 3%;
        display: flex;
        margin-bottom: 3%;
    }
    .contents02_search .searchBox .searchbtn {
        width: 15%;
        padding: 1%;
        font-size: 1.5rem;
    }    
    .contents02_search .searchBox .textArea {
        padding: 1%;
        margin: 0 3px;
        width: calc(93% - 80px);
    }
    .etc_searchBox {
        padding: 3%;
        display: block;
        margin: 5% 0 0;
    }
    .etc_searchBox .aLot {
        display: block;
        margin-bottom: 3%;
        margin-right: 0;
    }
    .etc_searchBox .aLot dt {
        margin-bottom: 1%;
    }
}

/* search result navi */
.search_result_nav{
    background: #eee;
    padding: 15px;
    margin-bottom: 50px;
}
.search_result_nav .list_link {
    max-width: calc(100% - 140px);
    flex-wrap: wrap;
}
.search_result_nav .list_link li{
    padding: 0 10px;
    position: relative;
}
.search_result_nav .list_link li + li:after{
    content: "";
    display: block;
    background-color: #333;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    margin: auto 0;
    width: 1px;
    height: 10px;
}
.search_result_nav .list_link li a{
    font-weight: bold;
}
.search_result_nav .prevBtn,
.search_result_nav .nextBtn{
    padding: 4px 8px;
    border-radius: 5px;
    background-color: #fff;
    cursor: pointer;
}
.search_result_nav .prevBtn:hover,
.search_result_nav .nextBtn:hover{
    box-shadow: 0px 1px 8px 0px rgba(0, 0, 0, 0.5);
    transition-duration: .2s;
}
.search_result_nav .prevBtn{margin-right: 20px;}
.search_result_nav .nextBtn{margin-left: 20px;}


@media screen and (max-width: 750px){
    .search_result_nav{padding: 3%;}
    .search_result_nav .list_link {
        max-width: calc(100% - 110px);
    }
    .search_result_nav .prevBtn,
    .search_result_nav .nextBtn{
        padding: 3px 7px;
    }
    .search_result_nav .list_link li{padding: 0 8px;}
    .search_result_nav .prevBtn{margin-right: 10px;}
    .search_result_nav .nextBtn{margin-left: 10px;}
}


/* -----------------------------------------
	select box
----------------------------------------- */
.selectBox {
    display: flex;
    align-items: center;
}
.selectHead, .inputHead {
    width: 90px;
    padding: 10px 7px 9px;
    text-align: center;
}
.selectCont, .inputCont {
    width: calc(100% - 90px);
    position: relative;
}
.selectBox select {
    width: 100%;
    padding: 10px 20px 10px 10px;
    border: 1px solid #ddd;
    border-radius: 0 3px 3px 0;
    background-color: #fff;
    font-size: 1.2rem;
}
.selectCont:after {
    content: "";
    display: block;
    width: 0;
    height: 0;
    border-top: 10px solid #bbb;
    border-right: 5px solid transparent;
    border-left: 5px solid transparent;
    border-bottom: 0px solid transparent;
    position: absolute;
    top: 0px;
    bottom: 0;
    right: 10px;
    margin: auto;
    pointer-events: none;
}

/* -----------------------------------------
	input box
----------------------------------------- */
.inputBox {
    display: flex;
    align-items: center;
}
.inputBox input {
    width: 100%;
    height: 40px;
    padding: 10px;
    margin-bottom: 5px;
    border: 1px solid #ddd;
    border-radius: 3px;
    background-color: #fff;
}

/* -----------------------------------------
	search button
----------------------------------------- */
.btnSearch {
    display: block;
    background: #008803;
    border-radius: 3px;
    color: #fff;
    font-size: 1.6rem;
    width: 170px;
    margin: 30px auto 0;
    position: relative;
}
.btnSearch .searchBtn {
    border: none;
    background: #008803;
    color: #fff;
    border-radius: 3px;
    padding: 15px 20px;
    font-size: 1.6rem;
    width: 100%;
    cursor: pointer;
}
.btnSearch:before {
    content: "";
    display: block;
    background: url(/material/img/header/ico_header_search.svg) no-repeat;
    background-size: contain;
    width: 20px;
    height: 20px;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 30px;
    margin: auto;
}


/* -----------------------------------------
	sp accordion
----------------------------------------- */
@media screen and (max-width: 750px) {
    .acc_cont {
        padding: 0 0 7%;
    }
    .acc_btn {
        position: relative;
        display: block;
        width: 100%;
        padding: 2% 5%;
        margin: 0 auto;
        background: #444;
        color: #fff;
        text-align: center;
        cursor: pointer;
    }
    .acc_btn:before {
        content: "";
        display: block;
        width: 2px;
        height: 14px;
        background: #fff;
        position: absolute;
        right: 20px;
        top: 0;
        bottom: 0;
        margin: auto;
        transition: 0.4s;
    }
    .acc_btn:after {
        content: "";
        display: block;
        width: 14px;
        height: 2px;
        background: #fff;
        position: absolute;
        right: 14px;
        top: 0;
        bottom: 0;
        margin: auto;
    }
    .acc_btn.active:before {
        -moz-transform: rotate(-90deg);
        -webkit-transform: rotate(-90deg);
        -o-transform: rotate(-90deg);
        -ms-transform: rotate(-90deg);
        transform: rotate(-90deg);
    }
}

/* -----------------------------------------
	line list
----------------------------------------- */
.list_line{
    display: flex;
    flex-wrap: wrap;
}
.list_line > *{
    margin-right: 9px;
    margin-bottom: 4px;
}

/* -----------------------------------------
	station box
----------------------------------------- */
.station_box {
	background: #fff;
	width: 400px;
	margin: 0 auto 60px;
	padding: 10px;
	box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.2);
}
.station_box .station_name01 {
	font-weight: bold;
	font-size: 3.0rem;
    padding: 0 63px;
	margin: 25px 0;
	text-align: center;
}
.station_box .station_name02 {
	background: #008803;
	color: #fff;
	text-align: center;
	font-weight: bold;
	padding: 5px;
}

.station_box-suicaCard {
    position: relative;
}
.station_box-suicaCard:after {
	display: block;
	content: "";
	width: 62px;
	height: 68px;
    background: url("/estation/station/img/ico_suica_card.png") 0 0/contain;
	position: absolute;
	top: 10px;
	right: 10px;
}
.station_linkList,
.u_station_linkList {
	display: flex;
	justify-content: center;
}
.station_linkList li a {
	position: relative;
	display: block;
	font-weight: bold;
	color: #333;
	font-size: 1.8rem;
	border-bottom: 4px solid #ddd;
	padding: 10px 20px;
}
.station_linkList .on,
.station_linkList a:hover {
	text-decoration: none;
	position: relative;
	display: block;
	font-weight: bold;
	color: #008803;
	font-size: 1.8rem;
	padding: 10px 20px;
	border-bottom: 4px solid #008803;
}
.station_linkList li a:before,
.station_linkList .on:before {
	display: block;
	content: "";
	width: 40px;
	height: 40px;
	position: relative;
	top: -10px;
	left: 0;
	right: 0;
	margin: auto;
}
.u_station_linkList li a {
	position: relative;
	display: block;
	font-weight: bold;
	color: #333;
	font-size: 1.8rem;
	border-top: 4px solid #ddd;
	padding: 20px 20px 0;
}
.u_station_linkList .on,
.u_station_linkList a:hover {
	text-decoration: none;
	position: relative;
	display: block;
	font-weight: bold;
	color: #008803;
	font-size: 1.8rem;
	padding: 20px 20px 0;
	border-top: 4px solid #008803;
}
.station_linkList li a:before,
.station_linkList .on:before,
.u_station_linkList li a:before,
.u_station_linkList .on:before {
	display: block;
	content: "";
	width: 40px;
	height: 40px;
	position: relative;
	top: -10px;
	left: 0;
	right: 0;
	margin: auto;
}
.station_linkList .station a:before,
.u_station_linkList .station a:before {
	background: url(/estation/img/ico_station.svg) no-repeat;
	background-size: contain;
}
.station_linkList .station.on:before,
.station_linkList .station a:hover:before,
.u_station_linkList .station.on:before,
.u_station_linkList .station a:hover:before {
	background: url(/estation/img/ico_station_on.svg) no-repeat;
	background-size: contain;
}
.station_linkList .timetable a:before,
.u_station_linkList .timetable a:before {
	background: url(/estation/img/ico_timetable.svg) no-repeat;
	background-size: contain;
}
.station_linkList .timetable.on:before,
.station_linkList .timetable a:hover:before,
.u_station_linkList .timetable.on:before,
.u_station_linkList .timetable a:hover:before {
	background: url(/estation/img/ico_timetable_on.svg) no-repeat;
	background-size: contain;
}
.station_linkList .floorplans a:before,
.u_station_linkList .floorplans a:before {
	background: url(/estation/img/ico_floorplans.svg) no-repeat;
	background-size: contain;
}
.station_linkList .floorplans.on:before,
.station_linkList .floorplans a:hover:before,
.u_station_linkList .floorplans.on:before,
.u_station_linkList .floorplans a:hover:before {
	background: url(/estation/img/ico_floorplans_on.svg) no-repeat;
	background-size: contain;
}

.station_linkList .off span {
	position: relative;
	display: block;
	font-weight: bold;
	color: #aaa;
	font-size: 1.8rem;
	border-bottom: 4px solid #ddd;
	padding: 10px 20px;
}

.u_station_linkList .off span {
	position: relative;
	display: block;
	font-weight: bold;
	color: #aaa;
	font-size: 1.8rem;
	border-top: 4px solid #ddd;
	padding: 20px 20px 0;
}

.station_linkList .off span:before,
.u_station_linkList .off span:before {
	display: block;
	content: "";
	width: 40px;
	height: 40px;
	position: relative;
	top: -10px;
	left: 0;
	right: 0;
	margin: auto;
}

.station_linkList .station.off span:before,
.u_station_linkList .station.off span:before {
	background: url(/estation/img/ico_station.svg) no-repeat;
	background-size: contain;
	opacity: 0.5;
}
.station_linkList .floorplans.off span:before,
.u_station_linkList .floorplans.off span:before {
	background: url(/estation/img/ico_floorplans.svg) no-repeat;
	background-size: contain;
	opacity: 0.5;
}
.station_linkList .timetable.off span:before,
.u_station_linkList .timetable.off span:before {
	background: url(/estation/img/ico_timetable.svg) no-repeat;
	background-size: contain;
	opacity: 0.5;
}

@media screen and (max-width: 750px) {
	.station_box {
		background: #fff;
		width: 85%;
		margin: 0 auto 15%;
		padding: 2%;
	}
	.station_box .station_name01 {
		margin: 8% 0;
	}
	.station_box .station_name02 {
		padding: 1%;
	}
	.station_linkList li a,
	.station_linkList .on,
	.station_linkList a:hover {
		font-size: 3.7vw;
		padding: 12px 15px;
	}
	.u_station_linkList li a,
	.u_station_linkList .on,
	.u_station_linkList a:hover {
		font-size: 3.7vw;
		padding: 20px 15px 0;
	}
    .station_box-suicaCard:after {
        display: none;
    }

	.station_linkList .off span {
		font-size: 3.7vw;
		padding: 12px 15px;
	}
	.u_station_linkList .off span {
		font-size: 3.7vw;
		padding: 20px 15px 0;
	}

	.station_linkList .off span:before,
	.u_station_linkList .off span:before {
		display: block;
		content: "";
		width: 40px;
		height: 40px;
		position: relative;
		top: -10px;
		left: 0;
		right: 0;
		margin: auto;
	}
}

/* -----------------------------------------
	station box
----------------------------------------- */
.anchor_link_box {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
}
.anchor_link_box > * {
    margin-bottom: 15px;    
}
.anchor_link_box > *:not(:last-child) {
    margin-right: 30px;    
}

@media screen and (max-width: 750px) {
    .anchor_link_box {
        display: block;
    }
    .anchor_link_box > * {
        margin-bottom: 0%;
    }
    .anchor_link_box > *:not(:last-child) {
        margin-right: 0%;
    }
    .anchor_link_box_sp-2line {
        display: flex;
        justify-content: center;
        flex-wrap: wrap;
        text-align: center;
    }
    .anchor_link_box_sp-2line > * {
        width: calc(100% / 5);
        margin-bottom: 1%;
    }
}

/* -----------------------------------------
	numbering list
----------------------------------------- */
.numbering_list {
    display: flex;
    flex-wrap: wrap;
    width: 85%;
    margin: 0 auto;
}
.numbering_list > * {
    width: calc(100% / 7);
    text-align: center;
}
.numbering_list img {
    width: 45%;
}
.route_name {
    padding: 0 10px;
    margin-top: 10px;
    font-size: 1.3rem;
}

@media screen and (max-width: 750px) {
    .numbering_list {
        width: 100%;
    }
    .numbering_list > * {
        width: calc(100% / 3);
        margin-bottom: 5%;
    }
    .route_name {
        padding: 0 3%;
        margin-top: 5%;
    }
}

/* -----------------------------------------
	area access
----------------------------------------- */
.area_access_h.heading03 {
    font-weight: bold;
    margin-bottom: 30px;
}
.area_access {
    display: flex;
    flex-wrap: wrap;
}
.area_access .link a{
    padding-left: 15px;
}
.area_access .link:not(:last-child){
    margin-right: 13px;
    margin-bottom: 5px;
}
@media screen and (max-width: 750px) {
    .area_access_h.heading03 {
        margin-bottom: 8%;
    }
    .area_access .link:not(:last-child) {
        margin-right: 4%;
        margin-bottom: 3%;
    }
}

/* -----------------------------------------
	駅の情報
----------------------------------------- */
.heading_ico:before {
    content: "";
    display: block;
    margin: 0 auto 7px;
}
.heading_ico_midori:before {
    width: 73px;
    height: 72px;
    background: url("/estation/station/img/ico_midori_h.png") no-repeat 0 0/contain;
}
.heading_ico_view:before {
    width: 441px;
    height: 53px;
    max-width: 100%;
    background: url("/estation/station/img/ico_view_ekitabi_h.png") no-repeat 0 0/contain;
}
.heading_ico_tour:before {
    width: 74px;
    height: 66px;
    background: url("/estation/station/img/ico_tour_h.svg") no-repeat 0 0/contain;
}
.heading_ico_seatTicket:before {
    width: 57px;
    height: 83px;
    background: url("/estation/station/img/ico_seat_ticket_h.svg") no-repeat 0 0/contain;
}
.heading_ico_suica:before {
    width: 74px;
    height: 62px;
    background: url("/estation/station/img/ico_suica_card_h.svg") no-repeat 0 0/contain;
}
.heading_ico_shop:before {
    width: 74px;
    height: 83px;
    background: url("/estation/station/img/ico_shop_h.svg") no-repeat 0 0/contain;
}
.heading_ico_altte:before {
    width: 73px;
    height: 54px;
    background: url("/estation/station/img/ico_altte_h.svg") no-repeat 0 0/contain;
}
.heading_ico_barrierfree:before {
    width: 71px;
    height: 82px;
    background: url("/estation/station/img/ico_barrierfree.svg") no-repeat 0 0/contain;
}
.heading_ico_other:before {
    width: 73px;
    height: 69px;
    background: url("/estation/station/img/ico_other_h.svg") no-repeat 0 0/contain;
}
.heading_ico_transportation:before {
    width: 72px;
    height: 69px;
    background: url("/estation/station/img/ico_transportation_h.svg") no-repeat 0 0/contain;
}
.heading_ico_recomm:before {
    width: 72px;
    height: 72px;
    background: url("/estation/station/img/ico_recomm_h.svg") no-repeat 0 0/contain;
}
.heading_ico_service:before {
    width: 72px;
    height: 50px;
    background: url("/estation/station/img/ico_service.svg") no-repeat 0 0/contain;
}
.heading_ico_basicInfo:before {
    width: 72px;
    height: 88px;
    background: url("/estation/station/img/ico_basic_info.svg") no-repeat 0 0/contain;
}
.pTour_wrap {
    width: 95%;
    margin: 0 auto;
}
.pTour_wrap .pTour_item {
    height: 80%;
    border: 1px solid #ccc;
}
.pTour_wrap .pTour_item:hover {
    box-shadow: 0px 1px 8px 0px rgba(0, 0, 0, 0.2);
    transition-duration: .2s;
}
.pTour_wrap .pTour_item a {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
    padding: 25px;
    background: #fff;
    text-align: center;
}
.transportation_list > *:not(.linkBlank02) {
    padding: 10px 25px 10px 10px;
    border-bottom: 1px solid #ddd;    
}
.bb_box > * {
    border-bottom: 1px solid #ddd;
}
.bb_box_pb10 > * {padding-bottom: 10px;}
.bb_box_pb20 > * {padding-bottom: 20px;}

@media screen and (min-width: 751px){
    .bb_box > *:nth-child(2n+1):nth-last-child(-n+2),
    .bb_box > *:nth-child(2n+1):nth-last-child(-n+2) ~ li {
        border-bottom: none;
        padding-bottom: 0;
    }
}

@media screen and (max-width: 750px){
    .bb_box_pb10 > * {padding-bottom: 4%;}
    .bb_box_pb20 > * {padding-bottom: 5%;}
    .bb_box > *:last-child {
        border-bottom: none;
        padding-bottom: 0;
    }
    .pTour_wrap {
        width: 100%;
    }
    .pTour_wrap .pTour_item {
        height: 100%;
    }
    .pTour_wrap .pTour_item a {
        padding: 8%;
    }
}

/* -----------------------------------------
	五十音順 station list
----------------------------------------- */
.station_list {
    display: flex;
    flex-wrap: wrap;
    font-size: 1.2rem;
    border: 1px solid #ddd;
    border-radius: 3px;
    background-color: #fff;
}
.station_list > * {
    width: calc(100% / 6);
    max-width: 16.66%;
    border-bottom: 1px solid #ddd;
    border-right: 1px solid #ddd;
}
.station_list > *:nth-of-type(6n) {
    border-right: 0;
}
.station_list > *:nth-child(6n+1):nth-last-child(-n+6),
.station_list > *:nth-child(6n+1):nth-last-child(-n+6) ~ li {
    border-bottom: 0;
}
.station_list a {
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    height: 100%;
    padding: 10px;
}

@media screen and (max-width: 750px){
    .station_list > * {
        width: calc(100% / 3);
        max-width: none;
    }
    .station_list > *:nth-of-type(3n) {
        border-right: 0;
    }
    .station_list > *:nth-child(6n+1):nth-last-child(-n+6),
    .station_list > *:nth-child(6n+1):nth-last-child(-n+6) ~ li {
        border-bottom: 1px solid #ddd;
    }
    .station_list > *:nth-child(3n+1):nth-last-child(-n+3),
    .station_list > *:nth-child(3n+1):nth-last-child(-n+3) ~ li {
        border-bottom: 0!important;
    }
    .station_list a {
        padding: 6% 5%;
    }
}

/* -----------------------------------------
	構内図btn
----------------------------------------- */
.stationLinkBtn {
    margin-left: 20px;
    font-size: 1.4rem;
}
.stationLinkBtn a {
    position: relative;
    display: inline-block;
    background: #008803;
    color: #fff;
    padding: 4px 9px;
    text-align: center;
}
.stationLinkBtn a:after {
    content: "";
    display: block;
    width: 0;
    height: 0;
    border-top: 14px solid transparent;
    border-right: 0 solid transparent;
    border-bottom: 14px solid transparent;
    border-left: 10px solid #008803;
    position: absolute;
    right: -10px;
    top: 0;
    bottom: 0;
    margin: auto;
}
.stationLinkBtn a:hover {
    text-decoration: none;
    box-shadow: 0px 1px 8px 0px rgba(0, 0, 0, 0.5);
    transition-duration: .2s;
}

@media screen and (max-width: 750px){
    .stationLinkBtn {
        margin-left: 0;
        font-size: 3.5vw;
    }
    .stationLinkBtn a {
        padding: 2% 7%;
    }
    .stationLinkBtn a:after {
        border-top: 3vw solid transparent;
        border-right: 0 solid transparent;
        border-bottom: 3vw solid transparent;
        border-left: 1.5vw solid #008803;
        right: -1.4vw;
    }
    
}

/* -----------------------------------------
	border table
----------------------------------------- */
.basicTable_bd th, .basicTable_bd td{
    border: 1px solid #ddd;
}

@media print,screen and (min-width: 751px){
    .lineBreak {
        word-wrap : break-word;
        overflow-wrap : break-word;
    }
}

/* -----------------------------------------
	icon
----------------------------------------- */
.ico_inc_btn {
    width: 300px;
    margin: 0 auto;    
}
.ico_inc_btn a {
    font-weight: bold;
    font-size: 1.6rem;
    position: relative;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    height: 100%;
    padding: 10px 15px;
}
.ico_inc_btn.ico_transfer a {
    padding: 20px 15px;
}
.ico_inc_btn.ico_reserve a:before {
    content: "";
    display: block;
    background: url("/estation/station/img/ico_ekinet.svg") no-repeat;
    background-size: contain;
    width: 22px;
    height: 24px;
    margin-right: 9px;
}
.ico_inc_btn.ico_transfer a:before {
    content: "";
    display: block;
    background: url("/estation/station/img/ico_transfer.svg") no-repeat;
    background-size: contain;
    width: 24px;
    height: 16px;
    margin-right: 15px;
}

.ico_cont_list {
    display: flex;
    flex-wrap: wrap;
}
.ico_cont_list > * {
    width: calc(100% / 4 - 2%);
    margin-right: 2%;
    margin-bottom: 2%;
}
.ico_cont_list > *:nth-of-type(4n),
.ico_cont_list > *:last-of-type{
    margin-right: 0;
}
.ico_cont_list .ico_cont,
.ico_cont_1obj-table {
    display: flex;
    align-items: center;
    height: 100%;
    background: #e2f3e2;
    border-radius: 3px;
}
.ico_cont_list .ico_cont > dt, 
.ico_cont_list .ico_cont > dd,
.ico_cont_1obj-table > dt, 
.ico_cont_1obj-table > dd {
    display: flex;
    align-items: center;
    height: 100%;    
    padding: 10px 6px;
}
.ico_cont_list .ico_cont > dt,
.ico_cont_1obj-table > dt {
    width: 65%;
    border-right: 1px solid #ddd;
}
.ico_cont_list .ico_cont > dd,
.ico_cont_1obj-table > dd {
    width: 35%;
    justify-content: center;
}
.ico_cont_list .ico_cont.cont_off,
.ico_cont_1obj-table.cont_off {
    background: #eee;
}

.genre_ico {
    display: inline-block;
    text-align: center;
    padding: 6px 5px;
    color: #fff;
    font-size: 1.3rem;
    font-weight: bold;
}
.genre_ico.agenre1 {background: #d93d7a;}/*祭り*/
.genre_ico.agenre2 {background: #f17c2c;}/*イベント*/
.genre_ico.agenre3 {background: #64c2de;}/*季節情報*/
.genre_ico.agenre4 {background: #2071c3;}/*名所旧跡*/
.genre_ico.agenre5 {background: #a34c9b;}/*名産品*/
.genre_ico.agenre6 {background: #3ab157;}/*トレッキング*/
.genre_ico.agenre7 {background: #94b447;}/*駅弁*/
.genre_ico.agenre8 {background: #f86365;}/*自駅紹介*/
.genre_ico.agenre9 {background: #a66a4e;}/*観光情報*/
.genre_ico.agenre10 {background: #27a9e3;}/*温泉施設*/
.genre_ico.agenre99 {background: #eba31b;}/*その他*/

@media screen and (max-width: 750px) {
    .ico_inc_btn {
        width: 80%;
    }
    .ico_inc_btn a {
        padding: 3%;
    }
    .ico_cont_list {
        justify-content: space-between;
    }
    .ico_cont_list > * {
        width: 48%;
        margin-right: 0;
        margin-bottom: 4%;
    }
    .ico_cont_list .ico_cont > dt, 
    .ico_cont_list .ico_cont > dd,
    .ico_cont_1obj-table .ico_cont > dt, 
    .ico_cont_1obj-table .ico_cont > dd {
        padding: 4%;
    }
    .ico_cont_1obj-table > dt {
        width: 75%;
    }
    .ico_cont_1obj-table > dd {
        width: 25%;
    }
}