@charset "utf-8";

/* 本文 */
body{
	font-family: 'Noto Serif JP', serif;
	letter-spacing: 0;
	font-weight: 400;
	line-height: 1.8;
	color: #333;
}
h1, h2, h3, h4, h5, h6,input,button,
.button,select,textarea,
.project-title,
.product-title,
.project-description,
.font-alt-1,
.header .navigation > ul > li > a,
.side-navigation > ul > li > a,
.overlay-navigation > ul > li > a,
.grid-filter-menu a,
.counter
{ font-family: 'Noto Serif JP', serif; }

a {text-decoration: none;color: #333;}
a:hover {color: #d36015; }

/* Titles */
h1,h2,h3,h4,h5,h6{ line-height: 1.4; font-weight: 900; color: #000; }
h1 a:hover,h2 a:hover,h3 a:hover,h4 a:hover,h5 a:hover,h6 a:hover{ color: #3eac55; }
h1{font-size: 1.6rem;}
h2{font-size: 1.6rem;}
h3{font-size: 1.5rem;}
h4{font-size: 1.4rem;}
h5{font-size: 1.3rem;}
h6{font-size: 1.2rem;}

@media only screen and (max-width: 768px){
h1{font-size: 1.6rem;}
h2{font-size: 1.5rem;}
h3{font-size: 1.4rem;}
h4{font-size: 1.3rem;}
h5{font-size: 1.2rem;}
h6{font-size: 1.1rem;}
}

a img.linkimg{ background: none; transition: 0.3s; }
a:hover img.linkimg{ opacity:0.6; filter:alpha(opacity=60); -ms-filter: "alpha( opacity=60 )"; background:none;}

.great { font-family: 'Great Vibes', cursive; }

.f04 { font-size: 0.4em; }
.f05 { font-size: 0.5em; }
.f06 { font-size: 0.6em; }
.f07 { font-size: 0.7em; }
.f08 { font-size: 0.8em; }
.f09 { font-size: 0.9em; }
.f10 { font-size: 1em; }
.f11 { font-size: 1.1em; }
.f12 { font-size: 1.2em; }
.f13 { font-size: 1.3em; }
.f14 { font-size: 1.4em; }
.f15 { font-size: 1.5em; }
.f16 { font-size: 1.6em; }
.f18 { font-size: 1.8em; }
.f20 { font-size: 2.0em; }
.f22 { font-size: 2.2em; }
.f24a { font-size: 2.4em; }
.f26 { font-size: 2.6em; }
.f28 { font-size: 2.8em; }
.f28a { font-size: 2.8em; margin-bottom: -28px; }
.f30 { font-size: 3.0em; }
.f32 { font-size: 3.2em; }
.f34 { font-size: 3.4em; }
.f36 { font-size: 3.6em; }
.f38 { font-size: 3.8em; }
.f40 { font-size: 4.0em; }
.f50 { font-size: 5.0em; }
.bold { font-weight: 900; }
.thin { font-weight: 400; }

/*-- (max-width: 768px) -------------------------------------*/

@media only screen and (max-width: 768px){
.f20 { font-size: 1.6em; }
}

.f_och { color: #b2a77d; }
.f_och1 { color: #a3945a; }
.f_wht { color: #fff; }
.f_blk { color: #000; }
.f_whta { color: #fff; }
.f_blka { color: #000; }
.f_gry { color: #888; }

.f_blu { color: #2d74c5; }
.f_grn { color: #53b012; }
.f_org { color: #ff6f29; }
.f_pnk { color: #e36ec1; }
.f_yel { color: #b5c71a; }
.f_red { color: #d00000; }

.f_shadow { text-shadow: 3px 4px 3px rgba(0,0,0,.8); }
.f_shadow1 { text-shadow: 2px 2px 2px rgba(255,255,255,1); }

.ls2 { letter-spacing: 2px; }
.ls3 { letter-spacing: 3px; }
.ls4 { letter-spacing: 4px; }
.ls5 { letter-spacing: 5px; }

.lh2 { line-height: 2.6; }

.center1 { margin: 0 auto;}
.center { text-align: center;}
.right { text-align: right;}
.left { text-align: left;}

.h-middle { display: flex; justify-content: left; align-items: center; }
.h-middle01 { display: flex; justify-content: left; align-items: center; }

/*-- img -------------------------------------*/

img { width: 100%; }
a img.linkimg{ background: none; transition: 0.3s; }
a:hover img.linkimg{ opacity:0.6; filter:alpha(opacity=60); -ms-filter: "alpha( opacity=60 )"; background:none;}
.check01 { width: 36px; }

hr.line10 { border: 1px solid #444; margin: 16px 16px;}

.line01 {font-weight: 900;color: #333;position: relative;padding: 1rem;margin-bottom: 1.4rem;}
.line01:after {position: absolute;bottom: 0;left: 0;width: 100%;height: 10px;content: '';background-image: -webkit-repeating-linear-gradient(135deg, #444, #444 1px, transparent 2px, transparent 5px);background-image: repeating-linear-gradient(-45deg, #444, #444 1px, transparent 2px, transparent 5px);background-size: 7px 7px;-webkit-backface-visibility: hidden;backface-visibility: hidden;}

.line11 { background: url(../img/line11.png); height: 20px; margin: 10px 0 20px 0; }
.line12 { background: url(../img/line12.png); height: 20px; margin: 10px 0 20px 0; }
.line13 { background: url(../img/line13.png); height: 20px; margin: 10px 0 20px 0; }

.line_box02 { font-size: 1.1em; border-bottom: solid 1px #d0d0d0; padding: 10px; }

#main .inner {padding: 60px;}
.t11 { font-size: 1.2em; background: #2d74c5; padding: 10px 20px; color: #fff; }
.t21 { font-size: 1em; background: #4991d4; padding: 8px 16px; color: #fff; }
.t31 { font-size: 1.2em; background: #c9e5ff; padding: 8px 16px; color: #2d74c5; }
.t41 { font-size: 1.4em; border-bottom: solid 2px #c9e5ff; padding: 10px; margin-bottom: 10px; font-weight: 900; }
.t12 { font-size: 1.2em; background: #6ebb69; padding: 8px 16px; color: #fff; }
.t22 { font-size: 1.2em; background: #c3ecc1; padding: 8px 16px; }
.t32 { font-size: 1em; background: #6ebb69; padding: 8px 16px; color: #fff; }
.t32a { font-size: 1.2em; background: #6ebb69; padding: 8px 16px; color: #fff; }
.t42 { font-size: 1.4em; border-bottom: solid 2px #c3ecc1; padding: 10px; margin-bottom: 10px; font-weight: 900; }
.t13 { font-size: 1.2em; background: #ff782f; padding: 8px 16px; color: #fff; }
.t23 { font-size: 1.4em; border-bottom: solid 2px #ffa676; padding: 0 10px 8px 10px; margin-bottom: 10px; }
.t33 { font-size: 1.2em; background: #ff782f; padding: 8px 16px; color: #fff; }
.t14 { font-size: 1.2em; background: #e36ec1; padding: 10px 20px; color: #fff; }
.t34 { font-size: 1.2em; background: #e36ec1; padding: 8px 16px; color: #fff; }
.t15 { font-size: 1.2em; background: #cbdb38; padding: 8px 16px; color: #fff; }
.t35 { font-size: 1em; background: #cbdb38; padding: 8px 16px; color: #fff; }
.t45 { font-size: 1.4em; border-bottom: solid 2px #eaf2a5; padding: 10px; margin-bottom: 10px; font-weight: 900; }

.t39 { font-size: 1.2em; background: #8b8b8b; padding: 8px 16px; color: #fff; }
.t49 { font-size: 1.4em; border-bottom: solid 2px #d9d9d9; padding: 10px; margin-bottom: 10px; font-weight: 900; }

.t_gry { font-size: 1em; background: #eee; padding: 8px 16px; font-weight: 900; }

.t18 { font-size: 1.1em; background: #e5e5e5; padding: 8px; margin-bottom: 16px; text-align: center; }

.pri01 { border-bottom: solid 1px #999; font-size: 1.1em; font-weight: 900; padding: 10px; margin-bottom:10px; }

.waku11 { border: solid 5px #c9e5ff; padding: 16px; }
.waku21 { border: solid 3px #4991d4; background: #fff; padding: 20px; }
.waku12 { padding: 16px; background: #fff; padding: 16px; }
.waku22 { border: solid 5px #c3ecc1; background: #fff; padding: 16px; }
.waku32 { border: solid 3px #53b012; background: #fff; padding: 16px; }
.waku13 { border: solid 2px #ffa676; background: #fff; padding: 26px; }
.waku23 { border: solid 5px #ffcbae; background: #fff; padding: 16px; }
.waku33 { border: solid 3px #ff6f29; background: #fff; padding: 16px; }
.waku24 { border: solid 5px #fec7ff; background: #fff; padding: 16px; }
.waku34 { border: solid 3px #e36ec1; background: #fff; padding: 16px; }
.waku25 { border: solid 5px #eaf2a5; background: #fff; padding: 16px; }

.waku29 { border: solid 5px #d9d9d9; background: #fff; padding: 16px; }

.waku_ryokin { border: solid 2px #bfba78; background: linear-gradient(0deg, rgb(217, 213, 158), rgb(255, 249, 230)); padding: 16px; }

.logo01 {width:140px; margin: 0 auto;}

.copy {background: #333; font-size:0.8em; color:#fff; padding: 10px; font-family: 'Josefin Sans', sans-serif;text-align: center;}

.bkg01 { background: url(../img/bkg01.jpg); background-size: cover; background-position: center; }
.bkg02 { background: url(../img/bkg02.jpg); background-size: cover; background-position: center; }
.bkg03 { background: url(../img/bkg03.jpg); background-size: cover; background-position: center; }
.bkg04 { background: url(../img/bkg04.jpg); background-size: cover; background-position: center; }
.bkg05 { background: url(../img/bkg05.jpg); background-size: cover; background-position: center; }

.bkg11 { background: url(../img/bkg01.jpg); background-size: cover; background-position: center; }
.bkg12 { background: url(../img/bkg02.jpg); background-size: cover; background-position: center; }
.bkg13 { background: url(../img/bkg03.jpg); background-size: cover; background-position: center; }
.bkg14 { background: url(../img/bkg04.jpg); background-size: cover; background-position: center; }
.bkg15 { background: url(../img/bkg05.jpg); background-size: cover; background-position: center; }
.bkg16 { background: url(../img/bkg06.jpg); background-size: cover; background-position: center; }
.bkg17 { background: url(../img/bkg07.jpg); background-size: cover; background-position: center; }
.bkg18 { background: url(../img/bkg08.jpg); background-size: cover; background-position: center; }
.bkg19 { background: url(../img/bkg09.jpg); background-size: cover; background-position: center; }

.bkg21 { background: url(../01cold/img/01pho06.jpg); background-size: cover; background-position: center; }

.bkg01_sp { display: none; }

.bkg-01cold01 { background: url(../01cold/img/body00.jpg); background-size: cover; background-position: center; }
.bkg-01cold02 { background: url(../01cold/img/01pho01_back01.jpg); background-size: cover; background-position: center; }
.bkg-02hair01 { background: linear-gradient(135deg, rgb(79, 172, 74), rgb(150, 216, 146)); }
.bkg-02hair02 { background: url(../02hair/img/01pho01_back01.jpg); background-size: cover; background-position: center; }
.bkg-03photo02 { background: url(../03photo/img/01pho02.jpg); background-size: cover; background-position: center; }

.bkg-blk { background: #000; color: #fff; }
.bkg-blu { background: #d9e7f4; }
.bkg-grn { background: #e7f4d9; }
.bkg-org { background: #ffebd8; }
.bkg-pnk { background: #ffe5ff; }
.bkg-yel { background: #eef6d0; }
.bkg-gry { background: #e7e7e7; }

.w90 {width: 90%; margin: 0 auto;}
.w80 {width: 80%; margin: 0 auto;}
.w60 {width: 60%; margin: 0 auto;}
.w40 {width: 40%; margin: 0 auto;}


.section-8686 { padding: 80px 60px;}
.section-8680 { padding: 80px 60px 80px 0;}
.section-0686 { padding: 0 60px 80px 60px;}
.section-8606 { padding: 80px 60px 0 60px;}

.section-0606 { padding: 0px 60px;}

.section-146146 { padding: 140px 60px;}

.space00 {padding:60px 60px 60px 60px;text-align: center;}

.space01a {padding:0 20px 0 0;}
.space01b {padding:0 0 0 20px;}
.space11a {padding:0 20px 0 0;}
.space11b-blk {padding:0 0 0 20px;}

.space02a {padding:0 30px 30px 0;}
.space02b {padding:0 0 30px 30px;}
.space02c {padding:0 30px 0 0;}
.space02d {padding:0px 0 0 30px;}

.space03a {padding:15px;}

.space04a {padding:0 30px 0 0;}
.space04b {padding:0 30px 0 30px;}
.space04c {padding:0 30px 0 30px;}
.space04d {padding:0 0 0 30px;}

.space12a {padding:15px;}

.space22a {padding:15px;}\
.space_ryokina {padding:0 10px 0 0;}
.space_ryokinb {padding:0 0 0 10px;}

.space13a {padding:15px;}

.space14a {padding:15px;}

.space_menu {padding:0 15% 60px 15%;}
.space_shop01a {padding:60px 30px 60px 60px;text-align: center;}
.space_shop01b {padding:60px 60px 60px 30px;text-align: center;}

/*-- (min-width: 901px) -------------------------------------*/

@media only screen and (min-width: 901px){

#reser01 { display: none; }

.logo02 { width:640px; margin: 0 auto; }
.logo03 { display: none; }

.pc { display:inline; }
.sp { display:none; }

.hide01 {  }
.hide02 { display: none; }
}

/*-- (max-width: 1200px) -------------------------------------*/

@media only screen and (max-width: 1200px){
#main .inner {padding: 40px;}
.space_menu {padding:0 10% 30px 10%;}
}

/*-- (max-width: 1090px) -------------------------------------*/

@media only screen and (max-width: 1090px){

.section-8680 { padding: 80px 60px;}

.bkg01 { background: url(../img/bkg01a.jpg); background-size: cover; background-position: center; }
.bkg02 { background: url(../img/bkg02a.jpg); background-size: cover; background-position: center; }
.bkg03 { background: url(../img/bkg03a.jpg); background-size: cover; background-position: center; }
.bkg04 { background: url(../img/bkg04a.jpg); background-size: cover; background-position: center; }
.bkg05 { background: url(../img/bkg05a.jpg); background-size: cover; background-position: center; }

/*--
.bkg01 { background: #d9e7f4; }
.bkg02 { background: #e7f4d9; }
.bkg03 { background: #ffebd8; }
.bkg04 { background: #ffe5ff; }
.bkg05 { background: #eef6d0; }
--*/

.bkg11 { background: url(../img/bkg01_sp.jpg); background-size: cover; background-position: center; }
.bkg12 { background: url(../img/bkg02_sp.jpg); background-size: cover; background-position: center; }
.bkg13 { background: url(../img/bkg03_sp.jpg); background-size: cover; background-position: center; }
.bkg14 { background: url(../img/bkg04_sp.jpg); background-size: cover; background-position: center; }
.bkg15 { background: url(../img/bkg05_sp.jpg); background-size: cover; background-position: center; }
.bkg16 { background: url(../img/bkg06_sp.jpg); background-size: cover; background-position: center; }
.bkg17 { background: url(../img/bkg07_sp.jpg); background-size: cover; background-position: center; }
.bkg18 { background: url(../img/bkg08_sp.jpg); background-size: cover; background-position: center; }
.bkg19 { background: url(../img/bkg09_sp.jpg); background-size: cover; background-position: center; }

.bkg01_sp { display: block; }

.space01b-wht { padding: 30px; background: rgba(0,0,0,.6); }

.w90 {width: 100%; margin: 0 auto;}
.w80 {width: 100%; margin: 0 auto;}
.w60 {width: 100%; margin: 0 auto;}
.w40 {width: 100%; margin: 0 auto;}

}

/*-- (max-width: 900px) -------------------------------------*/

@media only screen and (max-width: 900px){
#reser01 { z-index: 1001; position: fixed; bottom: -10px; width: 100%; }
#reser01 ul { padding:0; margin:0;}
#reser01 ul li { display: inline; }
.waku { width: 50%; }

.logo02 { display:none; }
.logo03 { width:50%; margin: 50px auto 0 auto; }

.pc { display:none; }
.sp { display:inline; }

.f_whta { color: #000; }
.f_blka { color: #fff; }

.section-8680 { padding: 40px 20px;}
.section-8686 { padding: 40px 20px;}
.section-0686 { padding: 40px 20px;}
.section-8606 { padding: 40px 20px;}

.section-0606 { padding: 0px 60px;}
.section-146146 { padding: 200px 40px 140px 40px;}

.space00 { padding: 10px; text-align: center; }

.space01a {padding:10px 0;}
.space01b {padding:10px 0;}
.space11a {padding:0;}
.space11b-blk { background: rgba(0,0,0,.5); padding: 30px 16px; }

.space02a {padding:10px 0;}
.space02b {padding:10px 0;}
.space02c {padding:0 0 10px 0;}
.space02d {padding:0 0 10px 0;}

.space03a {padding:10px 0;}

.space04a {padding:10px 0;}
.space04b {padding:10px 0;}
.space04c {padding:10px 0;}
.space04d {padding:10px 0;}

.space12a {padding:10px 0;}
.space12b {padding:10px 0;}
.space12c {padding:0 0 10px 0;}
.space12d {padding:0 0 10px 0;}
.space22a {padding:5px;}
.space_ryokina {padding:0 0 10px 0;}
.space_ryokinb {padding:0;}

.space13a {padding:10px 0;}

.space14a {padding:10px;}

.space_menu {padding:0 15% 60px 15%;}
.space_shop01a {padding:60px 30px 60px 60px;text-align: center;}
.space_shop01b {padding:60px 60px 60px 30px;text-align: center;}

.t01 { font-size: 1.8em; background: #3b7fcc; padding: 10px 20px; }
.t02 {font-size:1em;}
.t03 {font-size:2.0em;}

.logo01 { display: none; }

.hide01 { display: none; }
.hide02 {  }

}

/*-- (max-width: 768px) -------------------------------------*/

@media only screen and (max-width: 768px){
.space_menu {padding:0 30px 0 30px;}
.logo03 { width:60%; margin: 50px auto 0 auto; }
.f24a { font-size: 1.8em; }
}

/*-- MENU -------------------------------------*/

* {margin: 0;padding: 0;}
*, *:before, *:after {-webkit-box-sizing: border-box;-moz-box-sizing: border-box;-ms-box-sizing: border-box;box-sizing: border-box;}

html,body {height: 100%;}
#main {background: #fff;}
#main-in {padding-left: 230px;}
#main p {font-size: 1rem;margin-bottom: 1em;line-height: 1.9;}

/* main-visual */
#main-visual {background: #fff; padding: 180px 20px 160px 20px;text-align: center;}
#main-visual1 {background: #fff; padding: 180px 20px 180px 20px;text-align: center;}
#main-visual-top { background: #000; padding: 80px 0 80px 0; text-align: center;}
#main-visual-01 { background: url(../img/bkg01.jpg); background-size: cover; background-position: center; padding: 80px 0 80px 0; text-align: center;}

#copyright a {color: #666;text-decoration: none;}
#copyright a:hover {text-decoration: underline;}

/* ここから */
#global-head { position: fixed; color: #fff; width: 230px; text-align: center; padding-top: 20px; z-index: 100; }
#sidebar {padding-top: 200px; width: 230px;height: 100%;position: fixed;color: #fff;background: #000;box-shadow: 0 10px 16px 0 rgba(100, 100, 100, .7); font-size: 0.95em;}
#global-nav ul {list-style: none;margin-left: 0;}
#global-nav > ul > li {position: relative;}
#global-nav a {color: #fff;text-decoration: none;display: block;padding: 6px 0 6px 20px;-moz-transition: background-color .3s linear-webkit-transition: background-color .3s linear;transition: background-color .3s linear;}
#global-nav .sub-menu.is-active > a,
#global-nav a:hover {color: #fff;background: #666;}
#global-nav .sub-menu-nav a,
#global-nav .sub-menu:hover .sub-menu-nav {width: 230px;}

/* sub-menu icon */
#global-nav .sub-menu-head {position: relative;}
#global-nav .sub-menu-head:after {content: "";position: absolute;top: 0;bottom: 0;right: 18px;margin: auto;vertical-align: middle;width: 8px;height: 8px;border-top: 1px solid #033560;border-right: 1px solid #033560;-moz-transform: rotate(45deg);-webkit-transform: rotate(45deg);transform: rotate(45deg);}

/* sub-menu */
#global-nav .sub-menu-nav {position: fixed;background: #666;color: #fff;top: 0;padding-top: 90px;left: 230px;width: 0;height: 100%;
overflow: hidden;-moz-transition: width .2s ease-out;-webkit-transition: width .2s ease-out;transition: width .2s ease-out;}
#global-nav .sub-menu.is-active > a:after,
#global-nav .sub-menu-head:hover:after {border-color: #fff;}
#global-nav .sub-menu-nav a {color: #fff;}
#global-nav .sub-menu-nav a:hover {color: #033560;background: #fff;}

/* nav-toggle */
#nav-toggle {display: none;position: fixed;top: 24px;right: 24px;height: 32px;}
#nav-toggle > div {position: relative;width: 32px;}
#nav-toggle span {width: 100%;height: 2px;left: 0;display: block;background: #fff;position: absolute;-webkit-transition: .35s ease-in-out;-moz-transition: .35s ease-in-out;transition: .35s ease-in-out;}
#nav-toggle span:nth-child(1) {top: 0;}
#nav-toggle span:nth-child(2) {top: 11px;}
#nav-toggle span:nth-child(3) {top: 22px;}

#overlay {display: none;position: fixed;background: rgba(0,0,0,.4);width: 100%;height: 100%;top: 0;left: 0;right: 0;bottom: 0;}

@media screen and (min-width: 901px) {
#logo11 { display: none; }
}

@media screen and (max-width: 900px) {
#logo11 { position: fixed; top:7px; left: 7px; width:150px; text-align: center; z-index:1000; }
#main-in {padding-left: 0;}
#global-head {width: 100%; padding: 34px; background: rgba(0,0,0,.7); display: -webkit-flex; display: flex;}
#sidebar {/*display: none;*/position: fixed;right: -300px;top: 0;height: 100%;width: 300px;color: #333;background: #000;
-webkit-transition: .35s ease-in-out;transition: .35s ease-in-out;padding-top: 60px;}
#main-visual {padding: 220px 20px 200px 20px;}

/* サブメニューは開けない */
#global-nav .sub-menu-head:after,#global-nav .sub-menu-nav {display: none;}
#nav-toggle { display: block;}

/* nav open */
.open {overflow: hidden;}
.open #overlay {display: block;}
.open #sidebar  {-webkit-transform: translate3d(-300px,0,0);transform: translate3d(-300px,0,0);}

/* #nav-toggle close */
.open #nav-toggle span:nth-child(1) {top: 11px;-webkit-transform: rotate(45deg);-moz-transform: rotate(45deg);transform: rotate(45deg);}
.open #nav-toggle span:nth-child(2) {width: 0;left: 50%;}
.open #nav-toggle span:nth-child(3) {top: 11px;-webkit-transform: rotate(-45deg);-moz-transform: rotate(-45deg);transform: rotate(-45deg);}

/* z-index */
#overlay {z-index: 200;}
#sidebar {z-index: 300;}
#nav-toggle {z-index: 400;}
}

@media screen and (max-width: 400px) {
#sidebar {right: -200px;width: 200px;padding-top: 60px;}
.open #sidebar  {-webkit-transform: translate3d(-200px,0,0);transform: translate3d(-200px,0,0);}}

/*-- カラム -------------------------------------*/

/* 2カラム */
*, *:before, *:after { box-sizing: border-box; }
.col_2{ width: 100%; display: flex; display: -ms-flexbox; flex-wrap: wrap; -ms-flex-wrap: wrap; }
.col_2 > div{ width: 50%; }
@media screen and (max-width: 1090px) {.col_2 > div{width: 100%;}}

.col_2a{ width: 100%; display: flex; display: -ms-flexbox; flex-wrap: wrap; -ms-flex-wrap: wrap; }
.col_2a > div{ width: 50%; }
@media screen and (max-width: 1090px) {.col_2a > div{width: 100%;} #col-rev { flex-direction: column-reverse;}}

/* 3カラム */
*, *:before, *:after { box-sizing: border-box; }
.col_3{ width: 100%; display: flex; display: -ms-flexbox; flex-wrap: wrap; -ms-flex-wrap: wrap; }
.col_3 > div{ width: 33.33333%; }
@media screen and (max-width: 1090px) {.col_3 > div{width: 50%;}}
@media screen and (max-width: 750px) {.col_3 > div{width: 100%;}}

/* 4カラム */
*, *:before, *:after {box-sizing: border-box;}
.col_4{ width: 100%; display: flex; display: -ms-flexbox; flex-wrap: wrap; -ms-flex-wrap: wrap; }
.col_4 > div{width: 25%;}
@media screen and (max-width: 900px) {.col_4 > div{width: 50%; margin-bottom:-10px;}}

/* 7:3カラム */
.container01 { display: flex; flex-wrap: wrap; }
.column--l01,
.column--r01 { width: 100%; }
.container02 { display: flex; flex-wrap: wrap; }
.column--l02,
.column--r02 { width: 100%; }

@media (min-width: 1024px) {
.column--l01 { width: 70%; margin-right: 4%; }
.column--r01 { width: 26%; }
.column--l02 { width: 26%; margin-right: 4%; }
.column--r02 { width: 70%; }
}

.mt-0{margin-top:0}
.mt-5{margin-top:.5rem}
.mt-15{margin-top:1.5rem}
.mt-10{margin-top:1rem}
.mt-20{margin-top:2rem}
.mt-30{margin-top:3rem}
.mt-40{margin-top:4rem}
.mt-50{margin-top:5rem}
.mt-60{margin-top:6rem}
.mt-70{margin-top:7rem}
.mt-80{margin-top:8rem}
.mt-90{margin-top:9rem}
.mt-100{margin-top:10rem}
.mt-110{margin-top:11rem}
.mt-120{margin-top:12rem}
.mt-130{margin-top:13rem}
.mt-140{margin-top:14rem}
.mt-150{margin-top:15rem}
.mb-0{margin-bottom:0}
.mb-5{margin-bottom:.5rem}
.mb-10{margin-bottom:1rem}
.mb-20{margin-bottom:2rem}
.mb-30{margin-bottom:3rem}
.mb-40{margin-bottom:4rem}
.mb-50{margin-bottom:5rem}
.mb-60{margin-bottom:6rem}
.mb-70{margin-bottom:7rem}
.mb-80{margin-bottom:8rem}
.mb-90{margin-bottom:9rem}
.mb-100{margin-bottom:10rem}
.mb-110{margin-bottom:11rem}
.mb-120{margin-bottom:12rem}
.mb-130{margin-bottom:13rem}
.mb-140{margin-bottom:14rem}
.mb-150{margin-bottom:15rem}
.pt-0{padding-top:0rem}
.pt-5{padding-top:.5rem}
.pt-10{padding-top:1rem}
.pt-20{padding-top:2rem}
.pt-30{padding-top:3rem}
.pt-40{padding-top:4rem}
.pt-50{padding-top:5rem}
.pt-60{padding-top:6rem}
.pt-70{padding-top:7rem}
.pt-80{padding-top:8rem}
.pt-90{padding-top:9rem}
.pt-100{padding-top:10rem}
.pt-110{padding-top:11rem}
.pt-120{padding-top:12rem}
.pt-130{padding-top:13rem}
.pt-140{padding-top:14rem}
.pt-150{padding-top:15rem}
.pb-0{padding-bottom:0}
.pb-5{padding-bottom:.5rem}
.pb-10{padding-bottom:1rem}
.pb-20{padding-bottom:2rem}
.pb-30{padding-bottom:3rem}
.pb-40{padding-bottom:4rem}
.pb-50{padding-bottom:5rem}
.pb-60{padding-bottom:6rem}
.pb-70{padding-bottom:7rem}
.pb-80{padding-bottom:8rem}
.pb-90{padding-bottom:9rem}
.pb-100{padding-bottom:10rem}
.pb-110{padding-bottom:11rem}
.pb-120{padding-bottom:12rem}
.pb-130{padding-bottom:13rem}
.pb-140{padding-bottom:14rem}
.pb-150{padding-bottom:15rem}
.mt--5{margin-top:-.5rem}
.mt--10{margin-top:-1rem}
.mt--15{margin-top:-1.5rem}
.mt--20{margin-top:-2rem}
.mt--30{margin-top:-3rem}
.mt--40{margin-top:-4rem}
.mt--50{margin-top:-5rem}
.mt--60{margin-top:-6rem}
.mb--10{margin-bottom:-1rem}
.mb--20{margin-bottom:-2rem}
.mb--30{margin-bottom:-3rem}
.mb--40{margin-bottom:-4rem}
.mb--50{margin-bottom:-5rem}
.mb--60{margin-bottom:-6rem}
.mb--70{margin-bottom:-7rem}
.mb--80{margin-bottom:-8rem}
.mb--90{margin-bottom:-9rem}

.mb-60a{margin-bottom:6rem}

@media screen and (max-width: 900px) {
.mb-60a {margin-bottom:0}
}

/*-- btn -------------------------------------*/

a.btn01 {
	display: block;
	text-align: center;
	vertical-align: middle;
	text-decoration: none;
	width: 80%;
	margin: auto;
	padding: 1rem 1.3rem;
	font-weight: bold;
	border: 1px solid #999;
	background: #000;
	color: #fff;
	transition: 0.5s;
}
a.btn01:hover {
	color: #000;
	background: #b2a77d;
}

a.btn02 {
	font-size: 1em;
	display: block;
	text-align: center;
	vertical-align: middle;
	text-decoration: none;
	width: 80%;
	margin: auto;
	padding: 1rem 0;
	border: 1px solid #777;
	background: #eee;
	color: #000;
	transition: 0.5s;
	font-weight: bold;
}
a.btn02:hover {
	color: #333;
	background: #777;
}

a.btn02a {
	font-size: 1.2em;
	display: block;
	text-align: center;
	vertical-align: middle;
	text-decoration: none;
	width: 100%;
	margin: auto;
	padding: 1.5rem 0;
	border: 1px solid #777;
	background: #eee;
	color: #000;
	transition: 0.5s;
	font-weight: bold;
}
a.btn02a:hover {
	color: #333;
	background: #777;
}

a.btn03 {
	font-size: 1em;
	display: block;
	text-align: center;
	vertical-align: middle;
	text-decoration: none;
	width: 100%;
	margin: auto;
	padding: 1rem 0;
	border: 1px solid #777;
	background: #000;
	color: #fff;
	transition: 0.5s;
	font-weight: bold;
}
a.btn03:hover {
	background: #666;
}

/*-- popup -------------------------------------*/

.popup_wrap input { display: none; }
.popup_overlay {
display: flex;
justify-content: center;
overflow: auto;
position: fixed;
top: 0;
left: 0;
z-index: 999;
width: 100%;
height: 94%;
background: rgba(0, 0, 0, 0.7);
opacity: 0;
transition: opacity 0.5s, transform 0s 0.5s;
transform: scale(0);
}

.popup_trigger { position: absolute; width: 100%; height: 100%; }

.popup_content {
position: relative;
align-self: center;
width: 90%;
max-width: 700px;
padding: 30px 40px;
box-sizing: border-box;
background: #fff;
line-height: 1.4em;
transition: 0.5s;
text-align: justify;
}

.close_btn {
position: absolute;
top: 10px;
right: 10px;
font-size: 14px;
cursor: pointer;
padding:8px;
background: #000;
color: #fff;
line-height:14px;
font-weight:bold;
}

.pop_t01 { border-top: 1px solid #000; border-bottom: 1px solid #000; font-size: 1.2em; font-weight: 900; padding: 14px; text-align: center; }
.pop_t02 { background: #eee; font-size: 1em; font-weight: 900; padding: 14px; text-align: center; }

.popup_wrap input:checked ~ .popup_overlay { opacity: 1; transform: scale(1); transition: opacity 0.5s; }
.popup_wrap input:checked ~ .popup_overlay .popup_content{ transform: translateY(50px); }

.open_btn01 {
	font-size: 1em;
	display: block;
	text-align: center;
	vertical-align: middle;
	text-decoration: none;
	width: 80%;
	margin: auto;
	padding: 1rem 0;
	border: 1px solid #777;
	background: #eee;
	color: #000;
	transition: 0.5s;
	font-weight: bold;
}

.open_btn01:hover{
	color: #333;
	background: #777;
}

.open_btn02 {
	font-size: 1.2em;
	display: block;
	text-align: center;
	vertical-align: middle;
	text-decoration: none;
	width: 100%;
	margin: auto;
	padding: 1.5rem 0;
	border: 1px solid #777;
	background: #eee;
	color: #000;
	transition: 0.5s;
	font-weight: bold;
}

.open_btn02:hover{
	color: #333;
	background: #777;
}