@charset "utf-8";
/* CSS Document */

.online{padding-bottom:20px;background:#FCF3DA;}
.shop-buying{padding-bottom:20px;background:#cce9ed;}
.phone-call{padding-bottom:20px;background:#FAF4F8;}
.online h2,
section > div.online > div >div:nth-of-type(2) p:nth-of-type(2)
{background:#E7C34E;}
.shop-buying h2,
section > div.shop-buying > div >div:nth-of-type(2) p:nth-of-type(2)
{background:#3fb9c3;}
.phone-call h2,
section > div.phone-call > div >div:nth-of-type(1) p:nth-of-type(3){
background:#BD9DC8;}

nav ul {
    justify-content: center;
}
@media screen and (max-width:480px) {

section.local_top_pd > div:nth-of-type(3){
	margin:0 auto 3vw auto;
}
section.local_top_pd > div:nth-of-type(3) a{
	margin-bottom:5vw;
}
h2{
	width:100%;height:9.3vw;
	font-size:5.1vw !important;line-height:9.3vw !important;margin:0 0 4vw 0 !important;
	color:#fff;
}
h3{
	text-align:left !important;
	font-size:5vw !important;margin:-0.75vw 0 6.5vw 0 !important;line-height:6.5vw !important;letter-spacing:-0.3vw;
}
.phone-call .box-03 h3{
	margin:0.75vw 0 !important;
}
section > div > div >div{
	margin:8vw auto 5vw auto;
	background:#fff;width:85vw;
	padding:8vw 2.5vw;
	text-align:left;position:relative;
}
section > div > div >div:nth-of-type(1) p:nth-of-type(1){
	font-size:5vw;line-height:1em;margin:0 0 8vw 0;
	font-weight:600;
}
section > div > div >div:nth-of-type(1) p:nth-of-type(1) span{
	font-size:4vw;font-weight:normal;
}
section > div > div >div:nth-of-type(1) a{
	margin:8vw auto 0 2.9vw !important;
}
section > div > div >div:nth-of-type(2) p:nth-of-type(2){
	line-height:1em;margin:8vw 0 3.1vw 0;font-size:3.2vw;
	width:27vw;height:5vw;line-height:5vw;text-align:center;
}
section > div > div >div:nth-of-type(2) div{
	position:absolute;height:auto;
}
section > div.online > div >div:nth-of-type(2) div{
	width:45vw;bottom:8vw;right:2.5vw;
}
section > div.phone-call > div >div:nth-of-type(2) div{
	width:25vw;bottom:8vw;right:15.6vw;
}
section > div.online > div >div:nth-of-type(2) p:nth-of-type(3){
	margin-bottom:7.7vw;
}
section > div.phone-call > div >div:nth-of-type(2) p:nth-of-type(3){
	margin-bottom:4.3vw;
}
section > div.phone-call > div >div:nth-of-type(1) p:nth-of-type(3){
	line-height:1em;margin:8vw 0 3.1vw 0;font-size:3.2vw;
	width:27vw;height:5vw;line-height:5vw;text-align:center;
}

nav ul, .ver2022 nav ul li {
    list-style: none;
    margin: 0;
    padding: 0;
}
nav ul {
    display: flex;
    margin-bottom: 12.3vw;
    align-items: center;
    justify-content: space-between;
    margin:0 auto;
    width:90%;
}
nav ul li {
    width: 28vw;
    font-size: 3vw;
}
nav ul li a {
    display: block;
    border: #221714 solid 0.3vw !important;
    width: 28vw !important;
    font-size: 3.5vw !important;
    border-radius: unset!important;
}
.htb_01{
margin-bottom:10vw !important;
}
.htb_02{
margin-top:8vw !important;
}

}

@media screen and (min-width:481px) {
@media screen and (max-width:1100px) {

/*calc(100vw * calc(0 / 1100))による再計算*/
section.local_top_pd > div:nth-of-type(3){
	width:calc(100vw * calc(1050 / 1100));margin:0 auto calc(100vw * calc(40 / 1100)) auto;overflow:hidden;
}
h2{
	width:100%;height:calc(100vw * calc(50 / 1100));
	font-size:calc(100vw * calc(21 / 1100)) !important;line-height:calc(100vw * calc(50 / 1100)) !important;margin:0 0 calc(100vw * calc(20 / 1100)) 0 !important;
	color:#fff;
}
h3{
	text-align:left !important;
	font-size:calc(100vw * calc(21 / 1100)) !important;margin:calc(100vw * calc(-7 / 1100)) 0 calc(100vw * calc(33 / 1100)) 0 !important;line-height:calc(100vw * calc(35 / 1100)) !important;
}
.phone-call .box-03 h3{
	margin:calc(100vw * calc(-7 / 1100)) 0 !important;
}
section > div > div >div{
	margin:calc(100vw * calc(40 / 1100)) auto calc(100vw * calc(20 / 1100)) auto;
	background:#fff;width:calc(100vw * calc(800 / 1100));
	padding:calc(100vw * calc(40 / 1100)) calc(100vw * calc(90 / 1100));
	text-align:left;position:relative;
}
section > div > div >div:nth-of-type(1) p:nth-of-type(1){
	font-size:calc(100vw * calc(21 / 1100));line-height:1em;margin:0 0 calc(100vw * calc(40 / 1100)) 0;
	font-weight:600;
}
section > div > div >div:nth-of-type(1) p:nth-of-type(1) span{
	font-size:calc(100vw * calc(15 / 1100));font-weight:normal;
}
section > div > div >div:nth-of-type(1) a{
	margin:calc(100vw * calc(40 / 1100)) 0 0 0 !important;
}
section .htb_01{
	font-size:calc(100vw * calc(21 / 1100));margin:calc(100vw * calc(40 / 1100)) 0 calc(100vw * calc(18 / 1100)) 0;
	width:calc(100vw * calc(160 / 1100));height:calc(100vw * calc(40 / 1100));line-height:calc(100vw * calc(40 / 1100));text-align:center;
}
section > div > div >div:nth-of-type(2) div{
	position:absolute;height:auto;
}
section > div.online > div >div:nth-of-type(2) div{
	width:calc(100vw * calc(300 / 1100));bottom:calc(100vw * calc(40 / 1100));right:calc(100vw * calc(90 / 1100));
}
section > div.phone-call > div >div:nth-of-type(2) div{
	width:calc(100vw * calc(160 / 1100));bottom:calc(100vw * calc(40 / 1100));right:calc(100vw * calc(176 / 1100));
}
section > div.online > div >div:nth-of-type(2) p:nth-of-type(3){
	margin-bottom:calc(100vw * calc(10 / 1100));font-size:calc(100vw * calc(21 / 1100));
}
section > div.phone-call > div >div:nth-of-type(2) p:nth-of-type(3){
	margin-bottom:calc(100vw * calc(50 / 1100));font-size:calc(100vw * calc(21 / 1100));
}

nav ul {
    display: flex;
}
nav ul,nav ul li {
    list-style: none;
    margin: 0;
    padding: 0;
}
nav ul li {
    width: calc(100vw * calc(310 / 1100));
    font-size: calc(100vw * calc(12 / 1100));
}
nav ul li a.htbtop {
    border: #221714 solid calc(100vw * calc(1 / 1100)) !important;
    width: calc(100vw * calc(270 / 1100)) !important;
    height:calc(100vw * calc(28 / 1100)) !important;
}
.htb_01{
margin-bottom:calc(100vw * calc(45 / 1100)) !important;
}
.htb_02{
margin-top:calc(100vw * calc(27 / 1100)) !important;
}

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

section.local_top_pd > div:nth-of-type(3){
	width:1100px;margin:0 auto 40px auto;
}
h2{
	width:100%;height:50px;
	font-size:21px !important;line-height:50px !important;margin:0 0 20px 0 !important;
	color:#fff;
}
h3{
	text-align:left !important;
	font-size:21px !important;margin:-7px 0 33px 0 !important;line-height:35px !important;
}
.phone-call .box-03 h3{
	margin:-7px 0 !important;
}
section > div > div >div{
	margin:40px auto 20px auto;
	background:#fff;width:800px;
	padding:40px 90px;
	text-align:left;position:relative;
}
section > div > div >div:nth-of-type(1) p:nth-of-type(1){
	font-size:21px;line-height:1em;margin:0 0 40px 0;
	font-weight:600;
}
section > div > div >div:nth-of-type(1) p:nth-of-type(1) span{
	font-size:15px;font-weight:normal;
}
section > div > div >div:nth-of-type(1) a{
	margin:40px 0 0 0 !important;
}
section > div > div >div:nth-of-type(2) p:nth-of-type(2){
	font-size:21px;margin:40px 0 18px 0;
	width:160px;height:40px;line-height:40px;text-align:center;
}
section > div > div > div:nth-of-type(2) div{
	position:absolute;height:auto;
}
section > div.online > div >div:nth-of-type(2) div{
	width:300px;bottom:40px;right:90px;
}
section > div.online > div >div:nth-of-type(2) p:nth-of-type(3){
	font-size:21px;margin-bottom:10px;
}
section > div.phone-call > div >div:nth-of-type(2) p:nth-of-type(3){
	font-size:21px;margin-bottom:50px;
}
section > div.phone-call > div >div:nth-of-type(2) div{
	width:160px;bottom:40px;right:176px;
}
section > div.phone-call > div >div:nth-of-type(1) p:nth-of-type(3){
	font-size:21px;margin:40px 0 18px 0;
	width:160px;height:40px;line-height:40px;text-align:center;
}

nav ul {
    display: flex;
}
nav ul,nav ul li {
    list-style: none;
    margin: 0;
    padding: 0;
}
nav ul li {
    width: 310px;
    font-size: 12px;
}
nav ul li a.htbtop {
    border: #221714 solid 1px !important;
    font-size: 15px !important;
    width: 270px !important;
    height:28px !important;
}
.htb_01{
margin-bottom:45px !important;
}
.htb_02{
margin-top:27px !important;
}
img{
margin-bottom:10px;
}
}