@charset "utf-8";
.drawer-open {
overflow: hidden !important;
}
.drawer-nav {
position: fixed;
z-index: 101;
top: 0;
overflow: hidden;
width: 16.25rem;
height: 100%;
color: #222;
background-color: #fff;
}
.drawer-brand {
font-size: 1.5rem;
font-weight: bold;
line-height: 3.75rem;
display: block;
padding-right: .75rem;
padding-left: .75rem;
text-decoration: none;
color: #222;
}
.drawer-menu {
margin: 0;
padding: 0;
list-style: none;
}
.drawer-menu-item {
font-size: 1rem;
display: block;
padding: .75rem;
text-decoration: none;
color: #222;
}
.drawer-menu-item:hover {
text-decoration: underline;
color: #555;
background-color: transparent;
} .drawer-overlay {
position: fixed;
z-index: 100;
top: 0;
left: 0;
display: none;
width: 100%;
height: 100%;
background-color: rgba(0, 0, 0, .2);
}
.drawer-open .drawer-overlay {
display: block;
} .drawer--top .drawer-nav {
top: -100%;
left: 0;
width: 100%;
height: auto;
max-height: 100%;
-webkit-transition: top .6s cubic-bezier(0.190, 1.000, 0.220, 1.000);
transition: top .6s cubic-bezier(0.190, 1.000, 0.220, 1.000);
}
.drawer--top.drawer-open .drawer-nav {
top: 0;
}
.drawer--top .drawer-hamburger,
.drawer--top.drawer-open .drawer-hamburger {
right: 0;
} .drawer--left .drawer-nav {
left: -16.25rem;
-webkit-transition: left .6s cubic-bezier(0.190, 1.000, 0.220, 1.000);
transition: left .6s cubic-bezier(0.190, 1.000, 0.220, 1.000);
}
.drawer--left.drawer-open .drawer-nav,
.drawer--left .drawer-hamburger,
.drawer--left.drawer-open .drawer-navbar .drawer-hamburger {
left: 0;
}
.drawer--left.drawer-open .drawer-hamburger {
left: 16.25rem;
} .drawer--right .drawer-nav {
right: -16.25rem;
-webkit-transition: right .6s cubic-bezier(0.190, 1.000, 0.220, 1.000);
transition: right .6s cubic-bezier(0.190, 1.000, 0.220, 1.000);
}
.drawer--right.drawer-open .drawer-nav,
.drawer--right .drawer-hamburger,
.drawer--right.drawer-open .drawer-navbar .drawer-hamburger {
right: 0;
}
.drawer--right.drawer-open .drawer-hamburger {
right: 16.25rem;
} .drawer-hamburger {
position: fixed;
z-index: 104;
top: 0;
display: block;
box-sizing: content-box;
width: 2rem;
padding: 0;
padding-top: 18px;
padding-right: .75rem;
padding-bottom: 30px;
padding-left: .75rem;
-webkit-transition: all .6s cubic-bezier(0.190, 1.000, 0.220, 1.000);
transition: all .6s cubic-bezier(0.190, 1.000, 0.220, 1.000);
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
border: 0;
outline: 0;
background-color: transparent;
}
.drawer-hamburger:hover {
cursor: pointer;
background-color: transparent;
}
.drawer-hamburger-icon {
position: relative;
display: block;
margin-top: 10px;
}
.drawer-hamburger-icon,
.drawer-hamburger-icon:before,
.drawer-hamburger-icon:after {
width: 100%;
height: 2px;
-webkit-transition: all .6s cubic-bezier(0.190, 1.000, 0.220, 1.000);
transition: all .6s cubic-bezier(0.190, 1.000, 0.220, 1.000);
background-color: #222;
}
.drawer-hamburger-icon:before,
.drawer-hamburger-icon:after {
position: absolute;
top: -10px;
left: 0;
content: ' ';
}
.drawer-hamburger-icon:after {
top: 10px;
}
.drawer-open .drawer-hamburger-icon {
background-color: transparent;
}
.drawer-open .drawer-hamburger-icon:before,
.drawer-open .drawer-hamburger-icon:after {
top: 0;
}
.drawer-open .drawer-hamburger-icon:before {
-webkit-transform: rotate(45deg);
transform: rotate(45deg);
}
.drawer-open .drawer-hamburger-icon:after {
-webkit-transform: rotate(-45deg);
transform: rotate(-45deg);
}  .sr-only {
position: absolute;
overflow: hidden;
clip: rect(0, 0, 0, 0);
width: 1px;
height: 1px;
margin: -1px;
padding: 0;
border: 0;
} .sr-only-focusable:active,
.sr-only-focusable:focus {
position: static;
overflow: visible;
clip: auto;
width: auto;
height: auto;
margin: 0;
} .drawer--sidebar {
background-color: #fff;
}
.drawer--sidebar .drawer-contents {
background-color: #fff;
}
@media (min-width: 64em) {
.drawer--sidebar .drawer-hamburger {
display: none;
visibility: hidden;
}
.drawer--sidebar .drawer-nav {
display: block;
-webkit-transform: none;
transform: none;
position: fixed;
width: 12.5rem;
height: 100%;
} .drawer--sidebar.drawer--left .drawer-nav {
left: 0;
border-right: 1px solid #ddd;
}
.drawer--sidebar.drawer--left .drawer-contents {
margin-left: 12.5rem;
} .drawer--sidebar.drawer--right .drawer-nav {
right: 0;
border-left: 1px solid #ddd;
}
.drawer--sidebar.drawer--right .drawer-contents {
margin-right: 12.5rem;
} .drawer--sidebar .drawer-container {
max-width: 48rem;
}
}
@media (min-width: 75em) {
.drawer--sidebar .drawer-nav {
width: 16.25rem;
}
.drawer--sidebar.drawer--left .drawer-contents {
margin-left: 16.25rem;
}
.drawer--sidebar.drawer--right .drawer-contents {
margin-right: 16.25rem;
} .drawer--sidebar .drawer-container {
max-width: 60rem;
}
} .drawer--navbarTopGutter {
padding-top: 3.75rem;
}
.drawer-navbar .drawer-navbar-header {
border-bottom: 1px solid #ddd;
background-color: #fff;
}
.drawer-navbar {
z-index: 102;
top: 0;
width: 100%;
} .drawer-navbar--fixed {
position: fixed;
}
.drawer-navbar-header {
position: relative;
z-index: 102;
box-sizing: border-box;
width: 100%;
height: 3.75rem;
padding: 0 .75rem;
text-align: center;
}
.drawer-navbar .drawer-brand {
line-height: 3.75rem;
display: inline-block;
padding-top: 0;
padding-bottom: 0;
text-decoration: none;
}
.drawer-navbar .drawer-brand:hover {
background-color: transparent;
}
.drawer-navbar .drawer-nav {
padding-top: 3.75rem;
}
.drawer-navbar .drawer-menu {
padding-bottom: 7.5rem;
}
@media (min-width: 64em) {
.drawer-navbar {
height: 3.75rem;
border-bottom: 1px solid #ddd;
background-color: #fff;
}
.drawer-navbar .drawer-navbar-header {
position: relative;
display: block;
float: left;
width: auto;
padding: 0;
border: 0;
}
.drawer-navbar .drawer-menu--right {
float: right;
}
.drawer-navbar .drawer-menu li {
float: left;
}
.drawer-navbar .drawer-menu-item {
line-height: 3.75rem;
padding-top: 0;
padding-bottom: 0;
}
.drawer-navbar .drawer-hamburger {
display: none;
}
.drawer-navbar .drawer-nav {
position: relative;
left: 0;
overflow: visible;
width: auto;
height: 3.75rem;
padding-top: 0;
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
.drawer-navbar .drawer-menu {
padding: 0;
} .drawer-navbar .drawer-dropdown-menu {
position: absolute;
width: 16.25rem;
border: 1px solid #ddd;
}
.drawer-navbar .drawer-dropdown-menu-item {
padding-left: .75rem;
}
} .drawer-dropdown-menu {
display: none;
box-sizing: border-box;
width: 100%;
margin: 0;
padding: 0;
background-color: #fff;
}
.drawer-dropdown-menu > li {
width: 100%;
list-style: none;
}
.drawer-dropdown-menu-item {
line-height: 3.75rem;
display: block;
padding: 0;
padding-right: .75rem;
padding-left: 1.5rem;
text-decoration: none;
color: #222;
}
.drawer-dropdown-menu-item:hover {
text-decoration: underline;
color: #555;
background-color: transparent;
} .drawer-dropdown.open > .drawer-dropdown-menu {
display: block;
} .drawer-dropdown .drawer-caret {
display: inline-block;
width: 0;
height: 0;
margin-left: 4px;
-webkit-transition: opacity .2s ease, -webkit-transform .2s ease;
transition: opacity .2s ease, -webkit-transform .2s ease;
transition: transform .2s ease, opacity .2s ease;
transition: transform .2s ease, opacity .2s ease, -webkit-transform .2s ease;
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
vertical-align: middle;
border-top: 4px solid;
border-right: 4px solid transparent;
border-left: 4px solid transparent;
} .drawer-dropdown.open .drawer-caret {
-webkit-transform: rotate(180deg);
transform: rotate(180deg);
} .drawer-container {
margin-right: auto;
margin-left: auto;
}
@media (min-width: 64em) {
.drawer-container {
max-width: 60rem;
}
}
@media (min-width: 75em) {
.drawer-container {
max-width: 70rem;
}
}.bx-wrapper {
position: relative;
margin-bottom: 60px;
padding: 0;
*zoom: 1;
-ms-touch-action: pan-y;
touch-action: pan-y;
}
.bx-wrapper img {
max-width: 100%;
height: auto;
display: block;
}
.bxslider {
margin: 0;
padding: 0;
}
ul.bxslider {
list-style: none;
}
.bx-viewport { -webkit-transform: translatez(0);
} .bx-wrapper { }
.bx-wrapper img{
width:100%;
}
.bx-wrapper .bx-pager,
.bx-wrapper .bx-controls-auto {
position: absolute;
bottom: -30px;
width: 100%;
} .bx-wrapper .bx-loading {
min-height: 50px;
background: url(//test.shiraiauto-glass.com/wp-content/themes/gracebody/images/bx_loader.gif) center center no-repeat #ffffff;
height: 100%;
width: 100%;
position: absolute;
top: 0;
left: 0;
z-index: 2000;
} .bx-wrapper .bx-pager {
text-align: center;
font-size: .85em;
font-family: Arial;
font-weight: bold;
color: #666;
padding-top: 20px;
}
.bx-wrapper .bx-pager.bx-default-pager a {
background: #666;
text-indent: -9999px;
display: block;
width: 10px;
height: 10px;
margin: 0 5px;
outline: 0;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
border-radius: 5px;
}
.bx-wrapper .bx-pager.bx-default-pager a:hover,
.bx-wrapper .bx-pager.bx-default-pager a.active,
.bx-wrapper .bx-pager.bx-default-pager a:focus {
background: #000;
}
.bx-wrapper .bx-pager-item,
.bx-wrapper .bx-controls-auto .bx-controls-auto-item {
display: inline-block;
vertical-align: bottom;
*zoom: 1;
*display: inline;
}
.bx-wrapper .bx-pager-item {
font-size: 0;
line-height: 0;
} .bx-wrapper .bx-prev {
left: 10px;
background: url(//test.shiraiauto-glass.com/wp-content/themes/gracebody/images/controls.png) no-repeat 0 -32px;
}
.bx-wrapper .bx-prev:hover,
.bx-wrapper .bx-prev:focus {
background-position: 0 0;
}
.bx-wrapper .bx-next {
right: 10px;
background: url(//test.shiraiauto-glass.com/wp-content/themes/gracebody/images/controls.png) no-repeat -43px -32px;
}
.bx-wrapper .bx-next:hover,
.bx-wrapper .bx-next:focus {
background-position: -43px 0;
}
.bx-wrapper .bx-controls-direction a {
position: absolute;
top: 50%;
margin-top: -16px;
outline: 0;
width: 32px;
height: 32px;
text-indent: -9999px;
z-index: 9999;
}
.bx-wrapper .bx-controls-direction a.disabled {
display: none;
} .bx-wrapper .bx-controls-auto {
text-align: center;
}
.bx-wrapper .bx-controls-auto .bx-start {
display: block;
text-indent: -9999px;
width: 10px;
height: 11px;
outline: 0;
background: url(//test.shiraiauto-glass.com/wp-content/themes/gracebody/images/controls.png) -86px -11px no-repeat;
margin: 0 3px;
}
.bx-wrapper .bx-controls-auto .bx-start:hover,
.bx-wrapper .bx-controls-auto .bx-start.active,
.bx-wrapper .bx-controls-auto .bx-start:focus {
background-position: -86px 0;
}
.bx-wrapper .bx-controls-auto .bx-stop {
display: block;
text-indent: -9999px;
width: 9px;
height: 11px;
outline: 0;
background: url(//test.shiraiauto-glass.com/wp-content/themes/gracebody/images/controls.png) -86px -44px no-repeat;
margin: 0 3px;
}
.bx-wrapper .bx-controls-auto .bx-stop:hover,
.bx-wrapper .bx-controls-auto .bx-stop.active,
.bx-wrapper .bx-controls-auto .bx-stop:focus {
background-position: -86px -33px;
} .bx-wrapper .bx-controls.bx-has-controls-auto.bx-has-pager .bx-pager {
text-align: left;
width: 80%;
}
.bx-wrapper .bx-controls.bx-has-controls-auto.bx-has-pager .bx-controls-auto {
right: 0;
width: 35px;
} .bx-wrapper .bx-caption {
position: absolute;
bottom: 0;
left: 0;
background: #666;
background: rgba(80, 80, 80, 0.75);
width: 100%;
}
.bx-wrapper .bx-caption span {
color: #fff;
font-family: Arial;
display: block;
font-size: .85em;
padding: 10px;
}
 html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure,
footer, header, menu, nav, section, summary,
time, mark, audio, video {
margin:0;
padding:0;
border:0;
outline:0;
font-size:100%;
font-weight: normal;
vertical-align:baseline;
background:transparent;
}
body {
line-height:1;
-webkit-text-size-adjust: 100%;
}
article,aside,details,figcaption,figure,
footer,header,menu,nav,section {
display:block;
}
nav ul {
list-style:none;
}
blockquote, q {
quotes:none;
}
blockquote:before, blockquote:after,
q:before, q:after {
content:'';
content:none;
}
a {
margin:0;
padding:0;
font-size:100%;
vertical-align:baseline;
background:transparent;
} ins {
background-color:#ff9;
color:#000;
text-decoration:none;
} mark {
background-color:#ff9;
color:#000;
font-style:italic;
font-weight:bold;
}
del {
text-decoration: line-through;
}
abbr[title], dfn[title] {
border-bottom:1px dotted;
cursor:help;
}
table {
border-collapse:collapse;
border-spacing:0;
} hr {
display:block;
height:1px;
border:0;
border-top:1px solid #cccccc;
margin:1em 0;
padding:0;
}
input, select {
vertical-align:middle;
} ol li,
ul li {
list-style: none;
list-style-position: inside;
}
img {
border:none;
vertical-align: bottom;
}
* {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
-o-box-sizing: border-box;
-ms-box-sizing: border-box;
box-sizing: border-box;
}
.mt05 { margin-top: 5px !important;}
.mt10 {	margin-top: 10px !important;}
.mt15 {	margin-top: 15px !important;}
.mt20 {	margin-top: 20px !important;}
.mt25 {	margin-top: 25px !important;}
.mt30 {	margin-top: 30px !important;}
.mt35 {	margin-top: 35px !important;}
.mt40 {	margin-top: 40px !important;}
.mt45 {	margin-top: 45px !important;}
.mt50 {	margin-top: 50px !important;}
.mt55 {	margin-top: 55px !important;}
.mt60 {	margin-top: 60px !important;}
.mt65 {	margin-top: 65px !important;}
.mt70 {	margin-top: 70px !important;}
.mt75 {	margin-top: 75px !important;}
.mt80 {	margin-top: 80px !important;}
.mt85 {	margin-top: 85px !important;}
.mt90 {	margin-top: 90px !important;}
.mt95 {	margin-top: 95px !important;}
.mt100 {margin-top: 100px !important;}
.mb00 {	margin-bottom: 0 !important;}
.mb05 {	margin-bottom: 5px !important;}
.mb10 {	margin-bottom: 10px !important;}
.mb15 {	margin-bottom: 15px !important;}
.mb20 {	margin-bottom: 20px !important;}
.mb25 {	margin-bottom: 25px !important;}
.mb30 {	margin-bottom: 30px !important;}
.mb35 {	margin-bottom: 35px !important;}
.mb40 {	margin-bottom: 40px !important;}
.mb45 {	margin-bottom: 45px !important;}
.mb50 {	margin-bottom: 50px !important;}
.mb55 {	margin-bottom: 55px !important;}
.mb60 {	margin-bottom: 60px !important;}
.mb65 {	margin-bottom: 65px !important;}
.mb70 {	margin-bottom: 70px !important;}
.mb75 {	margin-bottom: 75px !important;}
.mb80 {	margin-bottom: 80px !important;}
.mb85 {	margin-bottom: 85px !important;}
.mb90 {	margin-bottom: 90px !important;}
.mb95 {	margin-bottom: 95px !important;}
.mb100 { margin-bottom: 100px !important;}
.mr05 {	margin-right: 5px !important;}
.mr10 {	margin-right: 10px !important;}
.mr15 {	margin-right: 15px !important;}
.mr20 {	margin-right: 20px !important;}
.mr25 {	margin-right: 25px !important;}
.mr30 {	margin-right: 30px !important;}
.mr35 {	margin-right: 35px !important;}
.mr40 {	margin-right: 40px !important;}
.mr45 {	margin-right: 45px !important;}
.mr50 {	margin-right: 50px !important;}
.mr55 {	margin-right: 55px !important;}
.mr60 {	margin-right: 60px !important;}
.mr65 {	margin-right: 65px !important;}
.mr70 {	margin-right: 70px !important;}
.mr75 {	margin-right: 75px !important;}
.mr80 {	margin-right: 80px !important;}
.mr85 {	margin-right: 85px !important;}
.mr90 {	margin-right: 90px !important;}
.mr95 {	margin-right: 95px !important;}
.mr100 {margin-right: 100px !important;}
.ml05 {	margin-left: 5px !important;}
.ml10 {	margin-left: 10px !important;}
.ml15 {	margin-left: 15px !important;}
.ml20 {	margin-left: 20px !important;}
.ml25 {	margin-left: 25px !important;}
.ml30 {	margin-left: 30px !important;}
.ml35 {	margin-left: 35px !important;}
.ml40 {	margin-left: 40px !important;}
.ml45 {	margin-left: 45px !important;}
.ml50 {	margin-left: 50px !important;}
.ml55 {	margin-left: 55px !important;}
.ml60 {	margin-left: 60px !important;}
.ml65 {	margin-left: 65px !important;}
.ml70 {	margin-left: 70px !important;}
.ml75 {	margin-left: 75px !important;}
.ml80 {	margin-left: 80px !important;}
.ml85 {	margin-left: 85px !important;}
.ml90 {	margin-left: 90px !important;}
.ml95 {	margin-left: 95px !important;}
.ml100 {	margin-left: 100px !important;}
.m_a {	
margin-right: auto;
margin-left: auto;
}
.pt00 {	padding-top: 0 !important;}
.pt05 {	padding-top: 5px !important;}
.pt10 {	padding-top: 10px !important;}
.pt15 {	padding-top: 15px !important;}
.pt20 {	padding-top: 20px !important;}
.pt25 {	padding-top: 25px !important;}
.pt30 {	padding-top: 30px !important;}
.pt35 {	padding-top: 35px !important;}
.pt40 {	padding-top: 40px !important;}
.pt45 {	padding-top: 45px !important;}
.pt50 {	padding-top: 50px !important;}
.pt55 {	padding-top: 55px !important;}
.pt60 {	padding-top: 60px !important;}
.pt65 {	padding-top: 65px !important;}
.pt70 {	padding-top: 70px !important;}
.pt75 {	padding-top: 75px !important;}
.pt80 {	padding-top: 80px !important;}
.pt85 {	padding-top: 85px;}
.pt90 {	padding-top: 90px;}
.pt95 {	padding-top: 95px;}
.pt100 { padding-top: 100px;}
.pb00 {	padding-bottom: 0 !important;}
.pb05 {	padding-bottom: 5px !important;}
.pb10 {	padding-bottom: 10px !important;}
.pb15 {	padding-bottom: 15px !important;}
.pb20 {	padding-bottom: 20px !important;}
.pb25 {	padding-bottom: 25px !important;}
.pb30 {	padding-bottom: 30px !important;}
.pb35 {	padding-bottom: 35px !important;}
.pb40 {	padding-bottom: 40px !important;}
.pb45 {	padding-bottom: 45px !important;}
.pb50 {	padding-bottom: 50px !important;}
.pb55 {	padding-bottom: 55px !important;}
.pb60 {	padding-bottom: 60px !important;}
.pb65 {	padding-bottom: 65px !important;}
.pb70 {	padding-bottom: 70px !important;}
.pb75 {	padding-bottom: 75px !important;}
.pb80 {	padding-bottom: 80px !important;}
.pb85 {	padding-bottom: 85px;}
.pb90 {	padding-bottom: 90px;}
.pb95 {	padding-bottom: 95px;}
.pb100 { padding-bottom: 100px;}
.pb120 { padding-bottom: 120px;}
.pb150 { padding-bottom: 150px;}
.pr05 {	padding-right: 5px;}
.pr10 {	padding-right: 10px;}
.pr15 {	padding-right: 15px;}
.pr20 {	padding-right: 20px;}
.pr25 {	padding-right: 25px;}
.pr30 {	padding-right: 30px;}
.pr35 {	padding-right: 35px;}
.pr40 {	padding-right: 40px;}
.pr45 {	padding-right: 45px;}
.pr50 {	padding-right: 50px;}
.pr55 {	padding-right: 55px;}
.pr60 {	padding-right: 60px;}
.pr65 {	padding-right: 65px;}
.pr70 {	padding-right: 70px;}
.pr75 {	padding-right: 75px;}
.pr80 {	padding-right: 80px;}
.pr85 {	padding-right: 85px;}
.pr90 {	padding-right: 90px;}
.pr95 {	padding-right: 95px;}
.pr100 { padding-right: 100px;}
.pl05 {	padding-left: 5px;}
.pl10 {	padding-left: 10px;}
.pl15 {	padding-left: 15px;}
.pl20 {	padding-left: 20px;}
.pl25 {	padding-left: 25px;}
.pl30 {	padding-left: 30px;}
.pl35 {	padding-left: 35px;}
.pl40 {	padding-left: 40px;}
.pl45 {	padding-left: 45px;}
.pl50 {	padding-left: 50px;}
.pl55 {	padding-left: 55px;}
.pl60 {	padding-left: 60px;}
.pl65 {	padding-left: 65px;}
.pl70 {	padding-left: 70px;}
.pl75 {	padding-left: 75px;}
.pl80 {	padding-left: 80px;}
.pl85 {	padding-left: 85px;}
.pl90 {	padding-left: 90px;}
.pl95 {	padding-left: 95px;}
.pl100 { padding-left: 100px;
}
.fl_r,.floatR{float: right;}
.fl_l,.floatL{float: left;}
.fw_b,.bold{font-weight: bold;}
.txt_c,.textC{text-align: center;}
.txt_r,.textR {text-align: right;}
.txt_l,.textL {text-align: left;}
.w100per{width:100%;}
.w95per { width: 95%;}
.w90per { width: 90%;}
.w85per { width: 85%;}
.w80per { width: 80%;}
.w75per { width: 75%;}
.w70per { width: 70%;}
.w65per { width: 65%;}
.w60per { width: 60%;}
.w55per { width: 55%;}
.w50per { width: 50%;} body {
font-family: Avenir , "Open Sans" , "Helvetica Neue" , Helvetica , Arial , Verdana , Roboto , "ヒラギノ角ゴ Pro W3" , "Hiragino Kaku Gothic Pro" , "游ゴシック" , "Yu Gothic" , "游ゴシック体" , "YuGothic" ,  "メイリオ" , Meiryo , "Meiryo UI" , "ＭＳ Ｐゴシック" , "MS PGothic" , sans-serif;
font-size: 14px;
line-height: 1.8;
color: #000;
background: #fff;
}
.serif {
font-family:"Roboto Slab" , Garamond , "Times New Roman" , "ヒラギノ明朝 Pro W3" , "Hiragino Mincho Pro" , "HiraMinProN-W3" , "游明朝" , "Yu Mincho" , "游明朝体" , "YuMincho" , "HGS明朝E" , "ＭＳ Ｐ明朝" , "MS PMincho" , serif;
font-size: 16px;
}
a {
color: #000;
text-decoration:none;
}
a:hover {
color: #000;
opacity: 0.6;
-webkit-transition: all .5s;
transition: all .5s;
}
a:hover img {
opacity: 0.8;
-webkit-transition: all .5s;
transition: all .5s;
}
.white{ color:#fff; }
.black{ color:#000; }
.blue{color:#005e99;}
.red{ color:#ee0000; }
.yl{ color:#ffc000; }
.bgRed{ background:#d5001c; }
.bgGray{ background: #ebeff3; }
.bgBlue{ background: #005e99; }
.bgBlack{ background: #000; }
.bgBlack2{ background: #333; }
.bgWhite{ background: #fff; }
.bgPink{ background: #fcf3fb; }
.bgYl{ background: #fbfcf3; }
.bgF0{background-color:#f0f0f0;}
.bgF5{background-color:#f5f5f5;}
.bgD0{background-color:#d0d0d0;}
.fs12 {font-size:12px;}
.fs13 {font-size:13px;}
.fs14 {font-size:100%;}
.fs15 {font-size:15px;}
.fs16 {font-size:16px;}
.fs18 {font-size:18px;}
.fs20 {font-size:20px;}
.fs22 {font-size:22px;}
.fs24 {font-size:24px;}
.fs26 {font-size:26px;}
.fs28 {font-size:28px;}
.fs30 {font-size:30px;}
.fs32 {font-size:32px;}
.fs36 {font-size:36px;}
.fs38 {font-size:38px;}
.fs40 {font-size:40px;}
.opensans,.en{font-family: 'Open Sans', sans-serif;}
.smp{display:none;} .cf:after{
content:".";
display:block;
clear:both;
height:0;
visibility:hidden;
}
.contentWrp{
max-width: 1280px;
width:96%;
margin: 0 auto;
position: relative;
text-align: left;
}
.contentWrpS{
max-width: 1000px;
width:96%;
margin: 0 auto;
position: relative;
}
.inner {
margin: 0 auto;
position: relative;
}
.dispTb{
display: table;
}
.vMiddle{
display: table-cell;
vertical-align: middle;
}
iframe{ width:100%; }
.flex{
display: -webkit-flex;
display: flex;
}
.flex1 {
-webkit-justify-content: space-between;
justify-content: space-between;
}
.flex2 {
justify-content: space-around;
align-items: stretch;
}
.flex3{
-webkit-justify-content: center;
justify-content: center;
-webkit-align-items: center;
align-items: center;
}
.flex-wrap{
flex-wrap: wrap;
}
.col1of2,
.col2 li{
width:49%;
}
.col1of2{
max-width: 580px;
}
.col3 li{
width:32%;
max-width: 390px;
}
.col4 li{
width:24%;
}
.col5 li{
width:19%;
}
.img img{
width:100%;
height: auto;
}
.btn{
position: relative;
cursor: pointer;
font-size: 100%;
}
.btn:hover{
transition: .3s;
}
.btn a{
position: absolute;
width:100%;
height: 100%;
top:0;
left:0;
z-index: 3;
}
.btn span{
position: relative;
display: block;
z-index: 1;
}
.btn1{
position: relative;
width: 200px;
height:35px;
text-align: center;
background:linear-gradient(90deg,#035392 0%,#004681 100%);
border-radius:5px;
}
.btn1 span:before{
content:'';
position: absolute;
top:40%;
left:85%;
width:15px;
height: 7px;
background-image: url(//test.shiraiauto-glass.com/wp-content/themes/gracebody/images/btn/arrow01.png);
}
.btn1:hover span:before{
left:87%;
transition: .2s;
}
.btn1 span{
padding:5px;
text-align: center;
color:#fff;
}
.btn2{
position: relative;
max-width: 200px;
width:100%;
text-align: center;
background-color:#fff;
}
.btn2 span:before{
content:'';
position: absolute;
top:40%;
left:85%;
width:15px;
height: 7px;
background-image: url(//test.shiraiauto-glass.com/wp-content/themes/gracebody/images/btn/arrow02.png);
}
.btn2:hover span:before{
left:87%;
transition: .2s;
}
.btn2 span{
padding:5px;
text-align: center;
color:#005e99;
}
.btn3{
width:185px;
padding:10px 0 10px 30px;
text-align: left;
color:#fff;
background:#333 url(//test.shiraiauto-glass.com/wp-content/themes/gracebody/images/btn/arrow01.png) no-repeat 80% 50%;
}
.btn3:hover{
background:#d5001c url(//test.shiraiauto-glass.com/wp-content/themes/gracebody/images/btn/arrow01.png) no-repeat 80% 50%;
}
.lh2{ line-height: 2; }
.lh12{line-height: 1.2;}
.lh13{line-height: 1.3;}
.lh14{line-height: 1.4;}
.lh15{line-height: 1.5;}
ul.disc li{
margin-left:1.2em;
list-style-type:disc;
list-style-position: outside;
}
#loading {
width: 100%;
height: 100%;
margin: 0;
background: #fff;
opacity: 1.0;
position: fixed;
top: 0;
left: 0;
z-index: 9999; 
}
#loading img {
position:absolute;
top:50%;
left:0;
right:0;
margin-top:-80px;
margin-left:-80px;
width:80px;
margin:auto;
} header {
position: relative;
width: 100%;
height: 70px;
}
header .inner{
position: relative;
z-index:2;
}
@media screen and (-webkit-min-device-pixel-ratio: 0) {
_::-webkit-full-page-media, _:future, :root 
header .hdtop{
}
}
#header .logo{
position: absolute;
top:15px;
left:20px;
width:199px;
}
#header .telArea{
position: absolute;
top:0;
right:200px;
width: 230px;
height: 70px;
padding:15px 10px 10px 10px;
color:#005e99;
background-color:#f5f5f5;
}
#header .telArea .tel{
font-size: 26px;
font-weight: bold;
line-height: 1;
}
#header .telArea .tel a{
color:#005e99;
}
#header .telArea .opentime{
font-size: 11px;
line-height: 1.2;
}
#header .telArea .opentime br{
display: none;
}
#header .contact.btn{
position: absolute;
top:0;
right:0;
width: 200px;
height: 70px;
padding:20px 30px;
background: url(//test.shiraiauto-glass.com/wp-content/themes/gracebody/images/icon/bgMail.png) no-repeat center;
background-size: cover;
text-align: center;
border-radius:0;
}
#header .contact.btn a{
position: absolute;
top:0;
left:0;
width:100%;
height: 100%;
}
#header .contact.btn span{
max-width: 140px;
}
.g_naviWrap {
display: block;
position: absolute;
top:25px;
left:250px;
right:450px;
max-width: 920px;
width:60%;
margin:auto;
}
.g_navi ul{
margin: 0 auto;
width: 100%;
}
.g_navi li {
position: relative;
padding-bottom:18px;
text-align: center;
}
.g_navi li:hover{
border-bottom:2px solid #043c78;
}
.g_navi li a {
position: absolute;
width:100%;
height:100%;
top:0;
left:0;
}
.g_navi li span{
display: block;
}
@media only screen and (max-width: 999px){ .drawer-hamburger {
top:0;
background-color: rgba(255, 255, 255, 0.9) !important;
border: 1px solid #ccc;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
z-index: 100;
}
@media screen and (-webkit-min-device-pixel-ratio: 0) {
_::-webkit-full-page-media, _:future, :root 
.drawer-hamburger{
top:-2px;
}
}
.drawer-nav {
color: #fff;
background-color: rgba(0,0,0,0.7);
padding: 20px 0;
z-index: 10000;
}
.drawer-nav ul li {
width: 100%;
text-align: left;
font-size: 14px;
border-bottom: 1px solid #586e85;
}
.drawer-nav ul li.last{
text-align: center;
}
.drawer-nav ul li a {
color: #fff;
display: block;
padding: 10px;
}
.drawer-hamburger-icon, .drawer-hamburger-icon::before, .drawer-hamburger-icon::after {
background-color: #000;
}
.drawer-nav ul li .telarea a{
padding:0;
}
.drawer-nav .telarea {
padding: 0 10px;
}
.drawer-nav .telarea .icon {
margin-right: 5px;
}
.drawer-nav .telarea .number {
text-align: center;
}
.drawer-nav .telarea .number .tel {
font-size: 18px;
font-weight: bold;
}
} section#mv{
padding:0;
}
#mv{
position: relative;
width:100%;
left:0;
right:0;
margin:0 auto;
z-index:1;
}
#mv .bx-wrapper{
} #mv .bx-wrapper .bx-controls-direction a {
position: absolute;
top: 50%;
margin-top: -18px;
outline: 0;
width: 60px;
height: 60px;
text-indent: -9999px;
z-index: 80;
}
#mv .bx-wrapper .bx-prev {
background: url(//test.shiraiauto-glass.com/wp-content/themes/gracebody/images/main/top/prev.png) no-repeat 0 0;
}
#mv .bx-wrapper .bx-next {
background: url(//test.shiraiauto-glass.com/wp-content/themes/gracebody/images/main/top/next.png) no-repeat 0 0;
} #mainImage h1 span{
font-size: 42px;
font-weight: bold;
}
#mainImage h1 {
text-align: center;
}
#mainImage{
width:100%;
margin:auto;
background-size:cover;
}
#mainImage img{
width: 100%;
} section {
padding:40px 0;
}
h2,h3,h2 span,h3 span{ 
font-weight: bold;
}
.h2 {
font-size: 36px;
}
.h3 {
font-size: 24px;
font-weight: bold;
margin-bottom: 15px;
}
.h3 span{
display: block;
font-weight: bold;
}
.h3 .en{
font-size: 32px;
font-weight: normal;
}
.h2tit{
position: relative;
height: 200px;
padding-top:40px;
background-color:#ebeff3;
}
.h2tit h2 {
text-align: center;
}
.h2tit h2 span{
color:#005e99;
}
.titArea h3 span{
display: block;
}
.t28{font-size: 28px;}
.t32{font-size: 32px;}
.redLine {
background-image: linear-gradient(transparent 50%, #b91c1c 90%);
display: inline;
}
@media screen and (-webkit-min-device-pixel-ratio:0) {
::i-block-chrome, .redLine{
background-image: linear-gradient(transparent 50%, #b91c1c 90%);
display: inline;
}
}
.ylline{
background:linear-gradient(transparent 60%, #ffde00 0%);
}
.horizontal-line {
overflow: hidden;
text-align: center;
}
.horizontal-line span {
display: inline-block;
padding: 0 0.5em;
position: relative;
font-weight: bold;
}
.horizontal-line span::before, .horizontal-line span::after {
border-top: 1px solid;
content: "";
position: absolute;
top: 50%;
width: 99em;
}
.horizontal-line span::before {
right: 100%;
}
.grayline {
background: #353535;
color: #fff;
margin-bottom: 0;
position: relative;
line-height: 1.5;
letter-spacing: 2px;
font-size: 30px;
padding: 25px 10px 20px;
position: relative;
}
.grayline::before {
position: absolute;
content: "";
display: block;
width: 140px;
height: 8px;
background: #810021;
top: 0;
left: 50%;
margin-left: -70px;
}
.grayline.lh2{ line-height: 2;}
.tablebox {
display: table;
width: 100%;
}
.tablebox .left,
.tablebox .right {
display: table-cell;
vertical-align: top;
width: 50%;
}
.tablebox .left img,
.tablebox .right img {
vertical-align: top;
}
.telinfo span{
display: block;
line-height: 1.3;
}
.halfImg .upper,
.halfImg .lower{
width:50%;
}
.halfImg .upper{
margin-right: 50%;
}
.halfImg .lower{
margin-left:50%;
}
.telArea p.icon{
width:21px;
margin-right: 5px;
}
.telArea .tel{
font-size: 26px;
font-weight: bold;
color:#005e99;
line-height: 1;
}
.telArea .tel a{
color:#005e99;
}
.breadcrumb{
padding:10px 0;
text-align:right;
font-size: 13px;
} #topnews .titArea{
max-width: 420px;
width:33%;
}
#topnews .titArea h2{
margin-bottom:40px;
line-height: 1;
}
#topnews .news li{
margin-bottom:15px;
}
#topnews .news li .cate,
#topnews .news li .date{
margin-right: 30px;
}
#top01 h2{
margin-bottom:15px;
}
#top01 .bgGray{
position: relative;
max-width: 980px;
width:96%;
margin:0 auto 40px;
padding:40px 45px;
border-radius: 5px;
}
#top01 .bgGray:before{
position:absolute;
width:0;
height:0;
border-color:#ebeff3 transparent transparent;
border-width:30px;
border-style:solid;
bottom:-60px;
left:45%;
content: " ";
}
#top01 .bgGray li{
max-width: 320px;
width:32%;
text-align: center;
}
#top01 .bgGray li img{
max-width: 270px;
width:100%;
margin:0 auto 10px;
}
.cont02{
margin-top:50px;
}
.cont02 .upper,
.cont02 .lower{
position: relative;
padding:160px 0 50px;
background:#fff bottom;
}
.cont02 .upper:before,
.cont02 .lower:before{
content:'';
position: absolute;
top:0;
left:0;
width:100%;
height: 300px;
}
#top01 .cont02 .upper:before{
background:url(//test.shiraiauto-glass.com/wp-content/themes/gracebody/images/toppage/top01_02_01.jpg) no-repeat center;
background-size: cover;
}
#top01 .cont02 .lower:before{
background:url(//test.shiraiauto-glass.com/wp-content/themes/gracebody/images/toppage/top01_02_02.jpg) no-repeat center;
background-size: cover;
}
.cont02 .box{
max-width: 795px;
width:100%;
padding:40px 60px;
background-color:#fff;
box-shadow: 2px 2px 2px #f2f2f2;
}
.cont02 .box h3{
margin-bottom:15px;
color:#005e99;
}
.cont02 .upper .box{
float:right;
}
#top02{
position: relative;
}
.h2-bmcont{
position: relative;
top:-60px;
margin-bottom:-60px;
}
#top02 li{
max-width: 610px;
width:48%;
margin-bottom:30px;
padding:80px 10px;
text-align:center;
color:#fff;
background-size: cover;
}
#top02 li:nth-child(1){
background:url(//test.shiraiauto-glass.com/wp-content/themes/gracebody/images/toppage/top02_01.jpg) no-repeat center;
}
#top02 li:nth-child(2){
background:url(//test.shiraiauto-glass.com/wp-content/themes/gracebody/images/toppage/top02_02.jpg) no-repeat center;
}
#top02 li:nth-child(3){
background:url(//test.shiraiauto-glass.com/wp-content/themes/gracebody/images/toppage/top02_03.jpg) no-repeat center;
}
#top02 li:nth-child(4){
background:url(//test.shiraiauto-glass.com/wp-content/themes/gracebody/images/toppage/top02_04.jpg) no-repeat center;
}
#top02 li h3{
margin-bottom:20px;
}
#top02 li h3 span.en{
display: block;
margin-bottom:20px;
font-size: 24px;
}
#top02 li .inner{
max-width:450px;
width:100%;
margin:auto;
}
#top02 li p.price{
margin-top:20px;
font-size: 24px;
}
#top02 li .btn2{
margin:40px auto 0;
}
#top03 .lower .box .btn{
margin-top:20px;
}
#top04 .bgGray{
max-width: 1280px;
width:100%;
margin:auto;
padding:40px 50px 60px;
border-top:10px solid #2a93d4;
}
#top04 h2{
margin-bottom:20px;
}
#top04 .img{
max-width: 560px;
width:48%;
}
#top04 .right{
max-width: 560px;
width:48%;
}
#top04 .right .txt{
margin-bottom:20px;
}
.top-area {
background: rgb(2,0,36);
background: linear-gradient(0deg, rgba(2,0,36,1) 0%, rgba(1,72,133,1) 0%, rgba(1,122,202,1) 100%);
padding: 0;
}
.top-area h2 {
width: 70%;
margin: 0 auto;
}
.top-area figure img {
width: 90%;
margin: 0 auto;
}
.top-area-detail {
background-color: #e7f2fa;
}
.top-area-wrap {
background-color: #fff;
padding: 30px 30px 50px 30px;
margin-top: -50px;
}
.top-area-wrap dl {
border: 5px solid #e7f2fa;
padding: 2%;
width: 80%;
margin: 0 auto 20px;
}
.top-area-wrap dl:last-of-type {
margin-bottom: 60px;
}
.top-area-wrap dl dt {
font-weight: bold;
font-size: 46px;
width: 18%;
line-height: 1.5;
}
.top-area-wrap dl dd {
font-size: 22px;
font-weight: bold;
width: 80%;
line-height: 1.5;
}
.top-area-wrap p {
border-top: 3px solid #005e99;
border-bottom: 3px solid #005e99;
font-size: 37px;
font-weight: bold;
color: #005e99;
text-align: center;
width: 80%;
margin: 0 auto;
}
.top-area-wrap p span {
color: #f47a00;
font-weight: bold;
font-size: 50px;
}
.top-trouble {
background-image: url(//test.shiraiauto-glass.com/wp-content/themes/gracebody/images/toppage/point_bg.jpg);
background-repeat: no-repeat;
background-position: top;
background-size: cover;
padding: 0;
}
.top-trouble .contentWrp {
width: 70%;
margin: 0 auto;
background-color: rgba(255,255,255,0.6);
padding: 60px 50px;
box-shadow: 0px 0px 15px -5px #787878;
}
.top-trouble h2 {
width: 70%;
margin: 0 auto 50px;
}
.top-trouble .flex {
margin-bottom: 50px;
}
.top-trouble .flex figure {
width: 33%;
}
.top-trouble .flex img {
width: 100%;
}
.top-trouble-wrap {
border: 3px solid #005e99;
border-radius: 12px;
padding: 40px 120px;
margin-bottom: 60px;
}
.top-trouble-wrap p.top-trouble-point {
border: 3px solid #005e99;
border-radius: 30px;
background-color: #fff;
font-size: 18px;
font-weight: bold;
width: 25%;
text-align: center;
color: #005e99;
margin: 0 auto 20px;
line-height: 1.25;
margin-top: -65px;
}
.top-trouble-point span {
font-size: 32px;
font-weight: bold;
}
.top-trouble-wrap h3 {
font-size: 28px;
color: #242424;
text-align: center;
line-height: 1.25;
margin-bottom: 20px;
}
.top-trouble-wrap h3 span {
font-size: 38px;
color: #f47a00;
}
.top-trouble-wrap p {
font-size: 16px;
}
.top-ng {
background-color: #ebeff3;
margin-bottom: 30px;
}
.top-ng h2 {
font-size: 36px;
color: #005e99;
font-weight: bold;
margin-bottom: 10px;
text-align: center;
}
.top-ng figure {
text-align: center;
margin-bottom: 20px;
}
.top-ng p {
text-align: center;
width: 70%;
margin: 0 auto;
font-size: 15px;
}
.top-caution .top-caution-wrap {
background-color: #f5f5f5;
padding: 40px;
margin-bottom: 60px;
}
.top-caution .top-caution-number {
background-color: #fff000;
font-size: 18px;
font-weight: bold;
text-align: center;
width: 15%;
margin: 0 auto 30px;
margin-top: -60px;
line-height: 1;
padding: 10px;
}
.top-caution h3 {
font-size: 28px;
color: #005e99;
text-align: center;
margin-bottom: 40px;
}
.top-caution .top-caution-wrap .flex figure {
width: 48%;
}
.top-caution .top-caution-wrap .flex figure img {
width: 100%;
}
.top-caution .top-caution-wrap .flex p {
width: 48%;
font-size: 16px;
}
.top-caution .top-caution-box {
background-color: #fff;
padding: 30px 50px;
margin-top: 40px;
}
.top-caution .top-caution-box h4 {
font-size: 18px;
color: #005e99;
font-weight: bold;
margin-bottom: 10px;
}
.top-caution .top-caution-box p {
font-size: 16px;
}
.top-trouble-check .contentWrp {
background-color: #ebeff3;
border-top: 10px solid #2a93d4;
padding: 50px 70px;
}
.top-trouble-check .flex:first-of-type figure {
width: 73%;
}
.top-trouble-check h2 {
text-align: center;
font-size: 28px;
margin-bottom: 40px;
}
.top-trouble-txt {
text-align: center;
margin-bottom: 30px;
font-size: 16px;
}
.top-trouble-number {
background-color: #005e99;
border-radius: 10px;
font-size: 20px;
width: 40px;
color: #fff;
text-align: center;
margin: 0 auto 20px;
}
.top-trouble-check h3 {
font-size: 24px;
color: #005e99;
margin-bottom: 30px;
text-align: center;
}
.top-trouble-check ul {
background-color: #fff;
border-radius: 10px;
padding: 30px;
height: 260px;
}
.top-trouble-check li {
font-size: 16px;
}
.top-trouble-check .flex:first-of-type {
margin-bottom: 50px;
}
.top-trouble-img {
width: 24%;
}
.top-trouble-img p {
text-align: center;
font-size: 16px;
margin-top: 10px;
} .cont01 .inner{
max-width: 1280px;
width:100%;
margin:auto;
}
.cont01 .upper,
.cont01 .lower{
position:relative;
}
.cont01 .upper .img,
.cont01 .lower .img{
position: relative;
max-width: 620px;
z-index: 2;
}
.cont01 .upper .box,
.cont01 .lower .box{
position: relative;
max-width: 720px;
background-color:#ebeff3;
z-index: 1;
}
.cont01 .upper{
margin-top:50px;
margin-bottom:100px;
}
.cont01 .upper .box{
top:-400px;
margin-left:560px;
margin-bottom:-400px;
padding:40px 40px 120px 80px;
}
.cont01 .lower{
}
.cont01 .lower .img{
margin-left:660px
}
.cont01 .lower .box{
top:-490px;
margin-bottom:-490px;
padding:40px 80px 40px 40px;
}
.cont03 h2{
margin-bottom: 35px;
}
.cont03 p {
max-width: 670px;
width: 100%;
line-height: 2;
}
.aming .h2{
margin-bottom:30px;
line-height: 1.5;
} #guest01.cont01 .upper .box{
padding:150px 40px 150px 80px
}
#guest01.cont01 .lower .box{
padding:80px 80px 80px 40px;
}
#guest01.cont01 .lower{
margin-bottom:60px;
}
#guest02 .bgImg{
background-color:#f5f5f5;
}
#guest02.flow .box{
position:relative;
margin-bottom:50px;
padding:40px;
background-color:#fff;
}
#guest02.flow .box::before{
position:absolute;
width:0;
height:0;
border-color:#fff transparent transparent;
border-width:40px;
border-style:solid;
bottom:-80px;
left:45%;
content: " ";
}
#guest02.flow .box:last-child:before{
content:none;
}
#guest02.flow .box .titArea{
width:100%;
height: 45px;
margin-bottom:15px;
}
#guest02.flow .box .titArea h3{
display: flex;
width:100%;
}
#guest02.flow .box .titArea span{
padding:5px 10px;
}
#guest02.flow .box .titArea span.step{
width:20%;
text-align:center;
color:#fff;
background-color:#005e99;
}
#guest02.flow .box .titArea span.txt{
width:80%;
color:#005e99;
background-color:#f5f5f5;
}
#guest02.flow .box .info{
margin-top:30px;
}
#guest02.flow .box .info .telArea p.icon{
width:16px;
}
#guest02.flow .box .info .open{
margin-bottom:20px;
}
#guest02.flow .box .info .mail{
max-width:206px;
}
#guest02.flow .box h4{
width:100%;
margin-top:20px;
margin-bottom:20px;
padding:5px 10px;
text-align:center;
color:#005e99;
background-color:#f5f5f5;
}
#guest02.flow .box .linkarea .flex{
max-width: 480px;
width:100%;
margin:auto;
}
#guest02.flow .box .card{
max-width: 235px;
width:100%;
margin:0 auto 15px;
}
.guest02_08 .left p.img{
margin-bottom:20px;
}
.guest02_08 .left .payment li{
width:50%;
margin-bottom:15px;
padding:5px 0;
}
.guest02_08 .left .payment li span{
display: block;
max-width: 202px;
width:80%;
margin:auto;
}
.guest02_08 .left .payment li:nth-child(1),
.guest02_08 .left .payment li:nth-child(3){
border-right:1px solid #ccc;
} #mainImage.replacement{
padding:140px 0;
}
#mainImage.replacement h1{
max-width: 708px;
width:90%;
margin:auto;
}
#replacement01{
padding:70px 0 170px;
background:url(//test.shiraiauto-glass.com/wp-content/themes/gracebody/images/replacement/bg01.jpg) no-repeat center bottom;
background-size:cover;
}
#replacement01 h2{
margin-bottom:35px;
}
#replacement01 h3{
margin-bottom:60px;
font-size: 16px;
}
#replacement01 h3 span{
font-size: 26px;
}
#replacement01 .left{
max-width:740px;
width:58%;
line-height: 2.1;
}
#replacement01 .right{
max-width:510px;
width:40%;
}
#replacement01 .right table{
max-width: 470px;
width:100%;
margin:auto;
background-color:#fff;
border-top:1px solid #004782;
border-right:1px solid #004782;
}
#replacement01 .right table td{
width:50%;
padding:15px 10px;
text-align: center;
vertical-align: middle;
color:#004782;
border-left:1px solid #004782;
border-bottom:1px solid #004782;
}
#replacement02 .bgWhite{
padding:40px;
}
#replacement02 ul{
margin-top:30px;
}
#replacement02 li h3{
width:100%;
height:45px;
background-color:#f5f5f5;
}
#replacement02 li h3 span{
display: inline-block;
height: 45px;
vertical-align: middle;
line-height: 1;
}
#replacement02 li h3 span.num{
max-width: 92px;
width:20%;
padding-top:12px;
font-size: 18px;
color:#fff;
background-color:#005e99;
text-align: center;
}
#replacement02 li h3 span.txt{
width:80%;
padding-top:11px;
padding-left:20px;
font-size: 20px;
color:#005e99;
}
#replacement03 .h2tit{
height:230px;
}
#replacement03 .h2tit h2{
margin-bottom:10px;
}
#replacement03 .h2tit p{
max-width: 650px;
width:100%;
margin:auto;
padding:10px;
font-weight:bold;
color:#fff;
background-color:#005e99;
border-radius:50px;
text-align: center;
}
.reason .box{
position:relative;
margin-bottom:50px;
padding:60px 40px 50px;
background-color:#f5f5f5;
}
.reason .box .num{
position:absolute;
top:-20px;
left:0;
right:0;
width:140px;
margin:auto;
padding:10px;
text-align: center;
color:#fff;
background-color:#005e99;
}
.reason .box h3{
margin-bottom:30px;
text-align: center;
color:#005e99;
}
.reason .box .right{
padding-top:20px;
}
.reason .box .right h4{
margin-bottom:20px;
font-weight: bold;
color:#005e99;
}
.reason01{
margin-top:50px;
}
.reason .reason04.box{
margin-bottom:0;
}
.reason04 .btn{
margin-top:30px;
}
#replacement04 .h2tit{
height:230px;
text-align:center;
line-height: 1.4;
}
#replacement04 .bgImg{
padding-bottom:100px;
background:url(//test.shiraiauto-glass.com/wp-content/themes/gracebody/images/replacement/bg04.jpg) no-repeat bottom;
background-size:cover;
}
#replacement04 .bgWhite{
padding:40px;
}
#replacement04 .box{
width:100%;
}
.replacement04_01{
margin-top:40px;
}
#replacement04 .box .h3{
margin-bottom:0;
padding:5px;
background-color:#005e99;
}
#replacement04 .box .inner{
padding:40px;
background-color:#f5f5f5;
}
#replacement04 .box .boxinner{
margin-top:25px;
padding:30px 20px;
background-color:#fff;
border-radius:5px;
}
#replacement04 .box .boxinner h4{
margin-bottom:15px;
}
#replacement04 .box .boxinner h4 span{
display: inline-block;
vertical-align: middle;
font-weight: bold;
line-height: 1;
}
#replacement04 .box .boxinner h4 span.icon{
width: 23px;
margin-right: 10px;
}
#replacement04 .box .boxinner h4 span:nth-child(2){
padding-top:3px;
}
.replacement04_03 .btn{
margin:20px auto 0;
}
#replacement04 .bottom{
margin-top:30px;
}
.pre-confirm .bgGray{
padding:40px 40px 80px;
border-top:10px solid #2a93d4;
}
.pre-confirm h2{
margin-bottom:20px;
}
.pre-confirm .num{
width:40px;
height:40px;
margin:30px auto 20px;
padding:10px;
text-align: center;
color:#fff;
background-color:#005e99;
border-radius:5px;
line-height: 1;
}
.pre-confirm .h3{
color:#005e99;
}
.pre-confirm .upper{
position: relative;
padding-bottom:20px;
}
.pre-confirm .upper .img{
max-width:890px ;
width:74.5%;
}
.pre-confirm .upper .right{
max-width:250px;
width:22%;
}
.pre-confirm .upper .right .bgWhite{
max-width:250px ;
margin-top:10%;
margin-right:10px;
padding:20px 0px;
border-radius:10px;
}
.pre-confirm .upper .right .bgWhite .inner{
max-width: 180px;
width:90%;
margin:auto;
}
.pre-confirm .lower{
max-width: 1150px;
width:100%;
margin:auto;
}
.pre-confirm .lower .col4 li{
max-width: 268px;
} #mainImage.repair{
padding:140px 0;
}
#mainImage.repair h1{
max-width: 789px;
width:90%;
margin:auto;
}
#repair01{
padding:70px 0 140px;
background:url(//test.shiraiauto-glass.com/wp-content/themes/gracebody/images/repair/bg01.jpg) no-repeat center bottom;
background-size:cover;
}
#repair01 h2{
margin-bottom:35px;
}
#repair01 .inner{
max-width: 1010px;
width:96%;
margin:auto;
}
#repair01 .box{
margin-bottom:40px;
padding:20px 10px;
}
#repair01 .box .flex{
max-width:850px;
width:100%;
margin:auto;
}
#repair01 .box .flex .img{
max-width: 162px;
width:20%;
}
#repair01 .box .flex .txt{
padding-top:15px;
width:78%;
}
#repair02 .bgWhite,
#repair03 .bgWhite,
#repair04 .bgWhite{
padding:40px;
}
#repair02 .col3 li,
#repair03 .col3 li,
#repair04 .col3 li{
position: relative;
}
#repair02 .col3{
margin-top:20px;
}
#repair02 .col3 li{
background-color:#f5f5f5;
}
#repair02 .col3 li h3{
padding:10px;
background-color:#005e99;
line-height: 1;
}
#repair02 .col3 li .bottom{
padding:15px 20px;
}
#repair03 .bgImg{
background:url(//test.shiraiauto-glass.com/wp-content/themes/gracebody/images/repair/bg03.jpg) no-repeat center;
background-size:cover;
}
.num3.col3 li h3{
position:relative;
top:-30px;
max-width:350px;
width:94%;
height:auto;
margin:0 auto -30px;
padding:5px 5px 10px;
text-align: center;
color:#005e99;
background-color:#fff;
}
#repair03 .bgF5{
padding:35px 10px;
}
#repair03 .bgF5 .inner{
max-width: 890px;
width:100%;
margin:auto;
}
#repair03 .bgF5 .inner p{
display: inline-block;
vertical-align: middle;
line-height: 1.3;
}
#repair03 .bgF5 .inner p.icon{
max-width:57px;
width:10%;
margin-right:1%;
}
#repair03 .bgF5 .inner p.txt{
width:88%;
}
#repair04 .bgImg{
position:relative;
padding-top:300px;
}
#repair04 .bgImg:before{
content:'';
position:absolute;
top:0;
width:100%;
max-height:568px;
padding-top:35%;
background:url(//test.shiraiauto-glass.com/wp-content/themes/gracebody/images/repair/bg04.jpg) no-repeat center;
background-size:cover;
}
#repair04 .col3 li{
margin-bottom:60px;
background:url(//test.shiraiauto-glass.com/wp-content/themes/gracebody/images/common/frame01.png) no-repeat 100% 100%;
}
#repair04 .col3 li h3{
position: relative;
padding:10px 10px 10px 80px;
color:#005e99;
background-color:#f5f5f5;
}
#repair04 .col3 li h3 span{
display: block;
}
#repair04 .col3 li h3 span.num{
position:absolute;
top:-20px;
left:20px;
width:50px;
height:50px;
padding-top:10px;
text-align: center;
color:#fff;
font-size: 30px;
font-weight: bold;
background-color:#005e99;
line-height: 1;
}
#repair04 .col3 li p{
min-height:300px;
padding:25px 0 0;
} #insulation01{
padding:70px 0 140px;
background:url(//test.shiraiauto-glass.com/wp-content/themes/gracebody/images/insulation/bg01.jpg) no-repeat center bottom;
background-size:cover;
}
#insulation02 .titArea{
background:url(//test.shiraiauto-glass.com/wp-content/themes/gracebody/images/insulation/bg02tit.jpg) no-repeat center;
background-size: cover;
}
.insulated-glass .cont02{
margin-top:0;
}
.insulated-glass .cont02 .upper ul{
margin:10px 0;
}
.insulated-glass .cont02 .upper:before{
background:url(//test.shiraiauto-glass.com/wp-content/themes/gracebody/images/insulation/insulation02_01.jpg) no-repeat center;
background-size: cover;
}
.insulated-glass .cont02 .lower:before{
background:url(//test.shiraiauto-glass.com/wp-content/themes/gracebody/images/insulation/insulation02_02.jpg) no-repeat center;
background-size: cover;
}
#insulation03 .bgWhite{
padding:40px 50px;
}
#insulation03 .bgWhite h3{
margin-bottom:20px;
}
.glass-maker{
margin-top:30px;
}
.glass-maker .box{
max-width: 560px;
width:49%;
margin-bottom:40px;
border:1px solid #e2e2e2;
}
.glass-maker .box h4.h3{
margin-bottom:0;
padding:10px;
text-align: center;
color:#005e99;
background-color:#f5f5f5;
border-bottom:1px solid #e2e2e2;
}
.glass-maker .box .boxinner{
padding:30px 35px 35px;
background-color:#fff;
}
.glass-maker .box .boxinner h5{
margin-top:25px;
margin-bottom:10px;
font-weight:bold;
color:#005e99;
} #service01 h2{
margin-bottom:35px;
}
#service01 li{
max-width: 390px;
margin-bottom:60px;
}
#service02 h2 span{
display: block;
line-height:1.3;
}
#service02 .bgF5{
position: relative;
padding-top:50px;
}
#service02 .bgF5:before{
content:'';
position:absolute;
top:0;
left:0;
width:100%;
height:610px;
}
.service02_01.bgF5:before{
background:url(//test.shiraiauto-glass.com/wp-content/themes/gracebody/images/service/bg02_01.jpg) no-repeat center;
background-size: cover;
}
.service02_02.bgF5:before{
background:url(//test.shiraiauto-glass.com/wp-content/themes/gracebody/images/service/bg02_02.jpg) no-repeat center;
background-size: cover;
}
#service02 .upper.bgWhite{
float:right;
max-width: 960px;
width:100%;
margin-bottom:100px;
padding:40px 50px;
}
#service02 .upper.bgWhite h3{
margin-bottom:20px;
color:#005e99;
line-height:1.5;
}
#service02 .lower.bgWhite{
width:100%;
padding:40px 40px 50px;
}
#service02 .lower.bgWhite h4{
margin-bottom:20px;
text-align:center;
font-weight:bold;
color:#005e99;
}
#service02 .lower.bgWhite .lower2{
margin-top:50px;
} #insurance01{
padding:70px 0 180px;
background: url(//test.shiraiauto-glass.com/wp-content/themes/gracebody/images/insurance/bg01.jpg) no-repeat center bottom;
background-size: cover;
}
#insurance02 .point{
position: relative;
max-width:1020px;
width:100%;
margin:0 auto 40px;
}
#insurance02 .point .icon{
max-width: 198px;
width:20%;
}
#insurance02 .point .right{
position: absolute;
right:0;
bottom:0;
max-width: 810px;
width:79%;
}
#insurance02 .point .right .arrow{
max-width: 216px;
}
#insurance02 .insurance02_03 .point .right .arrow{
max-width: 256px;
}
#insurance02 .point .right .box{
width:100%;
padding:30px;
background-color:#ebeff3;
border-radius:5px;
}
#insurance02 .point .right .box .fs30{
text-align: center;
}
#insurance02 .inner{
max-width: 1280px;
width:100%;
margin:auto;
}
#insurance02 .box{
position: relative;
}
#insurance02 .box .left{
position:relative;
width: 620px;
z-index:2;
}
#insurance02 .box .right{
position:relative;
top:-500px;
width: 720px;
margin-left:560px;
margin-bottom:-450px;
padding:45px 50px 50px 100px;
z-index:1;
}
.insurance02_01_01,
.insurance02_01_02{
margin-top:100px;
}
#insurance02 .insurance02_01_02 .box .right{
top:-600px;
margin-bottom:-550px;
}
#insurance02 .insurance02_02{
margin-top:100px;
}
#insurance02 .insurance02_02 .box .right{
top:-600px;
margin-bottom:-500px;
}
#insurance02 .insurance02_03{
margin-top:60px;
}
#insurance02 .insurance02_03 .bgYl{
margin-bottom:40px;
padding:40px;
}
#insurance02 .insurance02_03 .bgYl h4{
position: relative;
max-width: 800px;
width:100%;
margin:20px auto 50px;
padding:10px;
}
#insurance02 .insurance02_03 .bgYl h4:before{
content:'';
position: absolute;
top:0;
left:0;
width:65px;
height:65px;
background:url(//test.shiraiauto-glass.com/wp-content/themes/gracebody/images/insurance/bg02_03L.png) no-repeat;
background-size: 100%;
}
#insurance02 .insurance02_03 .bgYl h4:after{
content:'';
position: absolute;
bottom:0;
right:0;
width:65px;
height:65px;
background:url(//test.shiraiauto-glass.com/wp-content/themes/gracebody/images/insurance/bg02_03R.png) no-repeat;
background-size: 100%;
}
#insurance02 .insurance02_03 .point{
margin-bottom:0;
}
#insurance02 .insurance02_03 .point .right{
position: relative;
}
#insurance02 .insurance02_03 .point .right .box{
padding:30px 0;
}
#insurance02 .insurance02_03 .point .right .box ul{
max-width: 740px;
width:fit-content;
margin:auto;
}
#insurance02 .insurance02_03 .point .right .box li{
margin-bottom:20px;
list-style-position: outside;
}
#insurance02 .insurance02_03 .point .right .box li p{
display: inline-block;
line-height: 1.3;
}
#insurance02 .insurance02_03 .point .right .box li:nth-child(4){
margin-bottom:0;
}
#insurance02 .insurance02_03 .point .right .box li:nth-child(4) p{
vertical-align: top;
padding-top:5px;
}
#insurance02 .insurance02_03 .point .right .box li:before{
content:'';
display: inline-block;
width:39px;
height:34px;
margin-right:8px;
background:url(//test.shiraiauto-glass.com/wp-content/themes/gracebody/images/icon/iconCheck01.png) no-repeat;
background-size:100%;
}
#insurance02 .insurance02_03 .point .right .box li span{
display: inline-block;
}
#insurance03{
position: relative;
padding-bottom:90px;
}
#insurance03:before{
content:'';
position: absolute;
bottom:0;
width:100%;
height:50%;
background:url(//test.shiraiauto-glass.com/wp-content/themes/gracebody/images/insurance/bg03.jpg) no-repeat center;
background-size:cover;
}
#insurance03 .bgWhite{
padding:40px;
}
#insurance03 .bgWhite h2{
margin-bottom:30px;
}
#insurance03 .bgF5{
padding:30px 10px;
text-align: center;
}
#insurance04 .h2tit{
height:auto;
margin-bottom:60px;
padding-bottom:40px;
}
#insurance04 .h2tit .icon{
max-width: 36px;
margin:10px auto 20px;
}
#insurance04 .box{
position: relative;
margin-bottom:50px;
padding:50px 40px 40px;
}
#insurance04 .box .num{
position:absolute;
top:-15px;
left:0;
right:0;
width:150px;
padding:10px;
margin:auto;
text-align: center;
background-color:#fff000;
line-height:1;
}
#insurance04 .box h3{
margin-bottom:30px;
}
#insurance04 .h2tit .textC p.fs15 {
text-align: center;
}
.insurance04_02 .bgWhite{
margin-top:40px;
padding:30px 40px;
}
.insurance04_02 .bgWhite h4{
margin-bottom:15px;
}
#insurance05{
position:relative;
padding-top:300px;
}
#insurance05:before{
content:'';
position:absolute;
top:0;
left:0;
width:100%;
height:550px;
background:url(//test.shiraiauto-glass.com/wp-content/themes/gracebody/images/insurance/bg05.jpg) no-repeat center top;
background-size:cover;
}
#insurance05 .bgWhite{
padding:60px 10px 80px;
text-align: center;
border-radius:10px 10px 0 0;
} #aming02{
position: relative;
background-color:#f5f5f5;
}
#aming02:before{
content:'';
position:absolute;
top:0;
left:0;
width:100%;
height:230px;
background-color:#ebeff3;
}
#aming02 .bgWhite,
#aming03 .bgWhite,
#aming04 .bgWhite{
padding:40px 40px 60px;
}
#aming02 .bgWhite h3,
#aming03 .bgWhite h3,
#aming04 .bgWhite h3{
margin-bottom:20px;
}
.aming02_01,
.aming02_02,
.aming03_01,
.aming03_02 {
margin-bottom:50px;
}
#aming02 .bgGray,
.aming03_02 .bgGray,
#aming04 .bgGray{
padding:40px;
border-radius:10px;
}
#aming02 .bgGray img,
.aming03_02 .bgGray img,
#aming04 .bgGray img{
margin-bottom:10px;
}
.aming03_01 .col3 li{
max-width: 357px;
margin-bottom:10px;
}
#aming04{
position: relative;
background-color:#f5f5f5;
}
#aming04:before{
content:'';
position: absolute;
top:0;
left:0;
width:100%;
height:320px;
background:url(//test.shiraiauto-glass.com/wp-content/themes/gracebody/images/aming/bg04.jpg) no-repeat center;
background-size: cover;
}
#aming04 h2{
margin-bottom:60px;
}
#aming04 .bgGray h4{
margin-bottom:20px;
}
.aming04_01{
margin:30px 0;
}
.aming04_01 li{
margin-bottom:30px;
}
#aming05{
position: relative;
padding-top:80px;
padding-bottom:70px;
}
#aming05:before{
content:'';
position: absolute;
top:0;
left:0;
width:100%;
height:620px;
background:url(//test.shiraiauto-glass.com/wp-content/themes/gracebody/images/aming/bg05.jpg) no-repeat center;
background-size: cover;
}
#aming05 .bgWhite{
width:690px;
margin-left:590px;
padding:50px 0 70px;
box-shadow: 2px 2px 2px #f2f2f2;
}
#aming05 .bgWhite .inner{
max-width: 600px;
width:96%;
margin:auto;
}
#aming05 .bgWhite h2{
margin-bottom:20px;
}
#aming05 .bgWhite h3{
margin-bottom:40px;
padding:20px 40px;
border-top:1px solid #005e99;
border-bottom:1px solid #005e99;
} #aboutus01.cont01 .upper{
margin-bottom:60px;
}
#aboutus02 .bgWhite{
margin-bottom:80px;
padding:40px;
}
#aboutus02 .bgWhite table{
width:100%;
border-top:1px solid #ccc;
border-left:1px solid #ccc;
}
#aboutus02 .bgWhite table th,
#aboutus02 .bgWhite table td{
border-right:1px solid #ccc;
border-bottom:1px solid #ccc;
}
#aboutus02 .bgWhite table th{
width:25%;
padding:10px 20px;
text-align: left;
background-color:#ebeff3;
}
#aboutus02 .bgWhite table td{
width:75%;
padding:10px 20px;
}
#aboutus03 .bgWhite{
padding:40px;
}
#aboutus03 h4.h2.bold {
text-align: center;
}
#aboutus03 .titArea{
padding:20px 0 30px;
} #inquiry{
padding-bottom:100px;
}
#inquiry .bgWhite{
padding:40px;
}
#inquiry .telArea{
max-width: 240px;
width:100%;
margin: 25px auto 40px;
}
#inquiry .telArea .icon{
width:16px;
margin-right: 5px;
padding-top:5px;
}
#inquiry .telArea .tel{
padding-top:5px;
font-size: 27px;
font-weight: bold;
line-height: 1;
}
#inquiry .telArea .txt{
padding-left:5px;
line-height: 1.2;
}
#inquiry .pre-confirm{
margin-top:30px;
}
#inquiryForm{
width:100%;
max-width: 1000px;
margin:80px auto 40px;
font-size:16px;
border-top:1px solid #d2d2d2;
}
#inquiryForm th{
width:30%;
padding:15px;
font-weight: bold;
text-align: left;
border-bottom:1px solid #d2d2d2;
}
#inquiryForm th span.red{
display: inline-block;
margin-left:8px;
}
#inquiryForm tr:last-child th{
vertical-align: top;
}
#inquiryForm td{
width:70%;
padding:15px 30px;
border-bottom:1px solid #d2d2d2;
}
#inquiryForm td.select span{
display: inline-block;
margin-right: 10px;
}
.mw_wp_form .horizontal-item + .horizontal-item{
margin-left:0 !important;
}
#inquiryForm .w80{
width:80%;
padding:5px;
background: #f4f4f4;
}
#inquiryForm .w80::-webkit-input-placeholder {
color: #b2b2b2;
font-weight: normal;
}
#inquiryForm .w80:-ms-input-placeholder {
color: #b2b2b2;
font-weight: normal;
}
#inquiryForm .w80::-moz-placeholder {
color: #b2b2b2;
font-weight: normal;
}
.mwform-tel-field input[type="text"], .mwform-zip-field input[type="text"]{
background: #f4f4f4;
}
#inquiryForm input[type="file"]{
font-size:95%;
}
span.mwform-tel-field input[name="tel[data][0]"],
span.mwform-tel-field input[name="fax[data][0]"]{
width:15%;
padding:5px;
background: #f4f4f4;
}
span.mwform-tel-field input[name="tel[data][1]"],
span.mwform-tel-field input[name="fax[data][1]"]{
width:20%;
padding:5px;
background: #f4f4f4;
}
span.mwform-tel-field input[name="tel[data][2]"],
span.mwform-tel-field input[name="fax[data][2]"]{
width:20%;
padding:5px;
background: #f4f4f4;
}
.checkPolicy{
text-align: center;
margin-bottom:30px;
}
.checkPolicy a{
color:#000;
text-decoration:underline;
}
.checkPolicy input{
margin-right: 10px;
}
input.btnConfirm{
width:200px;
margin:auto;
padding:15px 0;
font-size: 16px;
color:#fff;
background:#b49a61 url(//test.shiraiauto-glass.com/wp-content/themes/gracebody/images/btn/arrow01.png) no-repeat 85% 49%;
text-align:center;
font-weight:bold;
cursor:pointer;
box-shadow:2px 2px 2px rgba(0,0,0,0.4);
border:none;
border-radius:10px;
line-height: 1;
}
input.btn_contact_return{
margin:0 10px;
}
#inquiry .checkPolicy{
margin-bottom: 30px;
}
#inquiry .checkPolicy a{
color:#da1313;
text-decoration: underline;
}
input.btn_contact_return{
margin:0 10px;
}
.checkPolicy label .mwform-checkbox-field-text{
display:none;
}
.mwform-checkbox-field input, .mwform-radio-field input{
display: inline-block;
}
.checkPolicy .mwform-checkbox-field{
display: inline-block;
}
.mw_wp_form .error{
display: inline-block;
}
.checkPolicy .textLink{
display: inline-block;
}
.mw_wp_form_confirm .checkPolicy{
display:none;
}
.mw-wp-form_image img{
width:40%;
} #privacy .bgWhite{
padding:40px;
} #topCase.page{
position: relative;
padding:40px 0 80px;
background-color:#fff;
}
#topCase.page:before{
content:'';
position:absolute;
top:0;
left:0;
width:100%;
height:200px;
background-color:#ebeff3;
}
#topCase.page .titArea{
margin-bottom:40px;
}
#topCase .titArea .contentWrp h2 {
text-align: center;
}
#topCase .menu{
max-width: 1070px;
width:100%;
margin: auto;
}
#topCase .bx-wrapper {
}
#topCase .bx-viewport {
height: auto !important;
margin: auto;
}
#topCase .bx-wrapper .bx-controls-direction a {
position: absolute;
top: 40%;
margin-top: -16px;
outline: 0;
width: 56px;
height: 56px;
text-indent: -9999px;
z-index: 8;
}
#topCase .bx-wrapper .bx-prev {
left: -30px;
background: url(//test.shiraiauto-glass.com/wp-content/themes/gracebody/images/main/top/prev.png) no-repeat;
}
#topCase .bx-wrapper .bx-next {
right: -30px;
background: url(//test.shiraiauto-glass.com/wp-content/themes/gracebody/images/main/top/next.png) no-repeat;
}
#topCase.case .archivePost{
position: relative;
margin:inherit;
}
.topCaseS{ display: none; }
#topCase .btn1{
margin:auto;
} #case .topArea{
padding:70px 0 140px;
background:url(//test.shiraiauto-glass.com/wp-content/themes/gracebody/images/works/bg01.jpg) no-repeat center;
background-size:cover;
}
#case .topArea h2{
margin-bottom:20px;
}
#menuArea .h2tit{
height:230px;
}
#menuArea .h2tit .contentWrp p.fs16 {
text-align: center;
}
#menuArea .bgWhite{
padding:40px 40px 0;
}
#menuArea h3{
margin-bottom:25px;
}
#menuArea .case_type .menu{
max-width: 1080px;
width:98%;
margin:auto;
}
.case  .menu .col3 li{
max-width:390px;
margin-right:1.3%;
margin-bottom:15px;
display: -webkit-flex;
display: flex;
-webkit-justify-content: space-between;
justify-content: space-between;
}
.case  .menu .col3 li:nth-child(3n){
margin-right:0;
}
.case  .menu .col4 li{
max-width: 230px;
width:24%;
}
.case .menu li.btn{
color:#005e99;
background-color:#fff;
background-image:url(//test.shiraiauto-glass.com/wp-content/themes/gracebody/images/btn/arrow03.png);
background-repeat:no-repeat;
border:1px solid #ccc;
}
.case .menu .col3 li.btn{
padding:15px 50px 15px 20px;
background-position:97% 50%;
}
.case .menu .col4 li.btn{
padding:15px 20px;
background-position:85% 50%;
}
.case .menu li.btn:hover{
color:#fff;
background-color:#005e99;
background-image:url(//test.shiraiauto-glass.com/wp-content/themes/gracebody/images/btn/arrow04.png);
background-repeat:no-repeat;
transition: .3s;
}
.case.inner{
max-width: 1500px;
width:98%;
margin:25px auto 0;
}
#case_list{
position: relative;
padding:40px 0 80px;
background-color:#fff;
}
#case_list:before{
content:'';
position: absolute;
top:0;
left: 0;
width:100%;
height:200px;
background-color:#ebeff3;
}
#case_list .titArea .contentWrp h2 {
text-align: center;
}
.list.case .archivePost{
position: relative;
width:19%;
margin:0 0.5% 40px;
}
.case .archivePost a{
position: absolute;
top:0;
left:0;
width:100%;
height: 100%;
}
.case .archivePost .img{
margin-bottom:8px
}
.case .archiveContents .sort{
margin-bottom:5px;
}
.case .archiveContents .sort span{
display:inline-block;
}
.case .archiveContents .sort span,
#case-detail .sort span{
display:inline-block;
margin-right: 3px;
margin-bottom:3px;
padding:5px 9px;
font-size: 12px;
color:#fff;
background: #005e99;
border-radius: 5px;
line-height: 1;
}
.archiveContents .title{
}
.archiveContents table{
width:100%;
}
.archiveContents table tr{
border-bottom:1px solid #ccc;
}
.archiveContents table th,
.archiveContents table td{
padding:5px 0;
}
.archiveContents table th{
width:60px;
}
.archiveContents table td{
width:auto;
} .detail #casetop{
position:relative;
padding:60px 0 80px;
}
.detail #casetop:before{
content:'';
position:absolute;
top:0;
left:0;
width:100%;
height:230px;
background-color: #ebeff3;
}
.detail #casetop .bgWhite{
padding:40px;
}
.detail #casetop .inner{
max-width:700px;
width:100%;
margin:auto;
}
.detail #casetop .upper{
margin-bottom:18px;
}
.detail #casetop .date{
margin-right:10px;
} #case-detail #casetop .lower > div{
margin-right:15px;
margin-bottom:40px;
padding:5px 10px 5px 0;
border-top:1px solid #ccc;
border-bottom:1px solid #ccc;
}
#case-detail_flow{
margin-bottom:40px
}
#case-detail .flow .box {
position: relative;
width:100%;
margin: 0 auto 20px;
padding: 20px;
background: #f5f5f5;
}
#case-detail .flow .box:before{
content:none;
}
#case-detail .flow .box:last-child{
margin-bottom:0;
}
#case-detail .flow .box .img{
width: 400px;
}
#case-detail .flow .box .right {
width: 530px;
}
#case-detail .flow .box .right h3{
margin-bottom:10px;
}
#case-detail .btn{
max-width: 254px;
width:40%;
margin:auto;
} #news.pagetop{
padding-top:20px;
}
.news li .datecate{
margin-bottom:10px;
}
.datecate p{
display: inline-block;
vertical-align: middle;
line-height: 1;
}
.news .cate span{
display: inline-block;
width:auto;
padding:2px 10px;
font-size: 12px;
color:#fff;
text-align: center;
background-color:#005e99;
border-radius: 3px;
line-height: 1.2;
}
.news #mainLeft{
max-width:960px;
width:75%;
}
#news_list li{
margin-bottom:25px;
padding-bottom:25px;
border-bottom:1px solid #bcbcbc;
}
#news_list li .img{
width:250px;
width:26.2%;
margin-right: 1%;
}
#news_list li .right{
max-width:690px;
width:72%;
}
#news_list li .right h3{
margin-bottom:15px;
padding-bottom:5px;
border-bottom:1px solid #000;
}
#news-detail .datecate{
max-width: 225px;
width: 100%;
margin:0 auto 40px;
}
#news-detail .inner{
max-width: 700px;
width:96%;
margin:auto;
} .news #sidebar{
max-width:260px;
width:23%;
}
.news #sidebar .box{
padding:15px;
}
.news #sidebar h2{
}
.news #sidebar li{
padding:15px 18px;
border-bottom: 1px dotted #7b7b7b;
}
.news #sidebar li a{
text-decoration:underline;
}
.news .sp{display: none;} .pager::before, .pager::after {
content: " ";
display: table;
}
.pager::after {
clear: both;
}
.pager::before, .pager::after {
content: " ";
display: table;
}
.pager {
position: relative;
color:#fff;
}
.pager.bottomPager{
padding-top:20px;
}
.pager span.pageNumber{
display: inline-block;
vertical-align: top;
margin-right:5px;
padding-top:8px;
}
.pager div.pager_num {
display:inline-block;
text-align:center;
margin:0 auto;
}
.pager .pager_num span,
.pager .pager_num a {
position: relative;
display: block;
float:left;
width:28px;
height: 28px;
text-align: center;
margin:0 5px;
padding-top: 0px;
color:#000;
background:#fff;
border:1px solid #e0e0e0;
border-radius:20px;
}
.pager .pager_num a.next,
.pager .pager_num a.prev{
}
.pager .pager_num span.current,
.pager .pager_num a:hover{
color:#fff;
background: #005e99;
opacity: 1;
} .pagenavi{
max-width: 750px;
width:96%;
margin:auto;
}
.pagenavi .left,
.pagenavi .right{
position: relative;
width:auto;
padding-top:8px;
}
.pagenavi .left span{
display: inline-block;
vertical-align: middle;
}
.pagenavi .left span.arrow,
.pagenavi .right span.arrow{
width:25px;
height: 25px;
padding-top:3px;
text-align: center;
border: 1px solid #000;
line-height: 1;
}
.pagenavi .left span.arrow{
margin-right:10px;
}
.pagenavi .left span.txt,
.pagenavi .right span.txt{
}
.pagenavi .right span{
display: inline-block;
vertical-align: middle;
}
.pagenavi .right span.arrow{
margin-left:10px;
}
.pagenavi .left a,
.pagenavi .right a{
position: absolute;
top:0;
left:0;
width:100%;
height: 100%;
}
.pagenavi p{
width: calc(100%/3);
}
.pagenavi .btn{
max-width: 254px;
margin:auto;
}
.pagenavi .btn3{
width:250px;
background-position: 90% 45%;
}  .freeeditor h1 {
text-align: left;
font-size: 140%;
font-weight: bold;
border-bottom: 3px solid #e8e7e3;
padding-bottom: 5px;
margin-bottom: 20px;
}
.freeeditor h2 {
text-align: left;
border: none;
font-size: 130%;
font-weight: bold;
border-bottom: 2px solid #e8e7e3;
padding-left: 0;
padding-bottom: 5px;
margin-bottom: 20px;
}
.freeeditor h3 {
text-align: left;
font-size: 120%;
font-weight: bold;
border-bottom: 1px solid #e8e7e3;
padding-bottom: 5px;
margin-bottom: 10px;
}
.freeeditor h4 {
text-align: left;
font-size: 110%;
font-weight: bold;
margin-bottom: 10px;
}
.freeeditor h5 {
text-align: left;
font-weight: bold;
margin-bottom: 10px;
}
.freeeditor strong {
font-weight: bold;
}
.freeeditor img.alignright { display: block; margin: 0 0 0 auto; } .freeeditor img.alignleft { display: block; margin: 0 auto 0 0; } .freeeditor img.aligncenter { display: block; margin: 0 auto; } .freeeditor img{
max-width: 700px;
height: auto;
} #business-trip{
background:url(//test.shiraiauto-glass.com/wp-content/themes/gracebody/images/footer/bgTrip.png) no-repeat center;
background-size:cover;
}
#business-trip .flex > div{
max-width:610px;
width:48%;
}
.support .titArea {
position: relative;
height: 200px;
padding-top: 40px;
}
.support .bgImg{
position:relative;
background:url(//test.shiraiauto-glass.com/wp-content/themes/gracebody/images/support/bg.jpg) no-repeat center;
background-size:cover;
}
.support ul {
max-width: 1110px;
width:100%;
margin: auto;
}
.support li{
max-width:260px;
width:24%;
margin-bottom:20px;
padding:10px;
background-color:#fff;
border:1px solid #ccc;
}
.support li .img{
margin-bottom:10px;
}
.support li h3{
margin-bottom: 5px;
}
.accessmap h2{
margin-bottom: 20px;
}
.accessmap .bgGray{
padding:45px 0 30px;
}
.accessmap .inner{
max-width: 1510px;
width:96%;
margin:auto;
}
.accessmap li:nth-child(1) .info,
.accessmap li:nth-child(3) .info{
max-width: 330px;
width:100%;
margin:10px auto 0;
}
.accessmap li:nth-child(2) .info{
max-width: 360px;
width:100%;
margin:10px auto 0;
}
#ftContact{
position: relative;
}
#ftContact .inner{
max-width: 1280px;
width:100%;
margin:auto;
}
#ftContact .photo{
display: none;
}
#ftContact:before{
content:'';
position: absolute;
top:0;
left:0;
width:50%;
height: 100%;
background: url(//test.shiraiauto-glass.com/wp-content/themes/gracebody/images/footer/bgContact.jpg) no-repeat center;
background-size: cover;
z-index:1;
}
#ftContact .right{
position: relative;
top:60px;
max-width: 670px;
width:100%;
margin-left:560px;
padding:70px 40px;
color:#fff;
background:url(//test.shiraiauto-glass.com/wp-content/themes/gracebody/images/footer/bgContactR.png) no-repeat center;
background-size:cover;
z-index:2;
}
#ftContact .right h2{
margin-bottom:15px;
}
#ftContact .contact{
max-width: 540px;
width:100%;
}
#ftContact .telArea{
max-width: 295px;
width:56%;
padding:10px 20px;
color:#000;
background-color:#fff;
border-radius:3px;
}
#ftContact .telArea .icon{
width:16px;
}
#ftContact .telArea .tel {
font-weight: bold;
color: #000;
}
#ftContact .telArea .tel a{
color:#000;
}
#ftContact .telArea .open{
margin-top:5px;
}
#ftContact .mail{
max-width: 206px;
width:40%;
}
#footer{
background-color:#efefef;
}
#footer section{
padding-bottom:20px;
}
#footer a {
}
#footer a:hover{
}
#footer .sitemap h2{
margin-bottom:20px;
border-bottom:1px solid #024d8a;
text-align: center; 
}
#footer .sitemap ul{
max-width:940px;
width:100%;
margin:auto;
}
#footer .sitemap ul li{
width:12.5%;
text-align: center;
}
#footer .bgWhite{
max-width: 1180px;
width:100%;
margin:40px auto 20px;
padding:50px 40px 70px;
border-radius:5px;
}
#footer .logo{
max-width: 199px;
width:100%;
margin:0 auto 60px;
}
#footer .bgWhite .company h3{
position: relative;
height: 30px;
border-top:1px solid #005e99; 
}
#footer .bgWhite .company h3 span{
display: inline-block;
position: absolute;
top:-18px;
left:0;
right:0;
width:130px;
margin:auto;
padding:0 10px;
text-align:center;
background-color:#fff;
}
#footer .bgWhite .company .address{
margin-bottom:5px;
text-align: center;
}
#footer .bgWhite .company .tel{
text-align: center;
}
#footer .glassMaker h3{
margin-bottom:50px;
}
#footer .glassMaker .listS{
display: none;
}
#footer .glassMaker li{
padding:0 5px;
}
#footer .glassMaker li:nth-child(1){
max-width: 206px;
}
#footer .glassMaker li:nth-child(2){
max-width: 230px;
}
#footer .glassMaker li:nth-child(3){
max-width: 275px;
}
#footer .glassMaker li:nth-child(4){
max-width: 322px;
}
#footer .copyright {
font-size: 12px;
text-align: right;
}
.footer-contact {
background-image: url(//test.shiraiauto-glass.com/wp-content/themes/gracebody/images/footer/footer-contact-bg.jpg);
background-position: left;
background-repeat: no-repeat;
margin: 100px 0 40px;
padding: 0;
}
.footer-contact-wrap {
background-color: #002f6e;
padding: 70px 40px;
width: 58%;
margin-left: auto;
margin-top: -50px;
}
.footer-contact-wrap h2 {
color: #fff;
font-size: 24px;
font-weight: bold;
margin-bottom: 40px;
}
.footer-contact-wrap > p {
font-size: 14px;
color: #fff;
margin-bottom: 70px;
}
.footer-contact-wrap .telArea {
background-color: #fff;
border-radius: 2px;
width: 55%;
padding: 2% 3%;
}
.footer-contact-wrap .telArea .opentime {
color: #005e99;
font-size: 12px;
}
.footer-contact-wrap .contact {
background-color: #b49a61;
width: 40%;
border-radius: 5px;
padding: 3%;
}
.footer-contact-wrap .contact span {
text-align: center;
} #footer-btn {
display: block;
width: 100%;
left: 0px;
bottom: 0;
z-index: 9;
padding:10px 0;
color:#fff;
background:linear-gradient(90deg,#035392 0%,#004681 100%);
}
#footer-btn .tit{
margin-bottom:5px;
padding-bottom:5px;
text-align:center;
border-bottom:1px solid #fff;
}
.footer-btn-wrapper{
position: relative;
max-width: 900px;
margin:auto;
}
.footer-btn-wrapper .totop{
position: absolute;
top:-40px;
right:-10%;
}
.footer-tel {
margin-left: 15px;
margin-right: 10px;
}
.footer-tel .icon{
max-width: 26px;
padding-top:5px;
margin-right: 10px;
}
.footer-tel .tel{
font-size: 36px;
font-weight: bold;
color: #fff;
line-height: 1;
}
.footer-tel .tel a{
color: #fff;
}
.footer-tel .open{
line-height:1.2;
}
#footer-btn .container{
position: relative;
}
.footer-contact-bnr{
position: absolute;
bottom: 0;
right: 0;    
}
.footer-btn-pc{
align-items: center;
padding: 10px 0 10px;
}
.footer-btn-sp{
display: none;
} .error {
margin: 30px auto;
}
.error h2 {
font-size: 18px;
margin-bottom: 15px;
} #top {
position: relative;
overflow: hidden;
}
.gotop {
position: fixed;
right: 50px;
bottom: 140px;
z-index: 10;
cursor: pointer;
}
.gotop:hover {
opacity:1;
}
@media screen and (-webkit-min-device-pixel-ratio: 0) {
_::-webkit-full-page-media, _:future, :root 
.gotop{
padding-top: 20px;
}
} @media only screen and (min-width: 999px){
.sp,
.mini {
display: none;
}
}
@media only screen and (max-width: 1600px){
#header .logo{
width:15%;
max-width: 199px;
}
.g_naviWrap {
left: 18%;
right: 32%;
max-width: 920px;
width: 50%;
}
#header .telArea{
right:13%;
max-width: 230px;
width:18%;
}
.telArea p.icon{
max-width: 21px;
width:10%;
}
#header .telArea .tel{
font-size: 1.6vw;
}
#header .telArea .opentime{
font-size: 10px;
}
#header .contact.btn{
max-width: 200px;
width:13%;
padding:20px 15px;
}
.topcase{
width:96%;
margin:auto;
}
#topCase .bx-wrapper .bx-prev{
left:-15px;
}
#topCase .bx-wrapper .bx-next{
right:-15px;
}
}
@media only screen and (max-width: 1280px){
.contentWrp{
width:96%;
}
.g_navi li {
font-size: 1vw;
}
#header .telArea .opentime br{
display: block;
} .cont01 .upper,
.cont01 .lower,
#insurance02 .box{
display: flex;
}
.cont01 .upper .img, 
.cont01 .lower .img,
.cont01 .box{
width:50%;
top:0;
margin:0;
background-color: #ebeff3;
}
.cont01 .upper{
margin-bottom:60px;
}
.cont01 .upper .box,
.cont01 .lower .box{
top:0;
margin:0;
padding:40px;
}
#guest01.cont01 .upper .box,
#guest01.cont01 .lower .box{
padding:40px;
}
#guest01.cont01 .lower{
margin-bottom:0;
}
.pre-confirm .upper .right .bgWhite{
margin-right:0;
}
#repair04 .col3 li h3 span.fs20{
font-size: 1.4vw;
}
#insurance02 .box .left,
#insurance02 .box .right,
#insurance02 .insurance02_01_02 .box .right,
#insurance02 .insurance02_02 .box .right{
width:50%;
top:0;
margin:0;
}
#insurance02 .box .right{
padding:40px 40px 50px;
}
#insurance02 .insurance02_01_02 .box{
background-color:#fbfcf3;
}
#insurance02 .insurance02_01_01 .box,
#insurance02 .insurance02_02 .box{
background-color:#fcf3fb;
}
#aming05 .bgWhite{
margin:auto;
} .case .menu .col3.fs16{
font-size: 1.2vw;
}
#case-detail .flow .box .img{
max-width: 400px;
width: 44%;
}
#case-detail .flow .box .right {
max-width: 540px;
width:54%;
} #news_list li .img{
max-width:250px;
width:30%;
margin-right: 2%;
}
#news_list li .right{
max-width:700px;
width:68%;
} #ftContact:before{
width:60%;
}
#ftContact .right{
width:60%;
margin-left:40%;
}
.top-area-wrap dl {
width: 100%;
}
.top-area-wrap dl dt {
font-size: 34px;
}
.top-area-wrap p {
font-size: 34px;
width: 100%;
}
.top-trouble .contentWrp {
width: 90%;
}
.top-trouble h2 {
width: 85%;
}
.top-trouble-wrap {
padding: 40px;
}
.top-trouble-wrap p.top-trouble-point {
width: 35%;
}
}
@media only screen and (max-width: 999px){
.pc,
.mini {
display: none;
}
.btn img,
img{
width:100%;
}
header{
height: 62px;
}
#header .logo{
width:40%;
max-width: 183px;
left:0;
right: 0;
margin:auto;
}
#mv{ }
.mvtit{
position: absolute;
width:70%;
} .g_naviWrap {
display: none;
}
.h2{
font-size: 30px;
}
.h2tit{
height:auto;
padding-bottom:80px;
} .cont01 .upper .box,
.cont01 .lower .box{
top:0;
margin:0;
padding:20px;
}
#repair04 .h2tit{
height:auto;
padding-bottom:40px;
}
#repair04 .bgImg{
padding-top:150px;
}
#repair04 .col3 li{
background-size: 30px;
}
#repair04 .col3 li h3{
padding-left:50px;
}
#repair04 .col3 li h3 span.num{
width:auto;
height:auto;
padding:8px 13px;
font-size: 2.2vw;
left:5px;
}
#repair04 .col3 li p{
min-height: inherit;
padding-bottom:20px;
}
#repair04 .col3 li p.fs16{
font-size: 14px;
}
#insurance02 .point .right .box .fs30{
font-size: 2.8vw;
}  #topCase .menu{
margin:10px auto 0;
}
#topCase .h2tit{
padding-bottom:40px;
}
.topCaseS{ display: block; }
.topCaseS.list.case .archivePost{
width:19%;
}
.case .menu .col3 li{
background-size:6%;
}
.case .menu .col3 li.btn{
padding:15px 40px 15px 10px;
}
#case_maker .flex.imported{
-webkit-justify-content: inherit;
justify-content: inherit;
}
#case_maker .flex.imported li{
width:calc(100%/9);
border-right:none;
}
#case_maker .flex.jpn li{
width:10%;
border-right:none;
}
#case_maker .flex li:last-child{
border-right: 1px solid #cccccc;
}
#case_type li{
font-size: 1.2vw;
} #ftContact .right{
padding:40px 20px;
}
.gotop{
bottom:170px;
} .footer-btn-pc{
display: none;
}
.footer-btn-wrapper .totop{
width:50px;
top:-30px;
right: 1%;
}
.footer-btn-sp{
display: flex;
justify-content: center;
align-items: center;
padding: 16px 0;
background:url(//test.shiraiauto-glass.com/wp-content/themes/images/footer/footer_bg_sp.png);
background-size: cover;
}
.footer-btn-sp p{
margin:10px 1% 0;
}
} @media only screen and (max-width: 817px){
body {
font-size: 13px;
line-height: 1.6;
}
.pt40{ padding-top:20px !important;}
.pt50{ padding-top:25px !important;;}
.pt60,.pt70,.pt80{ padding-top:30px !important;}
.pt100{ padding-top:50px !important;}
.pb40,.pb50{ padding-bottom:25px !important;}
.pb60,.pb70,.pb80{ padding-bottom:30px !important;}
.pb100,.pb120,.pb150{ padding-bottom:50px !important;}
.mb30,.mb40{margin-bottom:20px !important;}
.mb50 { margin-bottom: 25px !important;}
.mb90{margin-bottom:40px !important;}
.mt50{ margin-top:20px !important;}
.fs12{font-size:10px;}
.fs15,.fs16{ font-size: 100%;}
.fs18{ font-size: 15px;}
.fs20{ font-size: 18px;}
.fs24,.fs26,.fs28{ font-size: 20px;}
.fs30{ font-size: 20px;}
.fs36 {font-size:30px;}
.fs38 {font-size:30px;}
.fs40 {font-size:34px;}
.breadcrumb{
font-size:12px;
} section{
padding:20px 0;
}
.h2 {
margin-bottom:15px;
font-size: 26px;
}
.h3 {font-size: 22px;}
.h2tit{
height:auto;
padding-top:30px;
padding-bottom:80px;
}
.t28{ font-size: 24px;}
.t32{ font-size: 28px;}
.breadcrumb {}
#mainImage h1 span{
font-size: 36px;
} .h2-bmcont{
top:-30px;
margin-bottom:-30px;
}
#mv .bx-wrapper .bx-prev, #mv .bx-wrapper .bx-next {
display: none;
}
#topnews .titArea{
width:100%;
max-width:inherit;
display: -webkit-flex;
display: flex;
-webkit-justify-content: space-between;
justify-content: space-between;
}
#topnews .titArea h2{
margin-bottom:25px;
}
#topnews .newsList{
width:100%;
}
#top01 .bgGray{
padding:20px;
}
#top02 li{
width:100%;
margin:0 auto 20px;
padding:40px 10px;
}
#top04 .bgGray{
padding:30px 20px;
}
#top04 .img{
width:100%;
margin:0 auto 20px;
}
#top04 .right{
width:100%;
margin:auto;
}
.top-area-wrap {
margin-top: -30px;
}
.top-ng figure img {
width: 4%;
}
.top-ng p {
width: 100%;
}
.top-caution .top-caution-number {
width: 25%;
}
.top-trouble-check .contentWrp {
padding: 50px 20px;
}
.top-trouble-check .flex:first-of-type figure {
width: 100%;
margin-bottom: 20px;
}
.top-trouble-check ul {
height: auto;
width: 30%;
margin: 0 auto;
}
.footer-contact-wrap {
width: 100%;
padding: 40px;
}
.footer-contact-wrap > p {
margin-bottom: 20px;
}
.col1of2{
width:100%;
margin:0 auto 20px;
}
.cont01 .upper{
margin-top:25px;
margin-bottom: 25px;
}
.cont01 .upper, .cont01 .lower,#insurance02 .box{
display:block;
}
.cont01 .upper .img, .cont01 .lower .img, .cont01 .box{
width:100%;
margin:auto;
}
.cont01 .upper .box, .cont01 .lower .box{
max-width: 620px;
margin:auto;
}
.cont02 .upper .box{
float:none;
}
.cont02 .box{
padding:30px 20px;
}
.cont02 .lower{
padding-bottom:0;
}
.cont02 .upper, .cont02 .lower {
padding: 120px 0 50px;
}
.cont02 .upper:before, .cont02 .lower:before{
height:250px;
}
#guest02.flow .box{
margin-bottom:40px;
}
#guest02.flow .box::before{
border-width:30px;
bottom:-60px;
}
#guest02.flow .box .info{
text-align:center;
}
#guest02.flow .box .info .telArea{
max-width: 210px;
width:100%;
margin:5px auto;
}
#guest02.flow .box .info .mail{
margin:auto;
}
#guest01.cont01 .upper .box,
#guest01.cont01 .lower .box{
padding:20px;
}
#replacement01{
padding:40px 0 60px;
}
#replacement01 h3{
margin-bottom:25px;
}
#replacement04 .bgImg{
padding-bottom:50px;
}
#replacement04 .h2tit{
height: auto;
}
.pre-confirm .bgGray{
padding:30px 20px 40px;
}
#repair01{
padding:30px 0 50px;
}
#repair01 .box .flex .txt{
padding-top:0;
}
#replacement02 .bgWhite,
#replacement04 .bgWhite,
#replacement04 .box .inner,
#repair02 .bgWhite, 
#repair03 .bgWhite,
#insulation03 .bgWhite{
padding:20px 20px 30px;
}
#repair04 .bgWhite{
padding:30px 20px 30px;
}
#repair02 .col3 li .bottom{
padding:10px;
}
#replacement03 .h2tit{
height:auto;
padding-bottom:40px;
}
#replacement04 .box .boxinner{
padding:20px 15px;
}
.reason .box{
padding:50px 20px 30px;
}
.pre-confirm .num{
width:30px;
height:30px;
padding-top:5px;
}
.pre-confirm .upper .img{
width:100%;
margin:auto;
}
.pre-confirm .upper .right{
width:100%;
max-width:200px;
margin:20px auto 0;
}
.pre-confirm .upper .right .bgWhite{
margin:0;
padding:10px 0;
}
.num3.col3 li h3{
top:-20px;
margin-bottom:-20px;
}
.num3.col3 li h3.fs20{
font-size: 16px;
}
#repair04 .h2tit {
padding-bottom: 30px;
}
#repair04 .col3 li{
width:48%;
margin-bottom:40px;
}
#repair04 .col3 li h3{
padding-left:40px;
}
#repair04 .col3 li h3 span.num{
top:-15px;
padding:8px 10px;
}
#repair04 .col3 li h3 span.fs20{
font-size: 2.3vw;
}
#repair04 .col3 li p.fs16{
font-size: 13px;
}
#insulation01{
padding:50px 0;
}
.cont03 h2{
margin-bottom:20px;
}
.glass-maker .box .boxinner{
padding:20px;
background-color:#fff;
}
#service01 li{
margin-bottom:30px;
}
#service02 .bgF5:before{
height:430px;
}
#service02 .h2tit{
padding-bottom:30px;
}
#service02 .upper.bgWhite{
margin-bottom:50px;
padding:20px;
}
#service02 .lower.bgWhite{
padding:20px 20px 30px;
}
#service02 .lower.bgWhite .lower2{
margin-top:20px;
}
#insurance01{
padding:50px 0;
}
#insurance02 .point{
margin-bottom:0;
}
#insurance02 .point .right{
position: relative;
}
#insurance02 .point .right .arrow{
width:45%;
}
.insurance02_01_01, .insurance02_01_02,#insurance02 .insurance02_02 {
margin-top:50px;
}
.insurance02_01_02,
#insurance02 .insurance02_02 .box{
margin-bottom:50px;
}
#insurance02 .box{
max-width: 620px;
margin:auto;
}
#insurance02 .box .left,
#insurance02 .box .right,
#insurance02 .insurance02_01_02 .box .right, 
#insurance02 .insurance02_02 .box .right{
width:100%;
max-width: 620px;
margin:auto;
}
#insurance02 .box .right,
#insurance02 .insurance02_01_02 .box .right, 
#insurance02 .insurance02_02 .box .right{
padding:20px;
}
#insurance02 .insurance02_03{
margin-top:30px;
}
#insurance02 .insurance02_03 .bgYl{
padding:20px;
}
#insurance02 .insurance02_03 .point .right .box li:before{
width:30px;
height:25px;
}
#insurance02 .insurance02_03 .point .right .box ul.fs20{
font-size:2.6vw;
}
#insurance02 .insurance02_03 .bgYl h4:before,
#insurance02 .insurance02_03 .bgYl h4:after{
width:40px;
height:40px;
}
#insurance03{
padding-bottom:40px;
}
#insurance03 .bgWhite{
padding:20px;
}
#insurance04 .box{
padding:40px 20px 20px;
}
#insurance04 .box h3 {
margin-bottom: 20px;
}
.insurance04_02 .bgWhite{
padding:20px 15px;
}
#insurance05{
padding-top:150px;
}
#insurance05:before{
height: 400px;
}
#insurance05 .bgWhite{
padding:30px 15px 40px;
}
#insurance05 .bgWhite .brNone{
display: none;
}
#aboutus01.cont01 .upper{
margin-bottom:20px;
}
#aboutus02 .bgWhite {
margin-bottom: 20px;
padding: 20px;
}
#aboutus03 .bgWhite {
padding: 20px;
}
#aboutus03 .titArea{
padding:0 0 20px;
}
#privacy .bgWhite{
padding:20px;
}
#aming02 .bgWhite, #aming03 .bgWhite, #aming04 .bgWhite{
padding:20px;
}
#aming02 .bgGray, .aming03_02 .bgGray, #aming04 .bgGray{
padding:20px;
}
#aming05{
padding:40px 0 80px;
overflow: hidden;
}
#aming05 .bgWhite{
width:100%;
padding:20px;
} #topCase .h2tit{
padding:20px 0;
}
.topCaseS.list.case .archivePost {
width: 32.3%;
margin: 0 0.5% 20px;
}
#menuArea .h2tit{
height: auto;
}
#menuArea .bgWhite {
padding: 20px 10px 0;
}
.case .menu li.btn{
background-size:15px;
}
.case .menu .col3 li{
width:48%;
}
.case .menu .col3 li,
.case .menu .col3 li:nth-child(3n){
margin:0 1% 10px;
}
.case .menu .col3.fs16{
font-size: 1.6vw;
}
.case .menu .col4.fs16{
font-size:1.6vw;
}
.case .menu .col4 li.btn{
padding:15px 10px;
background-position: 95% 50%;
}
.case .archiveContents .sort span, #case-detail .sort span{
font-size: 10px;
}
#case .topArea{
padding:30px 0 40px;
}
#case_list,
#topCase.page{
padding:20px 0 50px;
}
#case_list:before,
#topCase.page:before{
height:120px;
}
#topCase.page .titArea{
margin-bottom:0;
}
.case.inner{
margin-top:10px;
}
.list.case .archivePost{
width:32.3%;
} .detail #casetop{
padding:20px 0 50px;
}
.detail #casetop:before{
height:120px;
}
.detail #casetop .bgWhite{
padding:20px;
} .news .sp{display: block;}
.news #mainLeft{
width:100%;
}
.news #sidebar{
display: none;
}
#news_list li{
margin-bottom:10px;
}
#news #news_list ul li{
padding:15px 0;
}
.news .datecate{
margin-bottom:8px;
}
.news .datecate .cate span{
font-size: 10px;
}
.archiveList li{
display: inline-block;
margin-right: 10px;
}
#cate_archive h3,
#monthly_archive h3{
margin-bottom:10px;
padding:5px;
font-weight: bold;
color:white;
background:#005e99;
} .pager .pager_num span, .pager .pager_num a{
padding-top:3px;
} #news-detail {
padding-top: 0;
}
#news-detail .inner {
padding: 10px;
}
#news-detail #news-detail_top {
padding-bottom: 0;
} .pagenavi .left, .pagenavi .right{
padding-top:4px;
} .support ul{
max-width: 560px;
width:100%;
margin:auto;
}
.support li{
width:48%;
}
#business-trip .flex > div {
max-width: 610px;
width: 96%;
margin:auto;
}
#business-trip .flex > div.right{
margin-top:20px;
}
#ftContact .img{
display: block;
}
#ftContact:before{
display: none;
}
#ftContact .right{
top:0;
width:100%;
max-width: inherit;
margin:0;
text-align: center;
}
#ftContact .contact{
margin:auto;
}
#ftContact .right{
padding:20px;
}
#footer .sitemap ul li{
width:25%;
margin-bottom:10px;
}
#footer .bgWhite{
margin-top:20px;
padding:30px 20px;
}
#footer .logo{
margin-bottom:30px;
}
#footer .glassMaker h3{
margin-bottom:20px;
}
.footer-btn-sp {
padding: 0 0 10px;
}
.footer-btn-wrapper .totop{
width:40px;
top:-25px;
right: 1%;
} .gotop {
width: 40px;
height: 40px;
right: 10px;
bottom: 160px;
}
@media screen and (-webkit-min-device-pixel-ratio: 0) {
_::-webkit-full-page-media, _:future, :root 
.gotop{
padding-top: 11px;
padding-left:9px;
}
} #inquiryForm{
font-size: 100%;
}
} @media only screen and (max-width: 640px){  #inquiryForm th,
#inquiryForm td {
display: block;
width: 100%;
}
#inquiryForm th{
padding-bottom:0;
border-bottom:none;
}
#inquiryForm .w80{
width:100%;
}
input.btnConfirm{
max-width: 300px;
width:60%;
}  .top-area h2 {
width: 100%;
}
.top-area figure img {
width: 100%;
}
.top-area-wrap {
margin-top: -30px;
}
.top-area-wrap dl dt {
font-size: 24px;
width: 25%;
}
.top-area-wrap dl dd {
font-size: 16px;
width: 70%;
}
.top-area-wrap p {
font-size: 18px;
}
.top-area-wrap p span {
font-size: 30px;
}
.top-trouble .flex figure {
width: 100%;
}
.top-trouble .contentWrp {
padding: 40px 20px 10px;
}
.top-trouble h2 {
width: 100%;
margin-bottom: 30px;
}
.top-trouble-wrap {
padding: 40px 20px;
}
.top-trouble-wrap p.top-trouble-point {
width: 100%;
}
.top-trouble-wrap h3 {
font-size: 22px;
}
.top-trouble-wrap h3 span {
font-size: 28px;
}
.top-ng h2 {
line-height: 1.25;
font-size: 26px;
} 
.top-caution .top-caution-number {
width: 65%;
margin-top: -40px;
}
.top-caution .top-caution-wrap {
padding: 20px;
}
.top-caution h3 {
font-size: 22px;
margin-bottom: 30px;
}
.top-caution .top-caution-wrap .flex figure {
width: 100%;
margin-bottom: 20px;
}
.top-caution .top-caution-wrap .flex p {
width: 100%;
font-size: 16px;
}
.top-trouble-check ul {
width: 100%;
}
.top-trouble-img {
width: 48%;
margin-bottom: 10px;
}
.footer-contact {
background: none;
}
.footer-contact-wrap {
padding: 30px;
}
.footer-contact-wrap h2 {
margin-bottom: 20px;
}
.footer-contact-wrap .telArea {
width: 100%;
margin-bottom: 20px;
padding: 2% 10%;
}
.footer-contact-wrap .contact {
width: 100%;
}
.footer-contact-wrap .contact img {
width: 50%;
}
}
@media only screen and (max-width: 568px){
} @media only screen and (max-width: 414px){
.pb40{padding-bottom:20px !important;}
.pb50,.pb100{padding-bottom: 30px !important;}
.pt30,.pt40{padding-top:20px !important;}
.pt100{padding-top:30px !important;}
.mb20,.mb30{margin-bottom:15px !important;}
.mb60,.mb80,.mb90{margin-bottom:30px !important;}
.mini {
display: block;
}
body{font-size:12px;}
.fs16,.fs18{ font-size: 16px;}
.fs20,.fs22{ font-size: 18px;}
.fs24,.fs26,.fs28{ font-size: 18px;}
.fs30{ font-size: 18px;}
.fs36 {font-size:20px;}
.fs38 {font-size:20px;}
.fs40 {font-size:26px;}
.grayline {
font-size: 19px;
padding: 20px 1%;
margin-bottom: 0;
}
.h2 {font-size: 20px;}
.h3 {font-size: 20px;}
.h2tit{
padding-top:25px;
padding-bottom: 60px;
}
.t28{font-size: 18px;}
.t32{font-size: 22px;}
.btn{ font-size: 10px;}
.btn1 {
width: 130px;
height: 20px;
}
.btn1 span {
padding: 2px;
}
.btn1 span:before{
top:35%;
}
.col3 li {
width: 100%;
margin: 0 auto 15px;
} .drawer-hamburger{
width: 1.5rem;
padding: 0;
padding-top: 13px;
padding-right: .75rem;
padding-bottom: 23px;
padding-left: .75rem;
}
.drawer-nav ul li {
font-size: 16px;
}
header{
height:50px;
}
#header .logo{
top:13px;
}
#mainImage h1 span{
font-size: 26px;
text-shadow:
0 1px 0 #000,
1px 0 0 #000,
0 -1px 0 #000,
-1px 0 0 #000,
-1px -1px 0 #000,
1px -1px 0 #000,
-1px 1px 0 #000,
1px 1px 0 #000;
} #top01 .bgGray {
padding: 20px 10px;
}
#top01 .bgGray:before{
border-width: 20px;
bottom: -40px;
left: 45%;
}
.cont02 .upper, .cont02 .lower{
padding:80px 0 30px;
}
.cont02 .upper:before,
.cont02 .lower:before {
height: 200px;
}
#guest02.flow .box{
margin-bottom:30px;
padding:20px;
}
#guest02.flow .box::before{
left: 45%;
border-width:20px;
bottom:-40px;
}
#replacement02 .bgWhite, #replacement04 .bgWhite, #replacement04 .box .inner, #repair02 .bgWhite, #repair03 .bgWhite, #repair04 .bgWhite {
padding: 20px 10px 30px;
}
#replacement01 .left,
#replacement01 .right{
width:100%;
margin:0 auto 20px;
}
#replacement02 li h3 span.num{
width:25%;
}
#replacement02 li h3 span.txt{
width:75%;
}
.reason .box {
padding: 40px 10px 30px;
}
.reason .box .num{
top:-15px;
padding:5px;
}
.pre-confirm .bgGray{
padding:20px 10px 30px;
}
.pre-confirm .lower .col4 li{
width:48%;
margin:0 0.5% 15px;
}
#repair03 .bgF5{
padding:15px 10px;
}
#repair03 .bgF5 .inner p{
display: block;
}
#repair03 .bgF5 .inner p.icon{
max-width:40px;
width:100%;
margin:0 auto 15px;
}
#repair03 .bgF5 .inner p.txt{
width:100%;
}
.num3.col3 li h3{
top:0;
margin-bottom:0;
padding-top:10px;
}
#repair04 .h2tit{
padding-bottom:20px;
}
#repair04 .col3 li {
width:100%;
margin:0 auto 30px;
background-size: 20px;
}
#repair04 .col3 li h3 span.num{
font-size: 3vw;
}
#repair04 .col3 li h3 span.fs20{
font-size:16px;
}
#insulation03 .bgWhite{
padding-bottom:0;
}
.glass-maker .box{
width:100%;
margin:0 auto 20px;
}
#service02 .h2tit {
padding-bottom: 10px;
}
#service02 .upper.bgWhite{
padding:20px 15px;
}
#service02 .lower.bgWhite{
padding:20px 15px;
}
#insurance02 .point .icon{
width:100%;
max-width:100px;
margin:0 auto 10px;
}
#insurance02 .point .right{
width:100%;
}
#insurance02 .point .right .arrow{
margin:auto;
}
#insurance02 .point .right .box{
padding:15px;
}
#insurance02 .point .right .box .fs30{
font-size: 16px;
}
#insurance02 .insurance02_03 .point .right .box li:before{
width:25px;
height:20px;
}
#insurance02 .insurance02_03 .point .right .box ul.fs20 {
font-size: 3vw;
}
.insurance02_01_02, #insurance02 .insurance02_02 .box{
margin-bottom:20px;
}
#insurance02 .insurance02_03{
margin-top:20px;
}
#insurance02 .insurance02_03 .bgYl{
margin-bottom:20px;
}
#insurance02 .insurance02_03 .bgYl h4:before,
#insurance02 .insurance02_03 .bgYl h4:after{
width:30px;
height:30px;
}
#insurance03 .bgWhite{
padding:20px 10px;
}
#aboutus02 .bgWhite table th,
#aboutus02 .bgWhite table td{
display:block;
width:100%;
}
#top02 .top02_01 p.txt {
font-size: 16px;
}
.support .h2-bmcont li p:last-of-type {
font-size: 16px;
} #topCase .bgGray .menu li {
width: 48%;
margin-bottom:15px;
}
#case .topArea{
padding:20px 0 30px;
}
#case .topArea .box h2{
font-size: 20px;
}
.case .menu .col3 li{
width:100%;
}
.case .menu .col3 li,
.case .menu .col3 li:nth-child(3n){
margin:0 auto 10px;
}
.case .menu .col4 li{
width:48%;
margin-bottom:10px;
}
#case_list, #topCase.page{
padding:20px 0 40px;
}
.list.case .archivePost,
.topCaseS.list.case .archivePost{
width:48%;
margin:0 1% 25px;
}
.archiveContents table th {
width: 50px;
}
.detail #casetop{
padding: 20px 0 40px;
}
.detail #casetop .bgWhite{
padding:20px 10px;
} #news_list li .img{
max-width:250px;
width:100%;
margin: 0 auto 15px;
}
#news_list li .right{
width:100%;
}
.pagenavi .left, .pagenavi .right{
padding-top:2px;
}
.pagenavi .left span.txt, .pagenavi .right span.txt {
display:none;
}
.pagenavi .left span.arrow, .pagenavi .right span.arrow{
width:20px;
height:20px;
} #ftContact .telArea,
#ftContact .mail{
width:100%;
margin:0 auto 20px;
}
#ftContact .mail{
margin-bottom:0;
}
.support li {
width:100%;
margin:0 auto 20px;
}
#footer .sitemap ul li{
width:calc(100%/3);
text-align: left;
font-size: 16px;
}
#footer .bgWhite{
padding:25px 15px;
}
#footer .company li{
margin-bottom:30px;
}
#footer .glassMaker .listL{
display: none;
}
#footer .glassMaker .listS{
display: block;
}
.gotop {
bottom: 130px;
}
} @media only screen and (max-width: 375px){
.top-area-wrap dl dt {
font-size: 22px;
}
.footer-contact-wrap .telArea {
padding: 2% 8%;
}
} @media only screen and (max-width: 361px){
#repair01 .box .flex .img,
#repair01 .box .flex .txt{
width:100%;
margin:0 auto 15px;
}
#repair01 .box .flex .img{
max-width: 120px;
}
.archiveContents dd:nth-child(3){
width:100%;
}
.footer-contact-wrap .telArea {
padding: 2% 6%;
}
}
@media only screen and (max-width: 330px){
}