@charset "utf-8";
/* css document */

/* =================================================
* reset
* ================================================*/

html, body, div, span, h1, h2, h3, h4, h5, h6, p, a, img,
dl, dt, dd, ol, ul, li, form, label, table, tr, th, td,
article, aside, canvas, details, figcaption, figure,
footer, header, hgroup, menu, nav, section, summary {
margin: 0px;
padding: 0px;
border: 0px;
font-weight: inherit;
font-style: inherit;
font-size: 100%;
font-family: inherit;
outline: none;
list-style: none;
}
article, aside, canvas, details, figcaption, figure,
footer, header, hgroup, menu, nav, section, summary {
display: block;
}
ul, ol {
list-style: none;
}
table {
border-spacing: 0px;
empty-cells: show;
}
html body {
font-size: 16px; 
color: #111;
font-weight: 500;
-webkit-text-size-adjust: none;
}
@font-face {
font-family: 'MyFont1';
src: url(https://graidun.com/wp-content/fonts/A-OTF-RyuminPro-Light.otf);
}
@font-face {
font-family: 'MyFont2';
src: url(https://graidun.com/wp-content/fonts/A-OTF-A1MinchoStd-Bold.otf);
}
html body .a1 {
font-family: MyFont2, sans-serif !important;
}
html body p,
html body a,
html body h1,
html body h2,
html body table,
html body dt,
html body dd,
html body ul {
font-family: MyFont1, sans-serif !important;
}
.detail01 input {
font-family: MyFont1, sans-serif !important;
}
img{
vertical-align: bottom;
font-size:0;
line-height:0;
max-width:100%;
}
area{
border:none;
outline:none;
}
input{
outline:none;
}
textarea{
outline:none;
}

/* clearfix */
.cf:after{
content: "";
display: block;
clear: both;
}
.cf {
zoom:1;
overflow: hidden;
}
.cb {
clear: both;
}
p {
    letter-spacing: 1px;
}
h1 {
    letter-spacing: 1px;
}
a {
    text-decoration: none;
	color: #111 !important;
}
.line11 {
    line-height: 1.1;
}
.line18 {
    line-height: 1.8;
}
.line2 {
    line-height: 2;
}
.line22 {
    line-height: 2.2;
}
.line25 {
    line-height: 2.5;
}
.font12 {
    font-size: 12px;
}
.font14 {
    font-size: 14px;
}
.font15 {
    font-size: 15px;
}
.font16 {
    font-size: 16px;
}
.font17 {
    font-size: 17px;
}
.font18 {
    font-size: 18px;
}
.font20 {
    font-size: 20px;
}
.font22 {
    font-size: 22px;
}
.font24 {
    font-size: 24px;
}
.font26 {
    font-size: 26px;
}
.font28 {
    font-size: 28px;
}
.font30 {
    font-size: 30px;
}
.font32 {
    font-size: 32px;
}
.font33 {
    font-size: 33px;
}
.font34 {
    font-size: 34px;
}
.font35 {
    font-size: 35px;
}
.font40 {
    font-size: 40px;
}
.font46 {
    font-size: 46px;
}
.floatL {
float: left;
}
.floatR {
float: right;
}
.posi {
position: relative;
}
.green {
color: #007711;
}
.gold {
color: #877747;
}
.white {
color: #fff;
}
.gray {
color: #929292;
}
.orange {
color: #E37024;
}
.tCenter {
text-align: center;
}
.tRight {
text-align: right;
}
.flex {
display: flex;
flex-wrap: wrap;
}
.flexJust {
display: flex;
justify-content: space-between;
flex-wrap: wrap;
}
.justCen {
    justify-content: center;
}
.let06 {
    letter-spacing: 0.6px;
}
.let1 {
    letter-spacing: 1px;
}
.let2 {
    letter-spacing: 2px;
}
.let0 {
    letter-spacing: 0;
}
.bold {
font-weight: 700;
}
.normal {
font-weight: 400;
}
.m5 {
margin-bottom: 5px;
}
.m10 {
margin-bottom: 10px;
}
.m15 {
margin-bottom: 15px;
}
.m20 {
margin-bottom: 20px;
}
.m25 {
margin-bottom: 25px;
}
.m30 {
margin-bottom: 30px;
}
.m35 {
margin-bottom: 35px;
}
.m40 {
margin-bottom: 40px;
}
.m45 {
margin-bottom: 45px;
}
.m50 {
margin-bottom: 50px;
}
.m60 {
margin-bottom: 60px;
}
.m70 {
margin-bottom: 70px;
}
.m80 {
margin-bottom: 80px;
}
.m90 {
margin-bottom: 90px;
}
.m100 {
margin-bottom: 100px;
}
.m110 {
margin-bottom: 110px;
}
.m120 {
margin-bottom: 120px;
}
.m140 {
margin-bottom: 140px;
}
.m160 {
margin-bottom: 160px;
}
.m180 {
margin-bottom: 180px;
}
.m200 {
margin-bottom: 200px;
}
.p20 {
padding-bottom: 20px;
}
.p40 {
padding-bottom: 40px;
}
.p45 {
padding-bottom: 45px;
}
.p50 {
padding-bottom: 50px;
}
.p70 {
padding-bottom: 70px;
}
.p100 {
padding-bottom: 100px;
}
.pt40 {
padding-top: 40px;
}
.pp30 {
padding: 30px 0;
}
.pp40 {
padding: 40px 0;
}
.pp50 {
padding: 50px 0;
}
.pp4_50 {
padding: 40px 0 50px 0;
}
.pp5_40 {
padding: 50px 0 40px 0;
}
.pp70 {
padding: 70px 0;
}
.pp100 {
padding: 100px 0;
}
.pcOnly {
display: block;
}
.pcOnly02 {
display: block;
}
.spOnly {
display: none;
}
.pcOnlyIn {
display: inline-block;
line-height: 0;
}
.spOnlyIn {
display: none;
line-height: 0;
}

@media screen and (max-width: 640px){
.spHeader {
position: fixed;
left: 0;
top: 0;
width: 100%;
height: 50px;
background-color: #fff;
z-index: 100;
}
.shadow {
    box-shadow: 0 2px 6px rgba(0,0,0,.10);
}
.global-nav {
position: fixed;
right: -320px; /* これで隠れる */
top: 0;
width: 260px; /* スマホに収まるくらい */
height: 100vh;
padding-top: 50px;
background-color: #fff;
transition: all .6s;
z-index: 200;
overflow-y: auto; /* メニューが多くなったらスクロールできるように */
}
.hamburger {
position: absolute;
right: 5px;
top: 0;
width: 50px; /* クリックしやすいようにちゃんと幅を指定する */
height: 50px; /* クリックしやすいようにちゃんと高さを指定する */
cursor: pointer;
z-index: 300;
}
.global-nav__list {
margin: 0;
padding: 0;
list-style: none;
}
.global-nav__item {
text-align: center;
padding: 0 20px;
}
.global-nav__item a {
display: block;
padding: 15px 0;
border-bottom: 1px solid #ccc;
text-decoration: none;
color: #111;
font-size: 15px;
}
.global-nav__list li:first-child a {
border-top: 1px solid #ccc;
}
.global-nav__item a:hover {
background-color: #eee;
}
.hamburger__line {
position: absolute;
left: 12px;
width: 27px;
height: 2px;
background-color: #111;
transition: all .6s;
}
.hamburger__line--1 {
top: 14px;
}
.hamburger__line--2 {
top: 23px;
}
.hamburger__line--3 {
top: 33px;
}
.black-bg {
position: fixed;
left: 0;
top: 0;
width: 100vw;
height: 100vh;
z-index: 100;
background-color: #000;
opacity: 0;
visibility: hidden;
transition: all .6s;
cursor: pointer;
}
.nav-open .global-nav {
right: 0;
}
.nav-open .black-bg {
opacity: .5;
visibility: visible;
}
.nav-open .hamburger__line--1 {
transform: rotate(45deg);
top: 23.5px;
}
.nav-open .hamburger__line--2 {
width: 0;
left: 50%;
}
.nav-open .hamburger__line--3 {
transform: rotate(-45deg);
top: 23.5px;
}
.flex,
.flexJust {
    display: block;
}
.spFlex {
    display: flex;
}
.pcOnly {
display: none;
}
.pcOnlyIn {
display: none;
line-height: 0;
}
.spOnly {
display: block;
}
.spOnlyIn {
display: inline-block;
line-height: 0;
}
.floatL {
float: none;
}
.floatR {
float: none;
}
.m15 {
margin-bottom: 10px;
}
.m20 {
margin-bottom: 10px;
}
.m25 {
margin-bottom: 15px;
}
.m30 {
margin-bottom: 20px;
}
.m35 {
margin-bottom: 20px;
}
.m40 {
margin-bottom: 30px;
}
.m45 {
margin-bottom: 30px;
}
.m50 {
margin-bottom: 30px;
}
.m60 {
margin-bottom: 30px;
}
.m70 {
margin-bottom: 40px;
}
.m80 {
margin-bottom: 40px;
}
.m90 {
margin-bottom: 45px;
}
.m100 {
margin-bottom: 50px;
}
.m110 {
margin-bottom: 50px;
}
.m120 {
margin-bottom: 50px;
}
.m140 {
margin-bottom: 60px;
}
.m160 {
margin-bottom: 80px;
}
.pt40 {
padding-top: 20px;
}
.pt50 {
padding-top: 50px;
}
.pp30 {
padding: 20px 0;
}
.pp40 {
padding: 30px 0;
}
.p40 {
padding-bottom: 30px;
}
.p45 {
padding-bottom: 15px;
}
.p50 {
padding-bottom: 30px;
}
.p70 {
padding-bottom: 35px;
}
.p100 {
padding-bottom: 50px;
}
.pp4_50 {
padding: 30px 0 35px 0;
}
.pp5_40 {
padding: 35px 0 30px 0;
}
.pp70 {
padding: 30px 0;
}
.pp80 {
padding: 50px 0;
}
.pp100 {
padding: 50px 0;
}
.spm0 {
margin-bottom: 0;
}
.spm10 {
margin-bottom: 10px;
}
.spm15 {
margin-bottom: 15px;
}
.spm20 {
margin-bottom: 20px;
}
.spm25 {
margin-bottom: 25px;
}
.spm30 {
margin-bottom: 30px;
}
.spm40 {
margin-bottom: 40px;
}
.spm50 {
margin-bottom: 50px;
}
.spm60 {
margin-bottom: 60px;
}
.spm70 {
margin-bottom: 70px;
}
.spm80 {
margin-bottom: 80px;
}
.spm100 {
margin-bottom: 100px;
}
.spm140 {
margin-bottom: 140px;
}
.font18 {
    font-size: 15px;
}
.font20 {
    font-size: 18px;
}
.font22 {
    font-size: 20px;
}
.font24 {
    font-size: 22px;
}
.font25 {
    font-size: 22px;
}
.font26 {
    font-size: 22px;
}
.font28 {
    font-size: 22px;
}
.font30 {
    font-size: 24px;
}
.font32 {
    font-size: 24px;
}
.font33 {
    font-size: 24px;
}
.font34 {
    font-size: 24px;
}
.font35 {
	font-size: 24px;
}
.spFont13 {
    font-size: 13px;
}
.spFont15 {
    font-size: 15px;
}
.spFont16 {
    font-size: 16px;
}
.spFont18 {
    font-size: 18px;
}
.spFont20 {
    font-size: 20px;
}
.spFont22 {
    font-size: 22px;
}
.spFont24 {
	font-size: 24px;
}
.spFont26 {
	font-size: 26px;
}
.spFont32 {
	font-size: 32px;
}
.spFont36 {
	font-size: 36px;
}
.spFont38 {
	font-size: 38px;
}
.line2 {
    line-height: 2;
}
.line22 {
    line-height: 2;
}
.spLine18 {
    line-height: 1.8;
}
.sptLeft {
text-align: left;
}
.sptCenter {
text-align: center;
}
.line25 {
    line-height: 2.2;
}
}