﻿h1 {
font-size:1em;
padding:1rem;
margin:0 0 3rem;
border-bottom:2px solid #ce382c;
text-align:center
}

.multi {
display:inline-block;
width:100%;
margin-bottom:.8rem;
font-size:2em;
font-weight:700;
padding:6px 0 14px;
border-bottom:8px solid rgba(225,0,51,1.00);
position:relative
}

.multi:before,.multi:after {
content:"";
display:block;
height:8px;
position:absolute;
bottom:-8px
}

.multi:before {
width:20%;
left:8%;
background:rgba(255,255,255,0.7)
}

.multi:after {
width:30%;
left:12%;
background:rgba(225,0,51,0.6)
}

.section {
margin-bottom:7rem
}

.section :last-child {
margin-bottom:0
}

.section>h2 {
text-align:center;
font-size:2rem;
margin-bottom:10px
}

.section>p {
text-align:center;
font-size:1.5em;
margin-bottom:2rem
}

.notice {
border:2px solid #c00;
margin-bottom:40px;
padding:10px
}

.notice p:last-of-type {
margin-bottom:0
}

.a6 table {
margin:0;
font-size:18px
}

.a6 table th {
width:55px
}

.a6 table th,.a6 table td {
line-height:1.5;
padding:12px
}

.careerD,.careerA,.careerS {
padding:3px;
-ms-border-radius:4px;
-moz-border-radius:4px;
-webkit-border-radius:4px;
border-radius:4px
}

.careerD {
color:#fff;
background-color:#c03
}

.careerA {
color:#fff;
background-color:#ec6c00
}

.careerS {
color:#fff;
background-color:#8e9aa5
}

.heading {
padding:10px;
margin:0 0 20px
}

.heading p {
text-align:center;
margin:0
}

#wBtn {
width:100%;
margin:0 auto 1rem;
display:flex;
flex-flow:row nowrap;
justify-content:center
}

.btnC {
position:relative;
box-sizing:border-box;
width:33%;
margin:0;
padding:1%;
text-align:center;
font-size:24px
}

.btnC h2 {
margin:0 0 1rem;
font-size:2.5rem
}

.headingD {
color:#c03
}

.headingA {
color:#ec6c00
}

.headingS {
color:#8e9aa5
}

.btnC p {
margin-left:15px;
color:#666;
font-size:1.4rem
}

.btnC a {
box-sizing:border-box;
display:block;
padding:6% 3%;
color:#3d3333;
-webkit-border-radius:6px;
-moz-border-radius:6px;
border-radius:6px;
border:1px solid #ccc;
text-decoration:none;
background-color:#fafafa
}

.btnC a:hover {
border:1px solid #999
}

.btnC a.disable {
cursor:default;
background:#e6e6e6
}

.btnC a.disable .cover {
position:absolute;
top:0;
left:0;
right:0;
bottom:0;
width:100%;
height:100%;
color:#fff;
text-align:center;
background:rgba(0,0,0,0.5)
}

.btnC a.disable .cover span {
position:absolute;
top:50%;
left:0;
width:100%;
margin-top:-.5rem;
font-size:22px
}

.btnC a p {
width:70%;
margin:0 auto 5px
}

.btnC .fw {
display:none;
position:absolute;
bottom:-64px;
left:138px;
margin:0;
padding:0
}

.btnC a.active+.fw {
display:block
}

.btnC .btnStore {
width:12rem;
margin:2rem auto;
padding:.25em;
border-radius:6px;
text-align:center;
color:#fff;
background-color:#33a5e7
}

.btnC a :last-child {
margin-bottom:0
}

.ca {
padding-top:10px
}

.section.a6 .bnr {
width:860px;
margin:0 auto 20px
}

.listIpBnr {
display:flex;
flex-flow:row wrap;
justify-content:center;
margin:0 auto 10px;
padding:0
}

.listIpBnr li {
flex:0 0 auto;
margin:0 1rem
}

.listIpBnr li img {
width:100%;
height:auto
}

#shop.loading {
background-size:32px auto
}

.listArea {
box-sizing:border-box;
display:table;
width:100%;
border-radius:6px;
margin-bottom:.5rem;
padding:0;
font-size:1.6rem
}

.listArea li {
display:table-cell;
border-right:1px solid #f0f0f0
}

.listArea li:last-child {
border-right:none
}

.listArea li a {
display:block;
text-align:center;
border-radius:3px 3px 0 0;
margin:.25em 0 0;
padding:.5em 0;
border-bottom:4px solid #fff;
text-decoration:none
}

.listArea li a.active {
border-bottom-color:#c00
}

.listArea li span:last-child {
font-size:1.2rem
}

.listAreaSP {
display:none;
margin-bottom:.25rem
}

.agreement {
margin-bottom:2rem;
padding:1rem;
font-size: 1.6rem;
border:1px solid #f0f0f0;
background-color:#fafafa
}

.agreement p:last-child {
margin-bottom:0
}

#shop {
min-height:80rem
}

.shop {
position:relative;
margin-bottom:1.5rem;
padding:1rem .25rem;
font-size:1.5rem;
transition:opacity .25s ease-out;
opacity:1
}

.shop.hidden {
opacity:0
}

.shop:hover {
background:#f9f9f9
}

.shop h2 {
line-height:1;
margin:0 0 .25rem;
padding:0;
font-size:2.6rem;
font-weight:400
}

.shop .btns {
margin:0;
padding:0;
font-size:1.5rem
}

.shop .btns a {
display:block;
text-decoration:none;
text-align:center;
margin:0;
padding: 1em;
box-shadow: 0px 0px 5px #999999;
border-radius:10px;
color:#fff;
background-color:#33a5e7;
transition:background-color .5s
}

.shop .btns a:hover {
background-color:#5abdf6;
}

.shop .detail {
width:70%;
margin:0;
padding:0;
font-size:16px
}

.detail p {
margin:0;
padding:.25em;
border-bottom:1px dotted #f0f0f0;
color:#666
}

.detail .label {
margin-right:1em;
font-size:14px
}

a.btnMap:visited,a.btnMap:link,a.btnTel:visited,a.btnTel:link {
text-decoration:none;
color:#333;
margin-left:.5em
}

.shop .btnTel {
display:none
}

.acSet {
box-sizing:border-box;
position:relative;
display:block;
width:atuo;
margin:0 5px 1rem;
padding:0
}

.acq {
box-sizing:border-box;
width:100%;
border:1px solid #f0f0f0;
border-radius:2px;
margin-bottom:0;
padding:.5rem;
font-size:1.8rem
}

.acq .btnSearch {
display:inline-block;
width:5%;
text-align:center
}

.acq .ico.icoSearch {
display:inline-block;
width:25px;
height:25px;
margin:0 auto;
background-size:auto 25px
}

#q {
-webkit-appearance:none;
-moz-appearance:none;
appearance:none;
box-sizing:border-box;
display:inline-block;
width:95%;
margin-left:auto;
margin-right:auto;
padding:0 0 0 .5rem;
border:none;
outline:none
}

#q::-ms-clear {
color:transparent;
content:'';
width:25px;
height:25px;
background:url(/service/ip/images/ico_s.png) no-repeat -25px 0;
background-size:auto 25px
}

#q::-webkit-search-cancel-button {
-webkit-appearance:none;
width:25px;
height:25px;
background:url(/service/ip/images/ico_s.png) no-repeat -25px 0;
background-size:auto 25px
}

.acq.focus {
outline:2px solid #5abdf6
}

.acq input,.acq span {
vertical-align:middle
}

.control .ui-autocomplete.ui-corner-all {
overflow:auto;
overflow-y:auto;
overflow-x:hidden;
box-sizing:border-box;
max-height:180px;
border-radius:0;
box-shadow:0 1px 4px #ccc;
font-family:"ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","メイリオ",Meiryo,Osaka,"ＭＳ Ｐゴシック","MS PGothic",sans-serif
}

.ui-menu-item {
z-index:100
}

.ui-menu .ui-menu-item a {
display:block;
width:100%;
box-sizing:border-box;
border-radius:0;
border:none;
margin:0;
padding:2px
}

.ui-menu-item .label,.ui-menu-item .address {
display:block;
overflow:hidden;
width:100%;
text-overflow:ellipsis;
white-space:nowrap
}

.ui-menu-item .label {
font-size:1.5rem
}

.ui-menu-item .address {
font-size:1.3rem;
color:#787878
}

.ui-menu .ui-menu-item a.ui-state-focus {
border-radius:0;
border:none;
color:#fff;
margin:0;
background:#33a5e7
}

.ui-menu .ui-menu-item a.ui-state-focus .address {
color:#fff
}

.status {
min-height:2rem;
margin:0 0 .5rem;
font-size:1.6rem
}

.control {
width:100%;
min-height:5rem
}

.holder {
z-index:100;
width:100%;
background-color:rgba(255,255,255,0.95)
}

.control.fixed {
position:relative
}

.control.fixed .holder {
position:fixed;
top:0;
min-height:11rem
}

.focusing #wHeader,.focusing .control.fixed .holder {
position:static
}

.listArea,.listArea li a {
transition:all .25s ease
}

.control.fixed .listArea {
margin-bottom:.125rem
}

.control.fixed .listArea li a {
margin:0;
padding:.125rem 0
}

.ico {
display:inline-block;
width:25px;
height:25px;
background:url(/service/ip/images/ico_s.png) no-repeat 0 0;
background-size:auto 100%
}

#table {
width:100%;
border-collapse:collapse;
font-size:1.5em
}

#table th,td {
padding:10px 15px;
border:1px solid #ddd
}

#table th {
width:15%;
text-align:left
}

#table th.title {
background:#f4f4f4;
width:100%;
text-align:center
}

@media screen and (max-width: 767px) {
h1 {
text-align:left
}

h2 {
background: #e0e0e0;
color: #3d3333;
}

.section>h2 {
text-align:left;
background-color:#fff;
color:#3d3333
}

.multi {
font-size:1em;
padding:.5em .25em .3em;
}

.section>p {
text-align:left;
font-size:1em;
margin-bottom:2rem
}

.btnC a h2 {
font-size:1.8rem;
background:none
}

.btnC a p {
font-size:1.1rem;
width:98%
}

.btnC .btnStore {
margin-top:1rem;
width:auto
}

.section.a6 .bnr {
box-sizing:border-box;
width:100%;
margin:0 auto 10px;
padding:0 10px
}

.section.a6 .bnr img {
width:100%;
height:auto
}

.listIpBnr {
box-sizing:border-box;
width:100%;
margin:0 auto 10px;
padding:0 10px
}

.listIpBnr li {
text-align:center;
float:none;
width:100%;
margin:0 auto 10px;
padding:0
}

.listIpBnr li img {
width:100%;
height:auto
}

.listArea {
display:none
}

.listAreaSP {
display:block;
width:80%;
margin:0 auto;
padding: 1em;
border-radius: 6px;
}

.shop {
margin-bottom:.5rem
}

.shop h2 {
padding:.25em
}

.shop .btns {
width:80%;
margin:1rem auto
}

.shop .detail {
width:100%
}

.detail .label {
display:block
}

.shop .btnMap,.shop .btnTel {
display:inline-block
}

.status {
font-size:1.4rem;
text-align:center
}

.control,.control.fixed .holder {
min-height:7rem
}

.control.fixed .holder {
width:100%;
margin-top:6.2rem
}

.control.fixed .holder .listAreaSP {
display:none
}

.acq {
margin-bottom:0;
font-size:1.6rem
}

.ui-menu-item .label {
font-size:1.3rem
}

.ui-menu-item .address {
font-size:1.1rem;
color:#666
}

#q {
box-sizing:border-box;
width:90%
}

.acq .btnSearch {
width:10%
}

.ui-autocomplete.ui-corner-all {
width:80%
}

#table {
font-size:1em
}
}

@media screen and (min-width: 768px) {
.shop .btns {
position:absolute;
top:50%;
left:75%;
-webkit-transform:translateY(-50%);
transform:translateY(-50%);
width:220px;
margin:0;
padding:0
}

.control {
min-height:12.5rem
}

.control:not(.fixed) {
margin-bottom:3rem
}

.fixed .holder {
width:950px
}

.acSet {
width:70%;
margin-left:0
}

.acq {
border-width:3px
}
}

@media only screen and (max-width:479px) {
#table th,td {
width:auto;
display:block;
border-top:none;
text-align:center
}

#table tr:first-child {
border-top:1px solid #d5d5d5
}
}

.flexbox {
display: flex;
}

.flexbox div:first-child {
margin-right: 30px;
margin-bottom: 30px;
}

.field {
width: 360px;
display: flex;
justify-content: center;
margin: 0 auto;
margin-bottom: 28px;
}

.field .card img {
width: 90%;
}

@media screen and (max-width: 768px){
.flexbox {
margin: 0 10px 10px;
}
.flexbox div:first-child {
margin-right: 10px;
}
.field {
width: 300px;
}

.field .card img {
width: 90%;
}

}