@charset "UTF-8";

*,html	{font-family: 'Noto Serif JP', serif;font-size: 16px;line-height: 180%;box-sizing: border-box}

body	{color: #333;text-align: center;letter-spacing:0.05em;word-break: break-all;overflow: hidden;overflow-y:scroll;background: url(../image/paper.png)}

img	{width: 100%;height: auto;line-height: 0}
a:hover	{opacity: 0.5;transition: all 0.5s;}
p	{margin-bottom: 1em}
p.none	{margin-bottom: 0}
small,.small{font-size: 0.8rem}

/*数字リスト*/
ul.decimal	{margin: 0 0 0.5em 1.2em;list-style-type: decimal}
ul.decimal:last-child	{margin: 0 0 0 1.2em;}
/*・リスト*/
ul.disc    {margin:0;list-style-type:none;font-size:100%;}
ul.disc    li{margin-left:0;text-indent:-1em;padding-left:1em;line-height:150%;}
ul.disc    li:before{content:"・"}
/*米印リスト*/
ul.kome{margin:0;list-style-type:none;font-size:100%}
ul.kome li{margin-left:-1em;text-indent:-1em;padding-left:2em;line-height:150%}
ul.kome li:before{content:"※"}
/*○リスト*/
ul.maru    {margin:0;list-style-type:none;font-size:100%;}
ul.maru    li{margin-left:0;text-indent:-1em;padding-left:1em;line-height:150%;}
ul.maru    li:before{content:"○"}


/*改行*/
.pconly{display:inline}
.w48,.w64,.w768,.w980,.w1200{display:none}
@media screen and (max-width:1100px){.pconly{display:none}}
@media screen and (max-width:1200px){.w1200{display:inline}}
@media screen and (max-width:980px){.w980{display:inline}}
@media screen and (max-width:768px){.w768{display:inline}}
@media screen and (max-width:640px){.w64{display:inline}.w64none{display:none}}
@media screen and (max-width:480px){.w48{display:inline}}

	/*
　WRAP / PADDING
---------------------------*/

.cwrap	{max-width: 1200px;margin: 0 auto;text-align: left;}
@media only screen and (max-width: 1200px) {.cwrap	{max-width: auto;margin: 0 3%;}}
@media only screen and (max-width: 768px) {.cwrap	{max-width: auto;margin: 0 5%;}}

.cpadding {padding: 50px 0;}
@media only screen and (max-width: 768px) {.cpadding {padding: 40px 0;}}


:root {
--head-height: 100px;/*ヘッダのメニューの高さ*/
--head-height2: -100px;/*ヘッダのメニューの高さ調整分*/

--head-height-sp: 70px;/*ヘッダのメニューの高さ*/
--head-height2-sp: -70px;/*ヘッダのメニューの高さ調整分*/

--color-01: #b83c34;
--color-02: #e14d0d;

}



/*---------------------------
　HEADER
---------------------------*/

#header	{height: var(--head-height);z-index:20000}

#header	{position: fixed;top: 0;left: 0;display:flex;justify-content: center;align-items: center;width: 100%;background: url(../image/paper2.png);box-shadow: 0 2px 2px rgba(0,0,0,0.05);}

.head-inner	{max-width: 1200px;width: 100%;margin: 0 auto}
.head-inner	{display:flex;align-items: center;}

#header	.head-logo{width: 280px;flex-basis: 280px;;}

.head-info	{flex-basis: calc(100% - 440px);padding: 10px;color: var(--color-01);text-align: right;}
.head-info,.head-info	a	{text-decoration: none;}

.head-tel-wrap	{display: block;margin-bottom: 10px;}
.head-tel	{margin-left: 10px;color: var(--color-01);font-size: 1.3rem}
a.head-tel-num	{color: var(--color-01);font-family: 'Oswald', sans-serif;font-size: 2rem}
.head-uketuke	{color: #333}

@media only screen and (max-width: 980px) {
.head-inner	{width: 96%;margin: 0 2%}

.head-tel	{display: block;margin-left: 0;font-size: 1rem}
.head-uketuke	{font-size: 0.8rem}
}

@media only screen and (max-width: 768px) {
#header	{height: var(--head-height-sp);}
#header	.head-logo{flex-basis: 175px;width: 175px;margin-top: 5px;}
.head-info	{display: none}
}


/*━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
　ヘッダ　タップで表示されるのお知らせ
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━*/
.for-sp-information	{display: none}
.for-pc-information	{width: 160px;flex-basis: 160px;}
.dialog-inner {
padding: 25px;border: none;
}


@media only screen and (max-width: 768px) {
.for-pc-information	{display: none}
.for-sp-information	{display: inline-block}
.for-sp-information	{position: fixed;top: 15px;right: 10px;z-index: 20000}
.dialog-inner {
padding: 10px 0 10px;border: none;
}
}

dialog {
width: 90%;
background: #fff;
border-radius: 10px;
color: #333;
opacity: 0;
transition: opacity .5s ease-in-out;border: none;

&::backdrop {
background: rgba(0, 0, 0, 0);
transition: background .3s ease-in-out;
}

&.show {
opacity: 1;
&::backdrop {
background: rgba(0, 0, 0, 0.7);
}
}

}

button.dialog-open {
background: var(--color-01);
color: #fff;
cursor: pointer;
font-size: 0.9rem;
padding: 9px 10px;
border: none;
&:hover {
background: #333;
color: #fff;
}
}

button.dialog-close {
background: var(--color-01);
color: #fff;
cursor: pointer;
font-size: 0.9rem;
margin-top: 20px;
padding: 2px 10px;
border: none;
&:hover {
background: #333;
color: #fff;
}
&:focus {
border: none;outline: none;
}
}


.dialog-inner	ul{margin-bottom: 0.3em;padding-bottom: 0.4em;text-align: left;border-bottom: 1px solid rgba(0,0,0,0.35);box-sizing: border-box}
.dialog-inner	ul.last{border: none;}
.dialog-inner	li{display: flex;flex-wrap: wrap}
.dialog-inner	.item,.dialog-inner	.text{display: block;}
.dialog-inner	.item	{flex-basis: 100px;font-size: 0.8rem;color: var(--color-01)}
.dialog-inner	.text	{flex-basis: calc(100% - 100px);font-size: 1.0rem;}


.dialog-inner	.text	small{display: block;margin-top: 0.5em;font-size: 0.75rem;line-height: 1.5em}
.dialog-inner	.text	small.teikyubi{display: inline-block;margin-left: 1em;}

@media only screen and (max-width: 768px) {
.dialog-inner	li{display: list-item}
}

/**--MAIN--------------------*/

#maincontents	{padding-top: var(--head-height);}
.adjustment {padding-top:  var(--head-height);margin-top:  var(--head-height2);}
#main	{position: relative;}

@media only screen and (max-width: 768px) {
#maincontents	{padding-top: var(--head-height-sp);}
}

/*---------------------------
　FOOTER
---------------------------*/

#footer	{background: url(../image/footer_paper.png);}
#footer,#footer	a	{color: #fff;text-decoration: none}
.footer-inner-wrap	{padding: 0 0 30px 0}

.footer-link	{padding: 20px 0;margin-bottom: 30px;background: var(--color-01)}
.footer-link	a{display: block;text-decoration: none}
.footer-link-inner	{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack: center;-ms-flex-pack: center;justify-content: center;}
.footer-link-list	{display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-pack: distribute;justify-content: space-around;width: 100%;}

.footer-info	{padding: 20px 0;text-align: center}

.footer-info-name	{width: 300px;margin: 0 auto}


.footer-info-list	{margin-top: 20px;}
.footer-info-list	li{padding: 0.5em 0;}



.footer-adress	{line-height: 1.6em;}
.footer-telnum	{}
.footer-telnum	a{font-size: 30px;font-family: 'Oswald', sans-serif;font-weight: 400}
.footer-telnum	a:hover{opacity: 1}

.footer-tel	{margin-right: 20px}
.footer-fax	{}


.footer-infomation-list-block	{display:flex;justify-content: center;align-items: center;}
.footer-infomation-list	{width: 660px;}
.footer-infomation-list	li{display: flex;flex-wrap: wrap;}
.footer-infomation-list	li	.item,.footer-infomation-list	li	.text{display: block;text-align: left;}
.footer-infomation-list	li	.item	{flex-basis: 80px;font-size: 0.8rem;}
.footer-infomation-list	li	.text	{flex-basis: calc(100% - 80px);font-size: 1.0rem;}

.footer-infomation-list	li		.text	small{display: block;margin-top: 0.5em;font-size: 0.75rem;line-height: 1.5em}
.footer-infomation-list	li	small.teikyubi{display: inline-block;margin-left: 1em;}

.footer-mail	{}


#copiright	{padding: 25px 10px;font-size: 0.8rem;border-top: 1px solid #666;}

@media screen and (max-width:980px){
.footer-link-list	{display:block}
.footer-link	a{padding: 0.5em 0}
}

@media screen and (max-width:768px){
.footer-infomation-list	{width: 92%;margin: 4% 4% 0 4%}
.footer-infomation-list	li	.item,
.footer-infomation-list	li	.text	{flex-basis: 100%;}
.footer-infomation-list	li	.item	{margin-bottom: 0.3em;;}
.footer-infomation-list	li	.text	{line-height: 1.5em;}
}

@media screen and (max-width: 640px){
.footer-tel	{margin: 0 0 10px 0}
.footer-tel,
.footer-fax	{display: block;}
}

	/*Google map*/

.ggmap	{position:relative;display: block;width:100%;height: 350px;}
.ggmap iframe{position:absolute;top:0; right:0;width:100%;height:350px}


/*---------------------------
.footter-fix-info
---------------------------*/
.footer-fix-info	{display: none}

@media only screen and (max-width: 768px) {
.footer-fix-info	{position: fixed;bottom: 0;left: 0;right: 0;height: 70px;padding-top: 7px;background: var(--color-01);display: block;}
.footer-fix-info,.footer-fix-info	a	{color: #fff;text-decoration: none;}

.footer-fix-tel-wrap	{margin-bottom: 10px}
.footer-fix-tel	{margin-left: 10px;}

a.footer-fix-tel-num		{font-family: 'Oswald', sans-serif;font-size: 1.7rem}
.footer-fix-uketuke	{}
}

/*---------------------------
　PAGETOP
---------------------------*/

.pagetop{position: fixed;display: block;bottom: 0; right: 0;margin: 0;text-align: right;z-index: 1000;}
.pagetop    a{display: block;background: rgba(0,0,0,0.53); color: #fff;width: 40px;height: 40px;line-height: 38px;text-align: center;font-size: 180%;}
.pagetop    a:hover    {background: #2a73a1;color: #fff;}

@media screen and (max-width:768px){
.pagetop{bottom: 70px;}
.pagetop    a{width: 40px;}
.pagetop    span{display: none}
.pagetop    a   i{margin-right:0;}
}