@charset "UTF-8";

/*-------------------------
__want_to_buy_style
-------------------------*/

#main{ text-align: center; width: 100%; max-width: 1200px; margin: 0 auto; padding: 0 50px; box-sizing: border-box;}
#main img{ width: 100%; height: auto;}
#contents_title{background:url("/sell/images/title_back.jpg")no-repeat center center;background-size:cover; position: relative;}
#contents_title:after { content: ""; width: 100%; height: 100%; background: rgba(0,0,0,0.4); position: absolute; top: 0; left: 0; display: block;}

.introductory{ font-size: 2.2em; font-weight: 700; margin-bottom: 60px;}

/*=================================== 検索 ===================================*/

/*タブ設定*/
.search_tab { display: flex; justify-content: space-between; align-items: flex-end; cursor: pointer;}
.tab_s{ width: calc((100% / 2) - 8px); text-align: center; font-size: 18px; color: #2A2C8B; background-color: #C8DCF5; padding: 15px 0; box-sizing: border-box; font-weight: 700; border-radius: 10px 10px 0 0;}
.tab_s.active { background-color: #2A2C8B; color: #fff; padding: 22px 0;}
.panel_s { display: none; text-align: center; background-color: #fff; border: 4px solid #2A2C8B; box-sizing: border-box;}
.panel_s.active { display: block;}

#search_step{ margin-bottom: 100px;}
#search_step #search_step01{ margin-bottom: 40px;}
#search_step p.search_step_title{ color: #2A2C8B; font-weight: 700; margin-bottom: 30px;}
#search_step p.search_step_title span:nth-child(1){ font-size: 2.3em;}
#search_step p.search_step_title span:nth-child(2){ font-size: 4em;}
#search_step #search_step01 .search_panel .panel_s .area_search_box{ padding: 45px; box-sizing: border-box;}
#search_step #search_step01 .search_panel .panel_s .area_search_box > p{ color: #2A2C8B; font-size: 2em; font-weight: 700; margin: 0 auto 20px; text-align: center;}
#search_step #search_step01 .search_panel .panel_s .area_search_box .item_wrap{ display: flex; flex-wrap: wrap; text-align: left;}
#search_step #search_step01 .search_panel .panel_s .area_search_box .item_wrap label{ width: calc(16.66666% - 14px); margin-bottom: 20px; display: block; position: relative; cursor: pointer; margin-right: 16px;}
#search_step #search_step01 .search_panel .panel_s .area_search_box .item_wrap label:nth-child(6n){ margin-right: 0;}
#search_step #search_step01 .search_panel .panel_s .area_search_box .item_wrap label input[type="radio"]{ position: absolute; opacity: 0;}
#search_step #search_step01 .search_panel .panel_s .area_search_box .item_wrap label input[type="radio"] + span{ display: block; background-color: #F0F0F0; font-size: 15px; color: #2A2C8B; padding: 15px 20px; box-sizing: border-box; font-weight: 700; border-radius: 5px;}
#search_step #search_step01 .search_panel .panel_s .area_search_box .item_wrap label input[type="radio"]:checked + span{ background-color: #2A2C8B; color: #fff;}
#search_step #search_step01 .search_panel .panel_s .area_search_box .item_wrap label input[type="radio"] + span span{ display: inline-block; margin-right: 5px; font-size: 0.8em;}
#search_step #search_step01 .search_panel .panel_s .area_search_box .item_wrap.area_tokyo{ margin-bottom: 30px;}
#search_step #search_step01 .search_panel .panel_s .rosen_search_box{ display: flex; justify-content: space-between; padding: 45px; box-sizing: border-box;}
#search_step #search_step01 .search_panel .panel_s .rosen_search_box dl{ width: calc(50% - 20px); display: flex; text-align: left; align-items: center;}
#search_step #search_step01 .search_panel .panel_s .rosen_search_box dl dt{ width: 25%; font-size: 1.8em; font-weight: 700;}
#search_step #search_step01 .search_panel .panel_s .rosen_search_box dl dd{ width: 75%;}
#search_step #search_step01 .search_panel .panel_s .rosen_search_box dl dd .select_box{ width: 100%; position: relative;}
#search_step #search_step01 .search_panel .panel_s .rosen_search_box dl dd .select_box select{ position: relative; outline: none; -webkit-appearance: none; appearance: none; background: transparent; width: 100%; border: 1px solid #ddd; border-radius: 5px;  padding: 15px 50px 15px 20px; cursor: pointer; font-size: 1.5em;}
#search_step #search_step01 .search_panel .panel_s .rosen_search_box dl dd .select_box:before { display: block; position: absolute; top:40%; right:15px; content:''; background: #999; height: calc(tan(60deg) * 14px / 2); width: 14px; clip-path: polygon(0 0, 100% 0, 50% 100%);}
#search_step #search_step02{ margin-bottom: 40px;}
#search_step #search_step02 .search_panel{ background-color: #fff; border: 4px solid #2A2C8B; box-sizing: border-box; display: flex; padding: 45px; box-sizing: border-box; align-items: center; text-align: left;}
#search_step #search_step02 .search_panel > p{ font-size: 1.8em; font-weight: 700; width: 150px;}
#search_step #search_step02 .search_panel .item_wrap{ width: calc(100% - 150px); display: flex;}
#search_step #search_step02 .search_panel .item_wrap label{ width: calc(33.33333% - 12px); display: block; position: relative; cursor: pointer; margin-right: 16px;}
#search_step #search_step02 .search_panel .item_wrap label:nth-child(3){ margin-right: 0;}
#search_step #search_step02 .search_panel .item_wrap label input[type="radio"]{ position: absolute; opacity: 0;}
#search_step #search_step02 .search_panel .item_wrap label input[type="radio"] + span{ display: block; background-color: #F0F0F0; font-size: 15px; color: #2A2C8B; font-weight: 700; border-radius: 5px;}
#search_step #search_step02 .search_panel .item_wrap label input[type="radio"]:checked + span{ background-color: #2A2C8B; color: #fff;}
#search_step #search_step02 .search_panel .item_wrap label input[type="radio"] + span{ display: block; position: relative; padding: 25px 25px 25px 70px; box-sizing: border-box;}
#search_step #search_step02 .search_panel .item_wrap label input[type="radio"] + span:before{ content: ''; display: block; width: 40px; height: 40px; background-size: 40px 40px; position: absolute; top: 12px; left: 20px;}
#search_step #search_step02 .search_panel .item_wrap label:nth-child(1) input[type="radio"] + span:before{ background-image: url(/sell/images/syubetsu_b01@2x.png);}
#search_step #search_step02 .search_panel .item_wrap label:nth-child(2) input[type="radio"] + span:before{ background-image: url(/sell/images/syubetsu_b02@2x.png);}
#search_step #search_step02 .search_panel .item_wrap label:nth-child(3) input[type="radio"] + span:before{ background-image: url(/sell/images/syubetsu_b03@2x.png);}
#search_step #search_step02 .search_panel .item_wrap label:nth-child(1) input[type="radio"]:checked + span:before{ background-image: url(/sell/images/syubetsu_w01@2x.png);}
#search_step #search_step02 .search_panel .item_wrap label:nth-child(2) input[type="radio"]:checked + span:before{ background-image: url(/sell/images/syubetsu_w02@2x.png);}
#search_step #search_step02 .search_panel .item_wrap label:nth-child(3) input[type="radio"]:checked + span:before{ background-image: url(/sell/images/syubetsu_w03@2x.png);}
#search_step .search_btn{ max-width: 380px; margin: 0 auto;}
#search_step .search_btn button{ background-color: transparent; border: none; cursor: pointer; outline: none; padding: 0; width: 100%; appearance: none; display: block; font-size: 2.2em; font-weight: 700; color: #fff; line-height: 80px; border-radius: 5px; background: linear-gradient(270deg, #2ACAFF 0%, #2878D2 25%, #2878D2 51%, #2A2C8B 100%); background-position: 1% 50%; background-size: 200% auto; webkit-transition: .2s; -ms-transition: .2s; transition: .2s;}
#search_step .search_btn button:hover{ background-position: 99% 50%;}


@media screen and (min-width: 768px) {

#search_step #search_step01 .search_panel .panel_s .area_search_box .item_wrap label:nth-last-child(-n+4){ margin-bottom: 0;}
#search_step #search_step01 .search_panel .panel_s .area_search_box .item_wrap label,
#search_step #search_step02 .search_panel .item_wrap label{ -webkit-transition: .2s; -ms-transition: .2s; transition: .2s;}
#search_step #search_step01 .search_panel .panel_s .area_search_box .item_wrap label input[type="radio"]:hover + span{ background-color: #2A2C8B; color: #fff;}
#search_step #search_step02 .search_panel .item_wrap label input[type="radio"]:hover + span{ background-color: #2A2C8B; color: #fff;}
#search_step #search_step02 .search_panel .item_wrap label:nth-child(1) input[type="radio"]:hover + span:before{ background-image: url(/sell/images/syubetsu_w01@2x.png);}
#search_step #search_step02 .search_panel .item_wrap label:nth-child(2) input[type="radio"]:hover + span:before{ background-image: url(/sell/images/syubetsu_w02@2x.png);}
#search_step #search_step02 .search_panel .item_wrap label:nth-child(3) input[type="radio"]:hover + span:before{ background-image: url(/sell/images/syubetsu_w03@2x.png);}

}


@media screen and (max-width: 767px) {

#main{ padding: 0 20px;}
.introductory{ font-size: 1.5em; line-height: 1.3em; margin-bottom: 20px;}
/*タブ設定*/
.tab_s{ width: calc((100% / 2) - 4px); font-size: 14px; padding: 10px 0; border-radius: 5px 5px 0 0;}
.tab_s.active { padding: 15px 0;}

#search_step{ margin-bottom: 50px;}
#search_step p.search_step_title{ margin-bottom: 15px;}
#search_step p.search_step_title span:nth-child(1){ font-size: 1.8em;}
#search_step p.search_step_title span:nth-child(2){ font-size: 2.8em;}
#search_step #search_step01{ margin-bottom: 20px;}
#search_step #search_step01 .search_panel .panel_s .area_search_box{ padding: 15px;}
#search_step #search_step01 .search_panel .panel_s .area_search_box .item_wrap{ height: 200px; overflow-y: scroll;}
#search_step #search_step01 .search_panel .panel_s .area_search_box .item_wrap label{ width: calc(50% - 5px); margin-bottom: 10px; margin-right: 10px;}
#search_step #search_step01 .search_panel .panel_s .area_search_box .item_wrap label:nth-child(2n){ margin-right: 0;}
#search_step #search_step01 .search_panel .panel_s .area_search_box .item_wrap label:nth-last-child(-n+2){ margin-bottom: 0;}
#search_step #search_step01 .search_panel .panel_s .area_search_box .item_wrap label input[type="radio"] + span{ font-size: 1.3em; padding: 12px 15px;}
#search_step #search_step01 .search_panel .panel_s .rosen_search_box{ padding: 15px; display: block;}
#search_step #search_step01 .search_panel .panel_s .rosen_search_box dl{ width: 100%; display: block;}
#search_step #search_step01 .search_panel .panel_s .rosen_search_box dl:nth-child(1){ margin-bottom: 10px;}
#search_step #search_step01 .search_panel .panel_s .rosen_search_box dl dt{ width: 100%; font-size: 1.4em; margin-bottom: 8px;}
#search_step #search_step01 .search_panel .panel_s .rosen_search_box dl dd{ width: 100%;}
#search_step #search_step01 .search_panel .panel_s .rosen_search_box dl dd .select_box{ width: 100%; position: relative;}
#search_step #search_step01 .search_panel .panel_s .rosen_search_box dl dd .select_box select{ padding: 10px 40px 10px 15px; font-size: 1.4em;}
#search_step #search_step02{ margin-bottom: 20px;}
#search_step #search_step02 .search_panel{ padding: 15px; display: block;}
#search_step #search_step02 .search_panel > p{ font-size: 1.4em; width: 100%; margin-bottom: 10px;}
#search_step #search_step02 .search_panel .item_wrap{ width: 100%; justify-content: space-between;}
#search_step #search_step02 .search_panel .item_wrap label{ margin-right: 0; margin-bottom: 10px; width: calc(33.33333% - 7px); text-align: center;}
#search_step #search_step02 .search_panel .item_wrap label:nth-child(3){ margin-bottom: 0;} 
#search_step #search_step02 .search_panel .item_wrap label input[type="radio"] + span{ font-size: 13px;}
#search_step #search_step02 .search_panel .item_wrap label input[type="radio"] + span{ padding: 45px 0 15px 0; box-sizing: border-box;}
#search_step #search_step02 .search_panel .item_wrap label input[type="radio"] + span:before{ content: ''; display: block; width: 30px; height: 30px; background-size: 30px 30px; position: absolute; top: 10px; left: 50%; transform: translateX(-50%);}
#search_step .search_btn{ max-width: 240px;}
#search_step .search_btn button{ font-size: 1.8em; line-height: 65px;}

}

@media screen and (min-width: 375px) and (max-width: 767px){
#search_step #search_step02 .search_panel .item_wrap label{ margin-bottom: 0;}
}

@media screen and (max-width: 374px) {

#search_step #search_step02 .search_panel .item_wrap{ display: block;}
#search_step #search_step02 .search_panel .item_wrap label{ width: 100%; text-align: left; margin-bottom: 10px;}
#search_step #search_step02 .search_panel .item_wrap label input[type="radio"] + span{ padding: 15px 15px 15px 55px; box-sizing: border-box;}
#search_step #search_step02 .search_panel .item_wrap label input[type="radio"] + span:before{ content: ''; display: block; width: 30px; height: 30px; background-size: 30px 30px; position: absolute; top: 7px; left: 15px; transform: translateX(0);}

}


/*=================================== マトリクス表示 ===================================*/


#results{ margin-bottom: 120px;}
.search_results{ margin-bottom: 100px; position: relative;}
.search_results .results_title{ display: flex; justify-content: space-between; align-items: center; margin-bottom: 30px;}
.search_results .results_title p:nth-child(1){ font-size: 2.2em; text-align: left; font-weight: 700;}
.search_results .results_title p:nth-child(2){ font-size: 1.4em; line-height: 1.3;}
.search_results .results_x{ position: absolute; font-size: 1.4em;}
.search_results .results_x{ bottom: -40px; right: -10px;}
.search_results .results_y{ font-size: 1.4em; text-align: left; margin-left: -10px; margin-bottom: 5px;}

.bar-graph-wrap { position: relative; height: 400px; overflow-y: hidden; margin: 0 0 30px 30px; width: calc(100% - 30px); border: 1px solid #E6E6E6; box-sizing: border-box; /*background-color: #fff;*/ z-index: 1;}
.bar-graph-wrap:before{ content: ''; display: block; width: 100%; height: 100%; background-color: #fff; position: absolute; z-index: 0;}
.bar-graph-wrap .graph{ height: 100%; position: absolute; left: 15%; top: auto; bottom: 0; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -webkit-animation: graphAnim 1s forwards; animation: graphAnim 1.5s forwards; flex-direction: column-reverse; background-color: #C8DCF5;}
#bar-graph .bar-graph-wrap .graph{ width: 60px;}
#bar-graph2 .bar-graph-wrap .graph{ width: 100px;}
.bar-graph-wrap .graph span { font-size: 14px; color: #000;}


.bar-graph-wrap .graph.to2 { bottom: 0; left: 3%;}
.bar-graph-wrap .graph.to3 { bottom: 0; left: 12%;}
.bar-graph-wrap .graph.to4 { bottom: 0; left: 22%;}
.bar-graph-wrap .graph.to5 { bottom: 0; left: 31.5%;}
.bar-graph-wrap .graph.to6 { bottom: 0; left: 41%;}
.bar-graph-wrap .graph.to7 { bottom: 0; left: 51%;}
.bar-graph-wrap .graph.to8 { bottom: 0; left: 60.5%;}
.bar-graph-wrap .graph.to9 { bottom: 0; left: 70%;}
.bar-graph-wrap .graph.to10 { bottom: 0; left: 79.5%;}
.bar-graph-wrap .graph.from10 { bottom: 0; left: 89%;}
/*.bar-graph-wrap .graph.to20 { bottom: 0; left: 82%;}
.bar-graph-wrap .graph.from20 { bottom: 0; left: 90%;}*/

/*============================== 50件まで ==============================*/

.upto50 ul.graph_y li:nth-child(1)::before{ content: '50';}
.upto50 ul.graph_y li:nth-child(2)::before{ content: '45';}
.upto50 ul.graph_y li:nth-child(3)::before{ content: '40';}
.upto50 ul.graph_y li:nth-child(4)::before{ content: '35';}
.upto50 ul.graph_y li:nth-child(5)::before{ content: '30';}
.upto50 ul.graph_y li:nth-child(6)::before{ content: '25';}
.upto50 ul.graph_y li:nth-child(7)::before{ content: '20';}
.upto50 ul.graph_y li:nth-child(8)::before{ content: '15';}
.upto50 ul.graph_y li:nth-child(9)::before{ content: '10';}
.upto50 ul.graph_y li:nth-child(10)::before{ content: '5';}
.upto50 ul.graph_y li:nth-child(11)::before{ content: '0';}

.upto50 .bar-graph-wrap .graph.num0{ height: 0%;}
.upto50 .bar-graph-wrap .graph.num1{ height: 2%;}
.upto50 .bar-graph-wrap .graph.num2{ height: 4%;}
.upto50 .bar-graph-wrap .graph.num3{ height: 6%;}
.upto50 .bar-graph-wrap .graph.num4{ height: 8%;}
.upto50 .bar-graph-wrap .graph.num5{ height: 10%;}
.upto50 .bar-graph-wrap .graph.num6{ height: 12%;}
.upto50 .bar-graph-wrap .graph.num7{ height: 14%;}
.upto50 .bar-graph-wrap .graph.num8{ height: 16%;}
.upto50 .bar-graph-wrap .graph.num9{ height: 17%;}
.upto50 .bar-graph-wrap .graph.num10{ height: 19%;}

.upto50 .bar-graph-wrap .graph.num11{ height: 21%;}
.upto50 .bar-graph-wrap .graph.num12{ height: 22.5%;}
.upto50 .bar-graph-wrap .graph.num13{ height: 24.5%;}
.upto50 .bar-graph-wrap .graph.num14{ height: 26%;}
.upto50 .bar-graph-wrap .graph.num15{ height: 28%;}
.upto50 .bar-graph-wrap .graph.num16{ height: 30%;}
.upto50 .bar-graph-wrap .graph.num17{ height: 32%;}
.upto50 .bar-graph-wrap .graph.num18{ height: 34%;}
.upto50 .bar-graph-wrap .graph.num19{ height: 35.5%;}
.upto50 .bar-graph-wrap .graph.num20{ height: 37%;}

.upto50 .bar-graph-wrap .graph.num21{ height: 39%;}
.upto50 .bar-graph-wrap .graph.num22{ height: 40.5%;}
.upto50 .bar-graph-wrap .graph.num23{ height: 42.5%;}
.upto50 .bar-graph-wrap .graph.num24{ height: 44%;}
.upto50 .bar-graph-wrap .graph.num25{ height: 46%;}
.upto50 .bar-graph-wrap .graph.num26{ height: 48%;}
.upto50 .bar-graph-wrap .graph.num27{ height: 50%;}
.upto50 .bar-graph-wrap .graph.num28{ height: 51.5%;}
.upto50 .bar-graph-wrap .graph.num29{ height: 53%;}
.upto50 .bar-graph-wrap .graph.num30{ height: 55%;}

.upto50 .bar-graph-wrap .graph.num31{ height: 57%;}
.upto50 .bar-graph-wrap .graph.num32{ height: 59%;}
.upto50 .bar-graph-wrap .graph.num33{ height: 61%;}
.upto50 .bar-graph-wrap .graph.num34{ height: 62.5%;}
.upto50 .bar-graph-wrap .graph.num35{ height: 64%;}
.upto50 .bar-graph-wrap .graph.num36{ height: 66%;}
.upto50 .bar-graph-wrap .graph.num37{ height: 68%;}
.upto50 .bar-graph-wrap .graph.num38{ height: 70%;}
.upto50 .bar-graph-wrap .graph.num39{ height: 71.5%;}
.upto50 .bar-graph-wrap .graph.num40{ height: 73%;}

.upto50 .bar-graph-wrap .graph.num41{ height: 75%;}
.upto50 .bar-graph-wrap .graph.num42{ height: 77.5%;}
.upto50 .bar-graph-wrap .graph.num43{ height: 78.5%;}
.upto50 .bar-graph-wrap .graph.num44{ height: 80.5%;}
.upto50 .bar-graph-wrap .graph.num45{ height: 82.5%;}
.upto50 .bar-graph-wrap .graph.num46{ height: 84%;}
.upto50 .bar-graph-wrap .graph.num47{ height: 86.5%;}
.upto50 .bar-graph-wrap .graph.num48{ height: 88%;}
.upto50 .bar-graph-wrap .graph.num49{ height: 89.5%;}
.upto50 .bar-graph-wrap .graph.num50{ height: 91%;}

.upto50 .bar-graph-wrap .graph.num51{ height: 93%;}
.upto50 .bar-graph-wrap .graph.num52{ height: 95%;}
.upto50 .bar-graph-wrap .graph.num53{ height: 96.5%;}
.upto50 .bar-graph-wrap .graph.num54{ height: 98.5%;}
.upto50 .bar-graph-wrap .graph.num55{ height: 100%;}
 
/*============================== 100件まで ==============================*/

.upto100 ul.graph_y li:nth-child(1)::before{ content: '100';}
.upto100 ul.graph_y li:nth-child(2)::before{ content: '90';}
.upto100 ul.graph_y li:nth-child(3)::before{ content: '80';}
.upto100 ul.graph_y li:nth-child(4)::before{ content: '70';}
.upto100 ul.graph_y li:nth-child(5)::before{ content: '60';}
.upto100 ul.graph_y li:nth-child(6)::before{ content: '50';}
.upto100 ul.graph_y li:nth-child(7)::before{ content: '40';}
.upto100 ul.graph_y li:nth-child(8)::before{ content: '30';}
.upto100 ul.graph_y li:nth-child(9)::before{ content: '20';}
.upto100 ul.graph_y li:nth-child(10)::before{ content: '10';}
.upto100 ul.graph_y li:nth-child(11)::before{ content: '0';}

.upto100 .bar-graph-wrap .graph.num0{ height: 0%;}
.upto100 .bar-graph-wrap .graph.num1{ height: 1%;}
.upto100 .bar-graph-wrap .graph.num2{ height: 2%;}
.upto100 .bar-graph-wrap .graph.num3{ height: 3%;}
.upto100 .bar-graph-wrap .graph.num4{ height: 4%;}
.upto100 .bar-graph-wrap .graph.num5{ height: 5%;}
.upto100 .bar-graph-wrap .graph.num6{ height: 6%;}
.upto100 .bar-graph-wrap .graph.num7{ height: 7%;}
.upto100 .bar-graph-wrap .graph.num8{ height: 8%;}
.upto100 .bar-graph-wrap .graph.num9{ height: 9%;}
.upto100 .bar-graph-wrap .graph.num10{ height: 10%;}

.upto100 .bar-graph-wrap .graph.num11{ height: 11%;}
.upto100 .bar-graph-wrap .graph.num12{ height: 12%;}
.upto100 .bar-graph-wrap .graph.num13{ height: 13%;}
.upto100 .bar-graph-wrap .graph.num14{ height: 14%;}
.upto100 .bar-graph-wrap .graph.num15{ height: 15%;}
.upto100 .bar-graph-wrap .graph.num16{ height: 15.5%;}
.upto100 .bar-graph-wrap .graph.num17{ height: 16%;}
.upto100 .bar-graph-wrap .graph.num18{ height: 17%;}
.upto100 .bar-graph-wrap .graph.num19{ height: 18%;}
.upto100 .bar-graph-wrap .graph.num20{ height: 19%;}

.upto100 .bar-graph-wrap .graph.num21{ height: 20%;}
.upto100 .bar-graph-wrap .graph.num22{ height: 21%;}
.upto100 .bar-graph-wrap .graph.num23{ height: 22%;}
.upto100 .bar-graph-wrap .graph.num24{ height: 23%;}
.upto100 .bar-graph-wrap .graph.num25{ height: 24%;}
.upto100 .bar-graph-wrap .graph.num26{ height: 24.5%;}
.upto100 .bar-graph-wrap .graph.num27{ height: 25%;}
.upto100 .bar-graph-wrap .graph.num28{ height: 26%;}
.upto100 .bar-graph-wrap .graph.num29{ height: 27%;}
.upto100 .bar-graph-wrap .graph.num30{ height: 28%;}

.upto100 .bar-graph-wrap .graph.num31{ height: 29%;}
.upto100 .bar-graph-wrap .graph.num32{ height: 30%;}
.upto100 .bar-graph-wrap .graph.num33{ height: 31%;}
.upto100 .bar-graph-wrap .graph.num34{ height: 32%;}
.upto100 .bar-graph-wrap .graph.num35{ height: 33%;}
.upto100 .bar-graph-wrap .graph.num36{ height: 33.5%;}
.upto100 .bar-graph-wrap .graph.num37{ height: 34%;}
.upto100 .bar-graph-wrap .graph.num38{ height: 35%;}
.upto100 .bar-graph-wrap .graph.num39{ height: 36%;}
.upto100 .bar-graph-wrap .graph.num40{ height: 37%;}

.upto100 .bar-graph-wrap .graph.num41{ height: 38%;}
.upto100 .bar-graph-wrap .graph.num42{ height: 39%;}
.upto100 .bar-graph-wrap .graph.num43{ height: 40%;}
.upto100 .bar-graph-wrap .graph.num44{ height: 41%;}
.upto100 .bar-graph-wrap .graph.num45{ height: 42%;}
.upto100 .bar-graph-wrap .graph.num46{ height: 42.5%;}
.upto100 .bar-graph-wrap .graph.num47{ height: 43%;}
.upto100 .bar-graph-wrap .graph.num48{ height: 44%;}
.upto100 .bar-graph-wrap .graph.num49{ height: 45%;}
.upto100 .bar-graph-wrap .graph.num50{ height: 46%;}

.upto100 .bar-graph-wrap .graph.num51{ height: 47%;}
.upto100 .bar-graph-wrap .graph.num52{ height: 48%;}
.upto100 .bar-graph-wrap .graph.num53{ height: 49%;}
.upto100 .bar-graph-wrap .graph.num54{ height: 50%;}
.upto100 .bar-graph-wrap .graph.num55{ height: 51%;}
.upto100 .bar-graph-wrap .graph.num56{ height: 51.5%;}
.upto100 .bar-graph-wrap .graph.num57{ height: 52%;}
.upto100 .bar-graph-wrap .graph.num58{ height: 53%;}
.upto100 .bar-graph-wrap .graph.num59{ height: 54%;}
.upto100 .bar-graph-wrap .graph.num60{ height: 55%;}

.upto100 .bar-graph-wrap .graph.num61{ height: 56%;}
.upto100 .bar-graph-wrap .graph.num62{ height: 57%;}
.upto100 .bar-graph-wrap .graph.num63{ height: 58%;}
.upto100 .bar-graph-wrap .graph.num64{ height: 59%;}
.upto100 .bar-graph-wrap .graph.num65{ height: 60%;}
.upto100 .bar-graph-wrap .graph.num66{ height: 60.5%;}
.upto100 .bar-graph-wrap .graph.num67{ height: 61%;}
.upto100 .bar-graph-wrap .graph.num68{ height: 62%;}
.upto100 .bar-graph-wrap .graph.num69{ height: 63%;}
.upto100 .bar-graph-wrap .graph.num70{ height: 64%;}

.upto100 .bar-graph-wrap .graph.num71{ height: 65%;}
.upto100 .bar-graph-wrap .graph.num72{ height: 66%;}
.upto100 .bar-graph-wrap .graph.num73{ height: 67%;}
.upto100 .bar-graph-wrap .graph.num74{ height: 68%;}
.upto100 .bar-graph-wrap .graph.num75{ height: 69%;}
.upto100 .bar-graph-wrap .graph.num76{ height: 69.5%;}
.upto100 .bar-graph-wrap .graph.num77{ height: 70%;}
.upto100 .bar-graph-wrap .graph.num78{ height: 71%;}
.upto100 .bar-graph-wrap .graph.num79{ height: 72%;}
.upto100 .bar-graph-wrap .graph.num80{ height: 73%;}

.upto100 .bar-graph-wrap .graph.num81{ height: 74%;}
.upto100 .bar-graph-wrap .graph.num82{ height: 75%;}
.upto100 .bar-graph-wrap .graph.num83{ height: 76%;}
.upto100 .bar-graph-wrap .graph.num84{ height: 77%;}
.upto100 .bar-graph-wrap .graph.num85{ height: 78%;}
.upto100 .bar-graph-wrap .graph.num86{ height: 78.5%;}
.upto100 .bar-graph-wrap .graph.num87{ height: 79%;}
.upto100 .bar-graph-wrap .graph.num88{ height: 80%;}
.upto100 .bar-graph-wrap .graph.num89{ height: 81%;}
.upto100 .bar-graph-wrap .graph.num90{ height: 82%;}

.upto100 .bar-graph-wrap .graph.num91{ height: 83%;}
.upto100 .bar-graph-wrap .graph.num92{ height: 84%;}
.upto100 .bar-graph-wrap .graph.num93{ height: 85%;}
.upto100 .bar-graph-wrap .graph.num94{ height: 86%;}
.upto100 .bar-graph-wrap .graph.num95{ height: 87%;}
.upto100 .bar-graph-wrap .graph.num96{ height: 87.5%;}
.upto100 .bar-graph-wrap .graph.num97{ height: 88%;}
.upto100 .bar-graph-wrap .graph.num98{ height: 89%;}
.upto100 .bar-graph-wrap .graph.num99{ height: 90%;}
.upto100 .bar-graph-wrap .graph.num100{ height: 91%;}

/*============================== 150件まで ==============================*/

.upto150 ul.graph_y li:nth-child(1)::before{ content: '150';}
.upto150 ul.graph_y li:nth-child(2)::before{ content: '135';}
.upto150 ul.graph_y li:nth-child(3)::before{ content: '120';}
.upto150 ul.graph_y li:nth-child(4)::before{ content: '105';}
.upto150 ul.graph_y li:nth-child(5)::before{ content: '90';}
.upto150 ul.graph_y li:nth-child(6)::before{ content: '75';}
.upto150 ul.graph_y li:nth-child(7)::before{ content: '60';}
.upto150 ul.graph_y li:nth-child(8)::before{ content: '45';}
.upto150 ul.graph_y li:nth-child(9)::before{ content: '30';}
.upto150 ul.graph_y li:nth-child(10)::before{ content: '15';}
.upto150 ul.graph_y li:nth-child(11)::before{ content: '0';}

.upto150 .bar-graph-wrap .graph.num0{ height: 0%;}
.upto150 .bar-graph-wrap .graph.num1{ height: 1%;}
.upto150 .bar-graph-wrap .graph.num2{ height: 1.5%;}
.upto150 .bar-graph-wrap .graph.num3{ height: 2%;}
.upto150 .bar-graph-wrap .graph.num4{ height: 3%;}
.upto150 .bar-graph-wrap .graph.num5{ height: 3.5%;}
.upto150 .bar-graph-wrap .graph.num6{ height: 4%;}
.upto150 .bar-graph-wrap .graph.num7{ height: 5%;}
.upto150 .bar-graph-wrap .graph.num8{ height: 5.5%;}
.upto150 .bar-graph-wrap .graph.num9{ height: 6%;}
.upto150 .bar-graph-wrap .graph.num10{ height: 7%;}

.upto150 .bar-graph-wrap .graph.num11{ height: 7.5%;}
.upto150 .bar-graph-wrap .graph.num12{ height: 8%;}
.upto150 .bar-graph-wrap .graph.num13{ height: 9%;}
.upto150 .bar-graph-wrap .graph.num14{ height: 9.5%;}
.upto150 .bar-graph-wrap .graph.num15{ height: 10%;}/*基準*/
.upto150 .bar-graph-wrap .graph.num16{ height: 10.5%;}
.upto150 .bar-graph-wrap .graph.num17{ height: 11%;}
.upto150 .bar-graph-wrap .graph.num18{ height: 11.5%;}
.upto150 .bar-graph-wrap .graph.num19{ height: 12%;}
.upto150 .bar-graph-wrap .graph.num20{ height: 12.5%;}

.upto150 .bar-graph-wrap .graph.num21{ height: 13%;}
.upto150 .bar-graph-wrap .graph.num22{ height: 13.5%;}
.upto150 .bar-graph-wrap .graph.num23{ height: 14%;}
.upto150 .bar-graph-wrap .graph.num24{ height: 14.5%;}
.upto150 .bar-graph-wrap .graph.num25{ height: 15.5%;}
.upto150 .bar-graph-wrap .graph.num26{ height: 16%;}
.upto150 .bar-graph-wrap .graph.num27{ height: 17.5%;}
.upto150 .bar-graph-wrap .graph.num28{ height: 18%;}
.upto150 .bar-graph-wrap .graph.num29{ height: 18.5%;}
.upto150 .bar-graph-wrap .graph.num30{ height: 19%;}/*基準*/

.upto150 .bar-graph-wrap .graph.num31{ height: 19.5%;}
.upto150 .bar-graph-wrap .graph.num32{ height: 20%;}
.upto150 .bar-graph-wrap .graph.num33{ height: 20.5%;}
.upto150 .bar-graph-wrap .graph.num34{ height: 21%;}
.upto150 .bar-graph-wrap .graph.num35{ height: 21.5%;}
.upto150 .bar-graph-wrap .graph.num36{ height: 22%;}
.upto150 .bar-graph-wrap .graph.num37{ height: 22.5%;}
.upto150 .bar-graph-wrap .graph.num38{ height: 23.5%;}
.upto150 .bar-graph-wrap .graph.num39{ height: 24%;}
.upto150 .bar-graph-wrap .graph.num40{ height: 24.5%;}

.upto150 .bar-graph-wrap .graph.num41{ height: 25%;}
.upto150 .bar-graph-wrap .graph.num42{ height: 25.5%;}
.upto150 .bar-graph-wrap .graph.num43{ height: 26%;}
.upto150 .bar-graph-wrap .graph.num44{ height: 27%;}
.upto150 .bar-graph-wrap .graph.num45{ height: 28%;}/*基準*/
.upto150 .bar-graph-wrap .graph.num46{ height: 29%;}
.upto150 .bar-graph-wrap .graph.num47{ height: 29.5%;}
.upto150 .bar-graph-wrap .graph.num48{ height: 30%;}
.upto150 .bar-graph-wrap .graph.num49{ height: 30.5%;}
.upto150 .bar-graph-wrap .graph.num50{ height: 31%;}

.upto150 .bar-graph-wrap .graph.num51{ height: 32%;}
.upto150 .bar-graph-wrap .graph.num52{ height: 32.5%;}
.upto150 .bar-graph-wrap .graph.num53{ height: 33%;}
.upto150 .bar-graph-wrap .graph.num54{ height: 33.5%;}
.upto150 .bar-graph-wrap .graph.num55{ height: 34%;}
.upto150 .bar-graph-wrap .graph.num56{ height: 34.5%;}
.upto150 .bar-graph-wrap .graph.num57{ height: 35%;}
.upto150 .bar-graph-wrap .graph.num58{ height: 35.5%;}
.upto150 .bar-graph-wrap .graph.num59{ height: 36%;}
.upto150 .bar-graph-wrap .graph.num60{ height: 37%;}/*基準*/

.upto150 .bar-graph-wrap .graph.num61{ height: 37.5%;}
.upto150 .bar-graph-wrap .graph.num62{ height: 38%;}
.upto150 .bar-graph-wrap .graph.num63{ height: 38.5%;}
.upto150 .bar-graph-wrap .graph.num64{ height: 39%;}
.upto150 .bar-graph-wrap .graph.num65{ height: 39.5%;}
.upto150 .bar-graph-wrap .graph.num66{ height: 40%;}
.upto150 .bar-graph-wrap .graph.num67{ height: 40.5%;}
.upto150 .bar-graph-wrap .graph.num68{ height: 41%;}
.upto150 .bar-graph-wrap .graph.num69{ height: 41.5%;}
.upto150 .bar-graph-wrap .graph.num70{ height: 42%;}

.upto150 .bar-graph-wrap .graph.num71{ height: 43%;}
.upto150 .bar-graph-wrap .graph.num72{ height: 44%;}
.upto150 .bar-graph-wrap .graph.num73{ height: 44.5%;}
.upto150 .bar-graph-wrap .graph.num74{ height: 45%;}
.upto150 .bar-graph-wrap .graph.num75{ height: 46%;}/*基準*/
.upto150 .bar-graph-wrap .graph.num76{ height: 47%;}
.upto150 .bar-graph-wrap .graph.num77{ height: 47.5%;}
.upto150 .bar-graph-wrap .graph.num78{ height: 48%;}
.upto150 .bar-graph-wrap .graph.num79{ height: 49%;}
.upto150 .bar-graph-wrap .graph.num80{ height: 49.5%;}

.upto150 .bar-graph-wrap .graph.num81{ height: 50%;}
.upto150 .bar-graph-wrap .graph.num82{ height: 50.5%;}
.upto150 .bar-graph-wrap .graph.num83{ height: 51%;}
.upto150 .bar-graph-wrap .graph.num84{ height: 51.5%;}
.upto150 .bar-graph-wrap .graph.num85{ height: 52%;}
.upto150 .bar-graph-wrap .graph.num86{ height: 53%;}
.upto150 .bar-graph-wrap .graph.num87{ height: 53.5%;}
.upto150 .bar-graph-wrap .graph.num88{ height: 54%;}
.upto150 .bar-graph-wrap .graph.num89{ height: 54.5%;}
.upto150 .bar-graph-wrap .graph.num90{ height: 55%;}/*基準*/

.upto150 .bar-graph-wrap .graph.num91{ height: 55.5%;}
.upto150 .bar-graph-wrap .graph.num92{ height: 56%;}
.upto150 .bar-graph-wrap .graph.num93{ height: 56.5%;}
.upto150 .bar-graph-wrap .graph.num94{ height: 57%;}
.upto150 .bar-graph-wrap .graph.num95{ height: 57.5%;}
.upto150 .bar-graph-wrap .graph.num96{ height: 58%;}
.upto150 .bar-graph-wrap .graph.num97{ height: 59%;}
.upto150 .bar-graph-wrap .graph.num98{ height: 59.5%;}
.upto150 .bar-graph-wrap .graph.num99{ height: 60%;}
.upto150 .bar-graph-wrap .graph.num100{ height: 60.5%;}

.upto150 .bar-graph-wrap .graph.num101{ height: 61%;}
.upto150 .bar-graph-wrap .graph.num102{ height: 62%;}
.upto150 .bar-graph-wrap .graph.num103{ height: 63%;}
.upto150 .bar-graph-wrap .graph.num104{ height: 63.5%;}
.upto150 .bar-graph-wrap .graph.num105{ height: 64%;}/*基準*/
.upto150 .bar-graph-wrap .graph.num106{ height: 64.5%;}
.upto150 .bar-graph-wrap .graph.num107{ height: 65%;}
.upto150 .bar-graph-wrap .graph.num108{ height: 65.5%;}
.upto150 .bar-graph-wrap .graph.num109{ height: 66%;}
.upto150 .bar-graph-wrap .graph.num110{ height: 67%;}

.upto150 .bar-graph-wrap .graph.num111{ height: 67.5%;}
.upto150 .bar-graph-wrap .graph.num112{ height: 68%;}
.upto150 .bar-graph-wrap .graph.num113{ height: 69%;}
.upto150 .bar-graph-wrap .graph.num114{ height: 69.5%;}
.upto150 .bar-graph-wrap .graph.num115{ height: 70%;}
.upto150 .bar-graph-wrap .graph.num116{ height: 70.5%;}
.upto150 .bar-graph-wrap .graph.num117{ height: 71%;}
.upto150 .bar-graph-wrap .graph.num118{ height: 72%;}
.upto150 .bar-graph-wrap .graph.num119{ height: 72.5%;}
.upto150 .bar-graph-wrap .graph.num120{ height: 73%;}/*基準*/

.upto150 .bar-graph-wrap .graph.num121{ height: 73.5%;}
.upto150 .bar-graph-wrap .graph.num122{ height: 74%;}
.upto150 .bar-graph-wrap .graph.num123{ height: 74.5%;}
.upto150 .bar-graph-wrap .graph.num124{ height: 75%;}
.upto150 .bar-graph-wrap .graph.num125{ height: 76%;}
.upto150 .bar-graph-wrap .graph.num126{ height: 76.5%;}
.upto150 .bar-graph-wrap .graph.num127{ height: 77%;}
.upto150 .bar-graph-wrap .graph.num128{ height: 78%;}
.upto150 .bar-graph-wrap .graph.num129{ height: 78.5%;}
.upto150 .bar-graph-wrap .graph.num130{ height: 79%;}

.upto150 .bar-graph-wrap .graph.num131{ height: 79.5%;}
.upto150 .bar-graph-wrap .graph.num132{ height: 80%;}
.upto150 .bar-graph-wrap .graph.num133{ height: 81%;}
.upto150 .bar-graph-wrap .graph.num134{ height: 81.5%;}
.upto150 .bar-graph-wrap .graph.num135{ height: 82%;}/*基準*/
.upto150 .bar-graph-wrap .graph.num136{ height: 82.5%;}
.upto150 .bar-graph-wrap .graph.num137{ height: 83%;}
.upto150 .bar-graph-wrap .graph.num138{ height: 83.5%;}
.upto150 .bar-graph-wrap .graph.num139{ height: 84%;}
.upto150 .bar-graph-wrap .graph.num140{ height: 85%;}

.upto150 .bar-graph-wrap .graph.num141{ height: 85.5%;}
.upto150 .bar-graph-wrap .graph.num142{ height: 86%;}
.upto150 .bar-graph-wrap .graph.num143{ height: 86.5%;}
.upto150 .bar-graph-wrap .graph.num144{ height: 87%;}
.upto150 .bar-graph-wrap .graph.num145{ height: 87.5%;}
.upto150 .bar-graph-wrap .graph.num146{ height: 88%;}
.upto150 .bar-graph-wrap .graph.num147{ height: 89%;}
.upto150 .bar-graph-wrap .graph.num148{ height: 90%;}
.upto150 .bar-graph-wrap .graph.num149{ height: 90.5%;}
.upto150 .bar-graph-wrap .graph.num150{ height: 91%;}/*基準*/


@-webkit-keyframes graphAnim {
  0% {
    -webkit-transform: translateY(100%);
            transform: translateY(100%);
  }
  100% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
}
 
@keyframes graphAnim {
  0% {
    -webkit-transform: translateY(100%);
            transform: translateY(100%);
  }
  100% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
}


.bar-graph-wrap .graph.to70 { bottom: 0; left: 3%;}
.bar-graph-wrap .graph.to90 { bottom: 0; left: 16.5%;}
.bar-graph-wrap .graph.to110 { bottom: 0; left: 30%;}
.bar-graph-wrap .graph.to130 { bottom: 0; left: 43.5%;}
.bar-graph-wrap .graph.to150 { bottom: 0; left: 57%;}
.bar-graph-wrap .graph.from150 { bottom: 0; left: 70.5%;}
.bar-graph-wrap .graph.not_specified { bottom: 0; left: 84%;}

#bar-graph2 .bar-graph-wrap.graph_mansion .graph{ width: 80px;}
.bar-graph-wrap.graph_mansion .graph.to50 { bottom: 0; left: 3%;}
.bar-graph-wrap.graph_mansion .graph.to60 { bottom: 0; left: 15%;}
.bar-graph-wrap.graph_mansion .graph.to70 { bottom: 0; left: 27%;}
.bar-graph-wrap.graph_mansion .graph.to80 { bottom: 0; left: 38.5%;}
.bar-graph-wrap.graph_mansion .graph.to90 { bottom: 0; left: 50%;}
.bar-graph-wrap.graph_mansion .graph.to100 { bottom: 0; left: 61.7%;}
.bar-graph-wrap.graph_mansion .graph.from100 { bottom: 0; left: 73.5%;}
.bar-graph-wrap.graph_mansion .graph.not_specified { bottom: 0; left: 85.5%;}

#bar-graph,
#bar-graph2{ position: relative;}
#bar-graph ul.graph_y,
#bar-graph2 ul.graph_y{ position: absolute; top: 28px; left: 0; height: calc(100% - 0px);}
#bar-graph ul.graph_y li,
#bar-graph2 ul.graph_y li{ height: calc(100% / 11); font-size: 1.4em;}
#bar-graph .sp_scroll,
#bar-graph2 .sp_scroll{ position: relative;}
#bar-graph .sp_scroll ul.graph_x{ position: absolute; bottom: -20px; right: 30px; width: calc(100% - 65px); display: flex;}
#bar-graph2 .sp_scroll ul.graph_x{ position: absolute; bottom: -20px; right: 50px; width: calc(100% - 90px); display: flex;}
#bar-graph .sp_scroll ul.graph_x li,
#bar-graph2 .sp_scroll ul.graph_x li{ text-align: center; width: calc(100% / 10); font-size: 1.4em;}
#bar-graph2 .sp_scroll ul.graph_x li{ text-align: center; width: calc(100% / 7); font-size: 1.4em;}
.content .graph_y_line{ position: absolute; top: 0; right: 0; z-index: 10; width: calc(100% + 10px); height: 100%;}
.content .graph_y_line span{ position: absolute; display: block; width: 100%; height: 1px; background-color: #E6E6E6;}
.content .graph_y_line span:nth-child(1){ bottom: 10%; right: 0;}
.content .graph_y_line span:nth-child(2){ bottom: 19%; right: 0;}
.content .graph_y_line span:nth-child(3){ bottom: 28%; right: 0;}
.content .graph_y_line span:nth-child(4){ bottom: 37%; right: 0;}
.content .graph_y_line span:nth-child(5){ bottom: 46%; right: 0;}
.content .graph_y_line span:nth-child(6){ bottom: 55%; right: 0;}
.content .graph_y_line span:nth-child(7){ bottom: 64%; right: 0;}
.content .graph_y_line span:nth-child(8){ bottom: 73%; right: 0;}
.content .graph_y_line span:nth-child(9){ bottom: 82%; right: 0;}
.content .graph_y_line span:nth-child(10){ bottom: 91%; right: 0;}

.content .bar-graph-wrap .graph{ z-index: 20;}
.content .bar-graph-wrap .graph span{ display: block; width: 100%; text-align: center; position: absolute; top: -20px; }

@media screen and (max-width: 750px) {
.bar-graph-wrap .graph span { font-size: 12px;}
}

@media screen and (min-width: 768px) {
.bar-graph-wrap .graph{ webkit-transition: .2s; -ms-transition: .2s; transition: .2s;}
}

@media screen and (max-width: 767px) {
#results{ margin-bottom: 60px;}
.search_results{ margin-bottom: 30px;}
.search_results .results_title{ display: block; margin-bottom: 15px;}
.search_results .results_title p:nth-child(1){ font-size: 1.8em; margin-bottom: 15px;}
.search_results .results_title p:nth-child(2){ font-size: 1.3em; text-align: left;}
.search_results .results_x{ bottom: -15px; right: -10px;}
.search_results .results_y{ top: 60px;}
#bar-graph .sp_scroll{ width: calc(100% - 20px); height: 270px; overflow-x: scroll; overflow-y: hidden; margin-left: 20px;}
#bar-graph2 .sp_scroll{ width: calc(100% - 20px); height: 245px; overflow-x: scroll; overflow-y: hidden; margin-left: 20px;}
#bar-graph ul.graph_y li,
#bar-graph2 ul.graph_y li{ font-size: 1.2em;}
.bar-graph-wrap{ width: 600px; height: 210px; overflow: hidden; margin: 0;}
#bar-graph .sp_scroll ul.graph_x{ position: absolute; top: 230px; bottom: auto; right: auto; width: 580px;}
#bar-graph .sp_scroll ul.graph_x li{ font-size: 0.7rem; transform: rotate(-0.15turn); white-space: nowrap;}
#bar-graph .bar-graph-wrap .graph{ width: 30px;}
.content .bar-graph-wrap .graph span{ width: 120%; top: -15px;}
#bar-graph ul.graph_y{ position: absolute; top: 10px; left: -10px; height: calc(100% - 59px);}
#bar-graph2 ul.graph_y{ position: absolute; top: 10px; left: -10px; height: calc(100% - 35px);}
#bar-graph2 .bar-graph-wrap .graph{ width: 50px;}
#bar-graph2 .bar-graph-wrap.graph_mansion .graph{ width: 45px;}
#bar-graph2 .sp_scroll ul.graph_x{ position: absolute; top: 210px; bottom: auto; right: auto; width: 570px;}
#bar-graph2 .sp_scroll ul.graph_x li{ font-size: 1.3em;}
}

/*=================================== 検索結果 ===================================*/

#results_box{ margin-bottom: 60px;}
.results_box_title{ display: flex; justify-content: center; align-items: baseline; padding: 0 0 60px; box-sizing: border-box;}
.results_box_title h1{ font-size: 2em; font-weight: 700;}
.results_box_title p{ font-size: 2em; font-weight: 700;}
.results_box_title p span{ font-size: 1.6em; text-decoration: underline;}
.results_box_list{}
.results_box_list .results_box_list_inner{ display: flex; flex-wrap: wrap;}
.results_box_list .results_box_list_inner li{ background-color: #fff; width: calc(50% - 30px); justify-content: space-between; margin-bottom: 60px; text-align: left; position: relative; padding-bottom: 120px; box-sizing: border-box;}
.results_box_list .results_box_list_inner li:nth-child(odd){ margin-right: 60px;}
.results_box_list .results_box_list_inner li .koma_top{ padding: 35px; box-sizing: border-box; border-bottom: 1px solid #E6E6E6;}
.results_box_list .results_box_list_inner li .koma_top .title{ font-size: 2.2em; line-height: 1.3em; font-weight: 700; color: #2A2C8B; margin-bottom: 20px;}
.results_box_list .results_box_list_inner li .koma_top .data{}
.results_box_list .results_box_list_inner li .koma_top .data dl{ font-size: 1.4em; line-height: 1.3em; margin-bottom: 5px;}
.results_box_list .results_box_list_inner li .koma_top .data dl dt{ display: inline;}
.results_box_list .results_box_list_inner li .koma_top .data dl dd{ display: inline;}
.results_box_list .results_box_list_inner li .koma_btm{ padding: 35px 35px 0; box-sizing: border-box;}
.results_box_list .results_box_list_inner li .koma_btm .staff_box{ display: flex; justify-content: space-between;}
.results_box_list .results_box_list_inner li .koma_btm .staff_box .staff_box_left{ width: calc(100% - 120px);}
.results_box_list .results_box_list_inner li .koma_btm .staff_box .staff_box_left .staff_name{ font-size: 1.4em; line-height: 1.5em; display: flex; margin-bottom: 15px;}
.results_box_list .results_box_list_inner li .koma_btm .staff_box .staff_box_left .staff_name p:nth-child(1){ width: 60px; font-weight: 700;}
.results_box_list .results_box_list_inner li .koma_btm .staff_box .staff_box_left .staff_name p:nth-child(2){ width: calc(100% - 60px);}
.results_box_list .results_box_list_inner li .koma_btm .staff_box .staff_box_left .staff_name p:nth-child(2) span{ display: block;}
.results_box_list .results_box_list_inner li .koma_btm .staff_box .staff_box_left .staff_com{ font-size: 1.4em; line-height: 1.5em;}
.results_box_list .results_box_list_inner li .koma_btm .staff_box .staff_box_right{ width: 100px; height: 120px; overflow: hidden;}
.results_box_list .results_box_list_inner li .koma_btm .staff_box .staff_box_right img{ width: 100px!important; height: 120px!important; object-fit: cover;}
.results_box_list .results_box_list_inner li .koma_btm .more_btn a{ display: inline-block; background-color: #2A2C8B; color: #fff!important; font-size: 1.6em; padding: 20px 25px; box-sizing: border-box; border-radius: 5px;}
.results_box_list .results_box_list_inner li .koma_btm .staff_box.no_photo{ display: block;}
.results_box_list .results_box_list_inner li .koma_btm .staff_box.no_photo .staff_box_left{ width: 100%;}
/*会員限定情報*/
.results_box_list .results_box_list_inner li.members_only{ padding-bottom: 0!important; min-height: 450px;}
.results_box_list .results_box_list_inner li.members_only .mo_inner{ padding: 4px; box-sizing: border-box; width: 100%; height: 100%; position: relative;}
.results_box_list .results_box_list_inner li.members_only .mo_inner a{ display: block; width: 100%; height: 100%; background-image: url("/sell/images_purchasers/member_back.jpg"); background-size: cover; background-repeat: none;}
.results_box_list .results_box_list_inner li.members_only .mo_inner a .mo_text{ text-align: center; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%);}
.results_box_list .results_box_list_inner li.members_only .mo_inner a .mo_text .mo_title{ width: 315px; height: 120px; margin: 0 auto 20px;}
.results_box_list .results_box_list_inner li.members_only .mo_inner a .mo_text .mo_title img{ width: 100%; height: auto;}
.results_box_list .results_box_list_inner li.members_only .mo_inner a .mo_text .mo_btn{ font-size: 2em; width: 315px; margin: 0 auto 20px; display: block; font-weight: 700; background: linear-gradient(270deg, #B4DE4F 0%, #4BCD6E 25%, #4BCD6E 51%, #008F2A 100%); background-position: 1% 50%; background-size: 200% auto; border-radius: 5px; color: #fff !important; justify-content: center; align-items: center; padding: 20px 30px; box-sizing: border-box;}
.results_box_list .results_box_list_inner li.members_only .mo_inner a .mo_text .mo_com{ font-size: 1.7em; line-height: 1.5em; color: #fff;}

.backbtn{ padding-bottom: 100px; box-sizing: border-box;}
.backbtn a{ display: inline-block; color: #2A2C8B!important; font-size: 1.6em; background-color: #fff; font-weight: 700; padding: 15px 30px; border-radius: 5px;}


@media screen and (min-width: 768px) {

.bottom_button ul li a:hover{ color: #fff!important; background-color: #2A2C8B;}
.results_box_list .list_text a:hover{ background-color: #C8DCF5;}
.results_box_list ul li .member_box a:hover{ opacity: 0.7;}
.backbtn a:hover{ background-color: #C8DCF5;}
.results_box_list .results_box_list_inner li .koma_btm .more_btn{ text-align: center; position: absolute; bottom: 10px; left: 50%; transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%);}
.results_box_list .results_box_list_inner li .koma_btm .more_btn a:hover{ opacity: 0.6;}
.results_box_list .results_box_list_inner li.members_only .mo_inner a:hover{ opacity: 0.8;}

}


@media screen and (max-width: 767px) {

.results_box_title{ display: block; padding: 0 0 25px;}
.results_box_title h1{ font-size: 1.5em;}
.results_box_title p{ font-size: 1.5em;}
.results_box_list{ margin-bottom: 30px;}
.results_box_list .results_box_list_inner{ display: block;}
.results_box_list .results_box_list_inner li{ width: 100%; margin-bottom: 15px; padding-bottom: 0;}
.results_box_list .results_box_list_inner li:nth-child(odd){ margin-right: 0;}
.results_box_list .results_box_list_inner li .koma_top{ padding: 15px;}
.results_box_list .results_box_list_inner li .koma_top .title{ font-size: 1.5em; margin-bottom: 10px;}
.results_box_list .results_box_list_inner li .koma_top .data dl{ font-size: 1.2em; line-height: 1.3em; margin-bottom: 5px;}
.results_box_list .results_box_list_inner li .koma_btm{ padding: 15px;}
.results_box_list .results_box_list_inner li .koma_btm .staff_box{ display: flex; position: relative; min-height: 94px;}
.results_box_list .results_box_list_inner li .koma_btm .staff_box .staff_box_left{ width: calc(100% - 90px);}
.results_box_list .results_box_list_inner li .koma_btm .staff_box .staff_box_left .staff_name{ width: 100%; font-size: 1.2em; line-height: 1.3em; margin-bottom: 5px;}
.results_box_list .results_box_list_inner li .koma_btm .staff_box .staff_box_left .staff_name p:nth-child(1){ width: 50px; font-weight: 700;}
.results_box_list .results_box_list_inner li .koma_btm .staff_box .staff_box_left .staff_name p:nth-child(2){ width: calc(100% - 50px);}
.results_box_list .results_box_list_inner li .koma_btm .staff_box .staff_box_left .staff_name p:nth-child(2) span{ display: block;}
.results_box_list .results_box_list_inner li .koma_btm .staff_box .staff_box_left .staff_com{ font-size: 1.2em; line-height: 1.5em; margin-bottom: 10px;}
.results_box_list .results_box_list_inner li .koma_btm .staff_box .staff_box_right{ width: 70px; height: 84px; position: absolute; top: 0; right: 0;}
.results_box_list .results_box_list_inner li .koma_btm .staff_box .staff_box_right img{ width: 70px!important; height: 84px!important;}
.results_box_list .results_box_list_inner li .koma_btm .more_btn{ text-align: center; position: relative; bottom: 0; left: 0;}
.results_box_list .results_box_list_inner li .koma_btm .more_btn a{ font-size: 1.4em; padding: 15px 20px; font-weight: 700;}
/*会員限定情報*/
.results_box_list .results_box_list_inner li.members_only{ width: 100%; height: 250px; min-height: 250px;}
.results_box_list .results_box_list_inner li.members_only .mo_inner a .mo_text .mo_title{ width: 170px; height: auto; margin: 0 auto 10px;}
.results_box_list .results_box_list_inner li.members_only .mo_inner a .mo_text .mo_btn{ font-size: 1.7em; width: 170px; margin: 0 auto 10px; padding: 15px 0;}
.results_box_list .results_box_list_inner li.members_only .mo_inner a .mo_text .mo_com{ font-size: 1.2em;}

.backbtn{ padding-bottom: 30px;}
.backbtn a{ font-size: 1.3em; padding: 15px 20px; border-radius: 5px;}



}





/*=================================== 対象物件が無い場合のメッセージ表示 ===================================*/
.results_empty_comm {font-size:15px;line-height:1.8;background:#CCC;padding:40px 0;margin:0 0 60px;}
.results_empty_comm .sp_only{display:none;}
@media screen and (max-width: 767px) {
	.results_empty_comm {font-size:14px;padding:30px 0;margin:0 0 20px;}
	.results_empty_comm .sp_only{display:block;}
}


