@font-face {
font-display: swap;
font-family: 'Noto Sans JP';
font-style: normal;
font-weight: 400;
src: url(//kato-sakan.com/wp/wp-content/themes/katosakan/fonts/noto-sans-jp-v52-japanese-regular.woff2) format('woff2');
} @font-face {
font-display: swap;
font-family: 'Noto Sans JP';
font-style: normal;
font-weight: 600;
src: url(//kato-sakan.com/wp/wp-content/themes/katosakan/fonts/noto-sans-jp-v52-japanese-600.woff2) format('woff2');
} @font-face {
font-display: swap;
font-family: 'Shippori Mincho';
font-style: normal;
font-weight: 400;
src: url(//kato-sakan.com/wp/wp-content/themes/katosakan/fonts/shippori-mincho-v15-latin-regular.woff2) format('woff2');
} @font-face {
font-display: swap;
font-family: 'Shippori Mincho';
font-style: normal;
font-weight: 600;
src: url(//kato-sakan.com/wp/wp-content/themes/katosakan/fonts/shippori-mincho-v15-latin-600.woff2) format('woff2');
} @font-face {
font-display: swap;
font-family: 'Oooh Baby';
font-style: normal;
font-weight: 400;
src: url(//kato-sakan.com/wp/wp-content/themes/katosakan/fonts/oooh-baby-v4-latin-regular.woff2) format('woff2');
} body {
font-family: 'Noto Sans JP', 'Avenir', 'Helvetica Neue', 'Helvetica', 'Hiragino Sans', 'Meiryo', 'Hiragino Kaku Gothic ProN', sans-serif;
letter-spacing: 1px;
} .mincho {
font-family: 'Shippori Mincho', "Times New Roman", "YuMincho", "Hiragino Mincho ProN", "Yu Mincho", "MS PMincho", serif;
}
.hw {
font-family: 'Oooh Baby', serif !important;
}
.vertical {
writing-mode: vertical-rl;
text-orientation: upright;
}
.minchov {
font-family: 'Shippori Mincho', "Times New Roman", "YuMincho", "Hiragino Mincho ProN", "Yu Mincho", "MS PMincho", serif;
writing-mode: vertical-rl;
text-orientation: upright;
}
@media all and (max-width:768px) {
.minchov {
height: 40vh;
}
}
@font-face {
font-family: number;
src: local('Century Gothic');
unicode-range: U+0030-0039;
}
.num {
font-family: number;
} .elementor-button-link {
background: url(//kato-sakan.com/wp/wp-content/themes/katosakan/images/arrow_right.png) no-repeat right 20px center;
background-size: auto 10px;
} table {
border: none;
}
th, td {
padding: 1em 1.5em;
background: var(--ast-global-color-5);
border-right: none;
}
th {
width: 20%;
border-bottom: 1px solid var(--ast-global-color-6);
text-align: left;
}
td {
border-bottom: 1px dotted var(--ast-global-color-6);
}
@media all and (max-width:768px) {
th, td {
padding: 0.75em;
}
th {
width: 30%;
}
}  #primary-site-navigation-desktop ul {
padding: 0 25px;
font-weight: bold;
letter-spacing: 3px; & li:first-child, li:nth-of-type(6), li:nth-of-type(7) {
display: none;
}
}
#primary-site-navigation-desktop ul li:first-child, #primary-site-navigation-desktop ul li:nth-of-type(6), #primary-site-navigation-desktop ul li:nth-of-type(7) {
display: none;
}
#primary-site-navigation-desktop ul li {
margin-bottom: 15px;
}
#primary-site-navigation-desktop ul li a {
display: block;
border-radius: 8px;
text-align: center;
}
#primary-site-navigation-desktop ul li a span {
display: block;
margin-top: 5px;
font-size: 12px;
color: var(--ast-global-color-6);
} #offcanvas_nav ul { }  .openbtn {
position: fixed;
z-index: 9999; top: 0;
right: 0;
cursor: pointer;
width: 90px;
height: 90px;
background: var(--ast-global-color-0);
} .openbtn span {
display: inline-block;
transition: all .4s; position: absolute;
left: 20px;
height: 3px;
background-color: var(--ast-global-color-5);
}
.openbtn span:nth-of-type(1) {
top: 39px;
width: 50%;
}
.openbtn span:nth-of-type(2) {
top: 50px;
width: 30%;
} .openbtn.active span:nth-of-type(1) {
top: 40px;
left: 23px;
transform: translateY(6px) rotate(-45deg);
width: 50%;
}
.openbtn.active span:nth-of-type(2) {
top: 52px;
left: 23px;
transform: translateY(-6px) rotate(45deg);
width: 50%;
}
@media screen and (max-width: 834px) {
.openbtn {
width: 65px;
height: 65px;
}
.openbtn span {
left: 15px;
}
.openbtn span:nth-of-type(1) {
top: 26px;
}
.openbtn span:nth-of-type(2) {
top: 37px;
}
.openbtn.active span:nth-of-type(1) {
top: 24px;
left: 16px;
}
.openbtn.active span:nth-of-type(2) {
top: 36px;
left: 16px;
}
} #g-nav {
position: fixed;
z-index: -1;
opacity: 0;  top: 0; transition: all 0.3s;
} #g-nav.panelactive {
opacity: 1;
width: 100vw;
height: 100vh; background: var(--ast-global-color-1);
background-size: cover;
z-index: 999;
color: var(--ast-global-color-6);
}
#g-nav #g-nav-list {
display: none;
} #g-nav.panelactive #g-nav-list { display: block;
position: fixed;
z-index: 999;
width: 100vw;
height: 100vh; overflow: auto;
-webkit-overflow-scrolling: touch;
padding: 5%;
} #g-nav.panelactive div.g-nav-group {
width: 300px;
margin: 50px auto;
}
#g-nav.panelactive ul {
margin: 0;
padding: 0;
list-style-type: none;
}
#g-nav.panelactive .g-nav-group ul.menu li {
margin: 0;
padding: 0;
}
#g-nav.panelactive .g-nav-group ul.menu a {
padding: 0.75em 0;
font-size: 16px;
line-height: 1;
}
#g-nav.panelactive ul a {
display: block;
color: var(--ast-global-color-6);
text-align: center;
}
#g-nav.panelactive .mobile_menu_title, #g-nav.panelactive aside {
margin: 0 auto;
text-align: center;
}
#g-nav.panelactive .mobile_menu_title img {
max-width: 150px;
}
#g-nav.panelactive address {
margin-top: 30px;
font-size: 14px;
letter-spacing: 1px;
line-height: 1.3;
font-style: normal;
}
#g-nav.panelactive aside .btn_tel {
display: inline-block;
padding: 15px 60px 15px 30px;
background: var(--ast-global-color-4) url(//kato-sakan.com/wp/wp-content/themes/katosakan/images/arw_right.png) no-repeat right 30px bottom 50%;
border-radius: 8px;
color: var(--ast-global-color-2);
font-size: 24px;
line-height: 36px;
}
#g-nav.panelactive aside .btn_tel:hover {
background: var(--ast-global-color-0) url(//kato-sakan.com/wp/wp-content/themes/katosakan/images/arw_right_w.png) no-repeat right 20px bottom 50%;
color: var(--ast-global-color-5);
}
@media screen and (min-width: 769px) {
.mobile_menu_bnr {
display: flex;
justify-content: center;
align-items: center;
width: 100%;
margin: 0;
padding: 0;
}
.mobile_menu_bnr li {
width: 50%;
max-width: 360px;
}
}
@media screen and (max-width: 768px) {
#g-nav.panelactive #g-nav-list {
padding: 50px 0;
}
#g-nav.panelactive ul {
margin: 0;
padding: 0;
}
#g-nav.panelactive div.g-nav-group {
display: block;
margin: 30px auto;
}
}  dl.footer_tel {
display: flex;
align-items: flex-start;
margin-bottom: 30px;
padding: 15px 30px 10px;
background: var(--ast-global-color-4);
line-height: 36px;
}
dl.footer_tel dt {
margin: 0;
padding: 0 1em 0 0;
font-size: 24px;
font-weight: normal;
}
dl.footer_tel dd {
margin: 0;
font-size: 24px;
}
dl.footer_tel dd .num:first-child {
font-size: 36px;
}
.footer_contact a {
display: inline-block;
padding: 15px 60px 15px 30px;
background: var(--ast-global-color-4) url(//kato-sakan.com/wp/wp-content/themes/katosakan/images/arw_right.png) no-repeat right 30px bottom 50%;
border-radius: 0;
color: var(--ast-global-color-2);
font-size: 24px;
line-height: 36px;
}
.footer_contact a:hover {
background: var(--ast-global-color-0) url(//kato-sakan.com/wp/wp-content/themes/katosakan/images/arw_right_w.png) no-repeat right 20px bottom 50%;
color: var(--ast-global-color-5);
}
@media all and (max-width:820px) {
footer .site-primary-footer-inner-wrap {
display: block !important;
}
dl.footer_tel {
justify-content: center;
}
}
@media all and (max-width:768px) {
.title_footer_contact img {
width: 50%;
}
dl.footer_tel {
display: block;
padding: 15px 15px 10px;
}
dl.footer_tel dt, dl.footer_tel dd, .footer_contact a {
font-size: 18px;
}
dl.footer_tel dd .num:first-child {
display: block;
font-size: 24px;
}
dl.footer_tel dd::after {
content: "｜";
}
.footer_contact a {
display: block;
padding: 10px 40px 10px 15px;
}
} dl.footer_info {
margin-bottom: 30px;
}
dl.footer_info dt .description {
display: block;
margin-bottom: 7px;
color: var(--ast-global-color-1);
font-size: 10px;
letter-spacing: 2px;
}
dl.footer_info dd {
margin-top: 15px;
font-size: 12px;
letter-spacing: 1px;
}
footer small {
font-size: 9px;
} .ast-single-entry-banner h1::after, .ast-archive-entry-banner h1::after {
display: block;
content: "";
width: 300px;
height: 12px;
margin: 15px auto 0;
mask-position: center bottom;
mask-repeat: no-repeat;
mask-size: contain;
mask-image: url(//kato-sakan.com/wp/wp-content/themes/katosakan/images/line_handwriting.svg);
background: var(--ast-global-color-0);
}
.works_nav .uael-menu-item {
border-radius: 8px;
}  .pageheader {
height: 440px;
}
@media all and (max-width:820px) {
.pageheader { }
}
@media all and (max-width:768px) {
.pageheader {
height: 375px;
}
} .breadcrumbs, .breadcrumbs a { font-size: 11px;
} .business_box {
& .uael-infobox-title {
position: absolute;
top: 25px;
left: 20px;
writing-mode: vertical-rl;
text-orientation: upright;
}
& .uael-image {
text-align: right;
}
& .uael-image-content {
border-radius: 8px;
}
& .uael-infobox-text-wrap {
margin-left: 50px;
}
& .uael-button-wrapper {
text-align: right;
}
} .grecaptcha-badge {
visibility: hidden;
}
.inquiry th {
min-width: 30%;
font-size: 15px;
}
.inquiry td {
font-size: 15px;
}
.inquiry th p, .inquiry td p {
margin: 0 !important;
}
.look {
padding: 20px;
background: #eff4f8;
font-size: 14px;
line-height: 1.3;
} .haveto, .any {
display: inline-block;
margin-left: 5px;
padding: 5px;
border-radius: 2px;
font-size: 12px;
font-weight: 400;
line-height: 1;
} .haveto {
background: var(--ast-global-color-1);
color: var(--ast-global-color-5);
} .any {
background: var(--ast-global-color-0);
color: var(--ast-global-color-5);
} .wpcf7-checkbox {
display: flex;
}
label {
margin: 0 !important;
padding: 0 !important;
}
.inquiry input[type="text"], .inquiry input[type="tel"], .inquiry input[type="email"], textarea {
border: 1px solid var(--ast-global-color-0);
border-radius: 8px;
}
.wpcf7-submit {
min-width: 30%;
margin: 30px auto 15px;
background: var(--ast-global-color-2) url(//kato-sakan.com/wp/wp-content/themes/katosakan/images/arrow_right.png) no-repeat right 20px center !important;
background-size: auto 10px;
text-align: center;
}
.wpcf7-submit:hover {
background: var(--ast-global-color-1) url(//kato-sakan.com/wp/wp-content/themes/katosakan/images/arrow_right.png) no-repeat right 20px center !important;
background-size: auto 10px;
}
@media all and (max-width:768px) {
table.inquiry th, table.inquiry td {
display: block;
width: 100%;
padding-left: 0;
padding-right: 0;
}
table.inquiry th {
background-color: transparent;
border: none;
}
.inquiry input[type="text"], .inquiry input[type="tel"], .inquiry input[type="email"] {
width: 95% !important;
}
.wpcf7-submit {
width: 100%;
}
}