@charset "UTF-8";
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
margin: 0;
padding: 0;
border: 0;
font: inherit;
font-size: 100%;
vertical-align: baseline; }

html {
line-height: 1; }

ol, ul {
list-style: none; }

table {
border-collapse: collapse;
border-spacing: 0; }

caption, th, td {
text-align: left;
font-weight: normal;
vertical-align: middle; }

q, blockquote {
quotes: none; }
q:before, q:after, blockquote:before, blockquote:after {
content: "";
content: none; }

a img {
border: none; }

article, aside, details, figcaption, figure, footer, header, hgroup, main, menu, nav, section, summary {
display: block; }

@font-face {
font-family: 'Material Icons';
font-style: normal;
font-weight: 400;
src: url("https://example.com/MaterialIcons-Regular.eot");
/* For IE6-8 */
src: local("Material Icons"), local("MaterialIcons-Regular"), url("https://example.com/MaterialIcons-Regular.woff2") format("woff2"), url("https://example.com/MaterialIcons-Regular.woff") format("woff"), url("https://example.com/MaterialIcons-Regular.ttf") format("truetype"); }

/* @font-face {
font-family: 'Hannari';
src: url('fonts/Hannari.ttf') format('truetype');
} */

.material-icons {
font-family: 'Material Icons';
font-weight: normal;
font-style: normal;
font-size: 24px;
/* Preferred icon size */
display: inline-block;
line-height: 1;
text-transform: none;
letter-spacing: normal;
word-wrap: normal;
white-space: nowrap;
direction: ltr;
/* Support for all WebKit browsers. */
-webkit-font-smoothing: antialiased;
/* Support for Safari and Chrome. */
text-rendering: optimizeLegibility;
/* Support for Firefox. */
-moz-osx-font-smoothing: grayscale;
/* Support for IE. */
font-feature-settings: 'liga'; }

.mt0 {
margin-top: 0px !important; }

.mr0 {
margin-right: 0px !important; }

.mb0 {
margin-bottom: 0px !important; }

.mr0 {
margin-left: 0px !important; }

.pt0 {
padding-top: 0px !important; }

.pr0 {
padding-right: 0px !important; }

.pb0 {
padding-bottom: 0px !important; }

.pl0 {
padding-left: 0px !important; }

.mt5 {
margin-top: 5px !important; }

.mr5 {
margin-right: 5px !important; }

.mb5 {
margin-bottom: 5px !important; }

.mr5 {
margin-left: 5px !important; }

.pt5 {
padding-top: 5px !important; }

.pr5 {
padding-right: 5px !important; }

.pb5 {
padding-bottom: 5px !important; }

.pl5 {
padding-left: 5px !important; }

.mt10 {
margin-top: 10px !important; }

.mr10 {
margin-right: 10px !important; }

.mb10 {
margin-bottom: 10px !important; }

.mr10 {
margin-left: 10px !important; }

.pt10 {
padding-top: 10px !important; }

.pr10 {
padding-right: 10px !important; }

.pb10 {
padding-bottom: 10px !important; }

.pl10 {
padding-left: 10px !important; }

.mt15 {
margin-top: 15px !important; }

.mr15 {
margin-right: 15px !important; }

.mb15 {
margin-bottom: 15px !important; }

.mr15 {
margin-left: 15px !important; }

.pt15 {
padding-top: 15px !important; }

.pr15 {
padding-right: 15px !important; }

.pb15 {
padding-bottom: 15px !important; }

.pl15 {
padding-left: 15px !important; }

.mt20 {
margin-top: 20px !important; }

.mr20 {
margin-right: 20px !important; }

.mb20 {
margin-bottom: 20px !important; }

.mr20 {
margin-left: 20px !important; }

.pt20 {
padding-top: 20px !important; }

.pr20 {
padding-right: 20px !important; }

.pb20 {
padding-bottom: 20px !important; }

.pl20 {
padding-left: 20px !important; }

.mt25 {
margin-top: 25px !important; }

.mr25 {
margin-right: 25px !important; }

.mb25 {
margin-bottom: 25px !important; }

.mr25 {
margin-left: 25px !important; }

.pt25 {
padding-top: 25px !important; }

.pr25 {
padding-right: 25px !important; }

.pb25 {
padding-bottom: 25px !important; }

.pl25 {
padding-left: 25px !important; }

.mt30 {
margin-top: 30px !important; }

.mr30 {
margin-right: 30px !important; }

.mb30 {
margin-bottom: 30px !important; }

.mr30 {
margin-left: 30px !important; }

.pt30 {
padding-top: 30px !important; }

.pr30 {
padding-right: 30px !important; }

.pb30 {
padding-bottom: 30px !important; }

.pl30 {
padding-left: 30px !important; }

.mt35 {
margin-top: 35px !important; }

.mr35 {
margin-right: 35px !important; }

.mb35 {
margin-bottom: 35px !important; }

.mr35 {
margin-left: 35px !important; }

.pt35 {
padding-top: 35px !important; }

.pr35 {
padding-right: 35px !important; }

.pb35 {
padding-bottom: 35px !important; }

.pl35 {
padding-left: 35px !important; }

.mt40 {
margin-top: 40px !important; }

.mr40 {
margin-right: 40px !important; }

.mb40 {
margin-bottom: 40px !important; }

.mr40 {
margin-left: 40px !important; }

.pt40 {
padding-top: 40px !important; }

.pr40 {
padding-right: 40px !important; }

.pb40 {
padding-bottom: 40px !important; }

.pl40 {
padding-left: 40px !important; }

.mt45 {
margin-top: 45px !important; }

.mr45 {
margin-right: 45px !important; }

.mb45 {
margin-bottom: 45px !important; }

.mr45 {
margin-left: 45px !important; }

.pt45 {
padding-top: 45px !important; }

.pr45 {
padding-right: 45px !important; }

.pb45 {
padding-bottom: 45px !important; }

.pl45 {
padding-left: 45px !important; }

.mt50 {
margin-top: 50px !important; }

.mr50 {
margin-right: 50px !important; }

.mb50 {
margin-bottom: 50px !important; }

.mr50 {
margin-left: 50px !important; }

.pt50 {
padding-top: 50px !important; }

.pr50 {
padding-right: 50px !important; }

.pb50 {
padding-bottom: 50px !important; }

.pl50 {
padding-left: 50px !important; }

.mt55 {
margin-top: 55px !important; }

.mr55 {
margin-right: 55px !important; }

.mb55 {
margin-bottom: 55px !important; }

.mr55 {
margin-left: 55px !important; }

.pt55 {
padding-top: 55px !important; }

.pr55 {
padding-right: 55px !important; }

.pb55 {
padding-bottom: 55px !important; }

.pl55 {
padding-left: 55px !important; }

.mt60 {
margin-top: 60px !important; }

.mr60 {
margin-right: 60px !important; }

.mb60 {
margin-bottom: 60px !important; }

.mr60 {
margin-left: 60px !important; }

.pt60 {
padding-top: 60px !important; }

.pr60 {
padding-right: 60px !important; }

.pb60 {
padding-bottom: 60px !important; }

.pl60 {
padding-left: 60px !important; }

.mt65 {
margin-top: 65px !important; }

.mr65 {
margin-right: 65px !important; }

.mb65 {
margin-bottom: 65px !important; }

.mr65 {
margin-left: 65px !important; }

.pt65 {
padding-top: 65px !important; }

.pr65 {
padding-right: 65px !important; }

.pb65 {
padding-bottom: 65px !important; }

.pl65 {
padding-left: 65px !important; }

.mt70 {
margin-top: 70px !important; }

.mr70 {
margin-right: 70px !important; }

.mb70 {
margin-bottom: 70px !important; }

.mr70 {
margin-left: 70px !important; }

.pt70 {
padding-top: 70px !important; }

.pr70 {
padding-right: 70px !important; }

.pb70 {
padding-bottom: 70px !important; }

.pl70 {
padding-left: 70px !important; }

.mt75 {
margin-top: 75px !important; }

.mr75 {
margin-right: 75px !important; }

.mb75 {
margin-bottom: 75px !important; }

.mr75 {
margin-left: 75px !important; }

.pt75 {
padding-top: 75px !important; }

.pr75 {
padding-right: 75px !important; }

.pb75 {
padding-bottom: 75px !important; }

.pl75 {
padding-left: 75px !important; }

.mt80 {
margin-top: 80px !important; }

.mr80 {
margin-right: 80px !important; }

.mb80 {
margin-bottom: 80px !important; }

.mr80 {
margin-left: 80px !important; }

.pt80 {
padding-top: 80px !important; }

.pr80 {
padding-right: 80px !important; }

.pb80 {
padding-bottom: 80px !important; }

.pl80 {
padding-left: 80px !important; }

.mt85 {
margin-top: 85px !important; }

.mr85 {
margin-right: 85px !important; }

.mb85 {
margin-bottom: 85px !important; }

.mr85 {
margin-left: 85px !important; }

.pt85 {
padding-top: 85px !important; }

.pr85 {
padding-right: 85px !important; }

.pb85 {
padding-bottom: 85px !important; }

.pl85 {
padding-left: 85px !important; }

.mt90 {
margin-top: 90px !important; }

.mr90 {
margin-right: 90px !important; }

.mb90 {
margin-bottom: 90px !important; }

.mr90 {
margin-left: 90px !important; }

.pt90 {
padding-top: 90px !important; }

.pr90 {
padding-right: 90px !important; }

.pb90 {
padding-bottom: 90px !important; }

.pl90 {
padding-left: 90px !important; }

.mt95 {
margin-top: 95px !important; }

.mr95 {
margin-right: 95px !important; }

.mb95 {
margin-bottom: 95px !important; }

.mr95 {
margin-left: 95px !important; }

.pt95 {
padding-top: 95px !important; }

.pr95 {
padding-right: 95px !important; }

.pb95 {
padding-bottom: 95px !important; }

.pl95 {
padding-left: 95px !important; }

.mt100 {
margin-top: 100px !important; }

.mr100 {
margin-right: 100px !important; }

.mb100 {
margin-bottom: 100px !important; }

.mr100 {
margin-left: 100px !important; }

.pt100 {
padding-top: 100px !important; }

.pr100 {
padding-right: 100px !important; }

.pb100 {
padding-bottom: 100px !important; }

.pl100 {
padding-left: 100px !important; }

.animated{
  -webkit-animation-duration: 2s;
  animation-duration: 2s;
}
/*!
* Hamburgers
* @description Tasty CSS-animated hamburgers
* @author Jonathan Suh @jonsuh
* @site https://jonsuh.com/hamburgers
* @link https://github.com/jonsuh/hamburgers
*/
.hamburger {
padding: 15px 15px;
display: inline-block;
cursor: pointer;
transition-property: opacity, filter;
transition-duration: 0.15s;
transition-timing-function: linear;
font: inherit;
color: inherit;
text-transform: none;
background-color: transparent;
border: 0;
margin: 0;
overflow: visible; }
.hamburger:hover {
opacity: 0.5; }

.hamburger-box {
width: 40px;
height: 24px;
display: inline-block;
position: relative; }

.hamburger-inner {
display: block;
top: 50%;
margin-top: -2px; }
.hamburger-inner, .hamburger-inner::before, .hamburger-inner::after {
width: 40px;
height: 4px;
background-color: #000;
border-radius: 4px;
position: absolute;
transition-property: transform;
transition-duration: 0.15s;
transition-timing-function: ease; }
.hamburger-inner::before, .hamburger-inner::after {
content: "";
display: block; }
.hamburger-inner::before {
top: -10px; }
.hamburger-inner::after {
bottom: -10px; }

/*
* 3DX
*/
.hamburger--3dx .hamburger-box {
perspective: 80px; }

.hamburger--3dx .hamburger-inner {
transition: transform 0.15s cubic-bezier(0.645, 0.045, 0.355, 1), background-color 0s 0.1s cubic-bezier(0.645, 0.045, 0.355, 1); }
.hamburger--3dx .hamburger-inner::before, .hamburger--3dx .hamburger-inner::after {
transition: transform 0s 0.1s cubic-bezier(0.645, 0.045, 0.355, 1); }

.hamburger--3dx.is-active .hamburger-inner {
background-color: transparent;
transform: rotateY(180deg); }
.hamburger--3dx.is-active .hamburger-inner::before {
transform: translate3d(0, 10px, 0) rotate(45deg); }
.hamburger--3dx.is-active .hamburger-inner::after {
transform: translate3d(0, -10px, 0) rotate(-45deg); }

/*
* 3DX Reverse
*/
.hamburger--3dx-r .hamburger-box {
perspective: 80px; }

.hamburger--3dx-r .hamburger-inner {
transition: transform 0.15s cubic-bezier(0.645, 0.045, 0.355, 1), background-color 0s 0.1s cubic-bezier(0.645, 0.045, 0.355, 1); }
.hamburger--3dx-r .hamburger-inner::before, .hamburger--3dx-r .hamburger-inner::after {
transition: transform 0s 0.1s cubic-bezier(0.645, 0.045, 0.355, 1); }

.hamburger--3dx-r.is-active .hamburger-inner {
background-color: transparent;
transform: rotateY(-180deg); }
.hamburger--3dx-r.is-active .hamburger-inner::before {
transform: translate3d(0, 10px, 0) rotate(45deg); }
.hamburger--3dx-r.is-active .hamburger-inner::after {
transform: translate3d(0, -10px, 0) rotate(-45deg); }

/*
* 3DY
*/
.hamburger--3dy .hamburger-box {
perspective: 80px; }

.hamburger--3dy .hamburger-inner {
transition: transform 0.15s cubic-bezier(0.645, 0.045, 0.355, 1), background-color 0s 0.1s cubic-bezier(0.645, 0.045, 0.355, 1); }
.hamburger--3dy .hamburger-inner::before, .hamburger--3dy .hamburger-inner::after {
transition: transform 0s 0.1s cubic-bezier(0.645, 0.045, 0.355, 1); }

.hamburger--3dy.is-active .hamburger-inner {
background-color: transparent;
transform: rotateX(-180deg); }
.hamburger--3dy.is-active .hamburger-inner::before {
transform: translate3d(0, 10px, 0) rotate(45deg); }
.hamburger--3dy.is-active .hamburger-inner::after {
transform: translate3d(0, -10px, 0) rotate(-45deg); }

/*
* 3DY Reverse
*/
.hamburger--3dy-r .hamburger-box {
perspective: 80px; }

.hamburger--3dy-r .hamburger-inner {
transition: transform 0.15s cubic-bezier(0.645, 0.045, 0.355, 1), background-color 0s 0.1s cubic-bezier(0.645, 0.045, 0.355, 1); }
.hamburger--3dy-r .hamburger-inner::before, .hamburger--3dy-r .hamburger-inner::after {
transition: transform 0s 0.1s cubic-bezier(0.645, 0.045, 0.355, 1); }

.hamburger--3dy-r.is-active .hamburger-inner {
background-color: transparent;
transform: rotateX(180deg); }
.hamburger--3dy-r.is-active .hamburger-inner::before {
transform: translate3d(0, 10px, 0) rotate(45deg); }
.hamburger--3dy-r.is-active .hamburger-inner::after {
transform: translate3d(0, -10px, 0) rotate(-45deg); }

/*
* Arrow
*/
.hamburger--arrow.is-active .hamburger-inner::before {
transform: translate3d(-8px, 0, 0) rotate(-45deg) scale(0.7, 1); }

.hamburger--arrow.is-active .hamburger-inner::after {
transform: translate3d(-8px, 0, 0) rotate(45deg) scale(0.7, 1); }

/*
* Arrow Right
*/
.hamburger--arrow-r.is-active .hamburger-inner::before {
transform: translate3d(8px, 0, 0) rotate(45deg) scale(0.7, 1); }

.hamburger--arrow-r.is-active .hamburger-inner::after {
transform: translate3d(8px, 0, 0) rotate(-45deg) scale(0.7, 1); }

/*
* Arrow Alt
*/
.hamburger--arrowalt .hamburger-inner::before {
transition: top 0.1s 0.1s ease, transform 0.1s cubic-bezier(0.165, 0.84, 0.44, 1); }

.hamburger--arrowalt .hamburger-inner::after {
transition: bottom 0.1s 0.1s ease, transform 0.1s cubic-bezier(0.165, 0.84, 0.44, 1); }

.hamburger--arrowalt.is-active .hamburger-inner::before {
top: 0;
transform: translate3d(-8px, -10px, 0) rotate(-45deg) scale(0.7, 1);
transition: top 0.1s ease, transform 0.1s 0.1s cubic-bezier(0.895, 0.03, 0.685, 0.22); }

.hamburger--arrowalt.is-active .hamburger-inner::after {
bottom: 0;
transform: translate3d(-8px, 10px, 0) rotate(45deg) scale(0.7, 1);
transition: bottom 0.1s ease, transform 0.1s 0.1s cubic-bezier(0.895, 0.03, 0.685, 0.22); }

/*
* Arrow Alt Right
*/
.hamburger--arrowalt-r .hamburger-inner::before {
transition: top 0.1s 0.1s ease, transform 0.1s cubic-bezier(0.165, 0.84, 0.44, 1); }

.hamburger--arrowalt-r .hamburger-inner::after {
transition: bottom 0.1s 0.1s ease, transform 0.1s cubic-bezier(0.165, 0.84, 0.44, 1); }

.hamburger--arrowalt-r.is-active .hamburger-inner::before {
top: 0;
transform: translate3d(8px, -10px, 0) rotate(45deg) scale(0.7, 1);
transition: top 0.1s ease, transform 0.1s 0.1s cubic-bezier(0.895, 0.03, 0.685, 0.22); }

.hamburger--arrowalt-r.is-active .hamburger-inner::after {
bottom: 0;
transform: translate3d(8px, 10px, 0) rotate(-45deg) scale(0.7, 1);
transition: bottom 0.1s ease, transform 0.1s 0.1s cubic-bezier(0.895, 0.03, 0.685, 0.22); }

/*
* Boring
*/
.hamburger--boring .hamburger-inner, .hamburger--boring .hamburger-inner::before, .hamburger--boring .hamburger-inner::after {
transition-property: none; }

.hamburger--boring.is-active .hamburger-inner {
transform: rotate(45deg); }
.hamburger--boring.is-active .hamburger-inner::before {
top: 0;
opacity: 0; }
.hamburger--boring.is-active .hamburger-inner::after {
bottom: 0;
transform: rotate(-90deg); }

/*
* Collapse
*/
.hamburger--collapse .hamburger-inner {
top: auto;
bottom: 0;
transition-duration: 0.13s;
transition-delay: 0.13s;
transition-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); }
.hamburger--collapse .hamburger-inner::after {
top: -20px;
transition: top 0.2s 0.2s cubic-bezier(0.33333, 0.66667, 0.66667, 1), opacity 0.1s linear; }
.hamburger--collapse .hamburger-inner::before {
transition: top 0.12s 0.2s cubic-bezier(0.33333, 0.66667, 0.66667, 1), transform 0.13s cubic-bezier(0.55, 0.055, 0.675, 0.19); }

.hamburger--collapse.is-active .hamburger-inner {
transform: translate3d(0, -10px, 0) rotate(-45deg);
transition-delay: 0.22s;
transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); }
.hamburger--collapse.is-active .hamburger-inner::after {
top: 0;
opacity: 0;
transition: top 0.2s cubic-bezier(0.33333, 0, 0.66667, 0.33333), opacity 0.1s 0.22s linear; }
.hamburger--collapse.is-active .hamburger-inner::before {
top: 0;
transform: rotate(-90deg);
transition: top 0.1s 0.16s cubic-bezier(0.33333, 0, 0.66667, 0.33333), transform 0.13s 0.25s cubic-bezier(0.215, 0.61, 0.355, 1); }

/*
* Collapse Reverse
*/
.hamburger--collapse-r .hamburger-inner {
top: auto;
bottom: 0;
transition-duration: 0.13s;
transition-delay: 0.13s;
transition-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); }
.hamburger--collapse-r .hamburger-inner::after {
top: -20px;
transition: top 0.2s 0.2s cubic-bezier(0.33333, 0.66667, 0.66667, 1), opacity 0.1s linear; }
.hamburger--collapse-r .hamburger-inner::before {
transition: top 0.12s 0.2s cubic-bezier(0.33333, 0.66667, 0.66667, 1), transform 0.13s cubic-bezier(0.55, 0.055, 0.675, 0.19); }

.hamburger--collapse-r.is-active .hamburger-inner {
transform: translate3d(0, -10px, 0) rotate(45deg);
transition-delay: 0.22s;
transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); }
.hamburger--collapse-r.is-active .hamburger-inner::after {
top: 0;
opacity: 0;
transition: top 0.2s cubic-bezier(0.33333, 0, 0.66667, 0.33333), opacity 0.1s 0.22s linear; }
.hamburger--collapse-r.is-active .hamburger-inner::before {
top: 0;
transform: rotate(90deg);
transition: top 0.1s 0.16s cubic-bezier(0.33333, 0, 0.66667, 0.33333), transform 0.13s 0.25s cubic-bezier(0.215, 0.61, 0.355, 1); }

/*
* Elastic
*/
.hamburger--elastic .hamburger-inner {
top: 2px;
transition-duration: 0.275s;
transition-timing-function: cubic-bezier(0.68, -0.55, 0.265, 1.55); }
.hamburger--elastic .hamburger-inner::before {
top: 10px;
transition: opacity 0.125s 0.275s ease; }
.hamburger--elastic .hamburger-inner::after {
top: 20px;
transition: transform 0.275s cubic-bezier(0.68, -0.55, 0.265, 1.55); }

.hamburger--elastic.is-active .hamburger-inner {
transform: translate3d(0, 10px, 0) rotate(135deg);
transition-delay: 0.075s; }
.hamburger--elastic.is-active .hamburger-inner::before {
transition-delay: 0s;
opacity: 0; }
.hamburger--elastic.is-active .hamburger-inner::after {
transform: translate3d(0, -20px, 0) rotate(-270deg);
transition-delay: 0.075s; }

/*
* Elastic Reverse
*/
.hamburger--elastic-r .hamburger-inner {
top: 2px;
transition-duration: 0.275s;
transition-timing-function: cubic-bezier(0.68, -0.55, 0.265, 1.55); }
.hamburger--elastic-r .hamburger-inner::before {
top: 10px;
transition: opacity 0.125s 0.275s ease; }
.hamburger--elastic-r .hamburger-inner::after {
top: 20px;
transition: transform 0.275s cubic-bezier(0.68, -0.55, 0.265, 1.55); }

.hamburger--elastic-r.is-active .hamburger-inner {
transform: translate3d(0, 10px, 0) rotate(-135deg);
transition-delay: 0.075s; }
.hamburger--elastic-r.is-active .hamburger-inner::before {
transition-delay: 0s;
opacity: 0; }
.hamburger--elastic-r.is-active .hamburger-inner::after {
transform: translate3d(0, -20px, 0) rotate(270deg);
transition-delay: 0.075s; }

/*
* Emphatic
*/
.hamburger--emphatic {
overflow: hidden; }
.hamburger--emphatic .hamburger-inner {
transition: background-color 0.125s 0.175s ease-in; }
.hamburger--emphatic .hamburger-inner::before {
left: 0;
transition: transform 0.125s cubic-bezier(0.6, 0.04, 0.98, 0.335), top 0.05s 0.125s linear, left 0.125s 0.175s ease-in; }
.hamburger--emphatic .hamburger-inner::after {
top: 10px;
right: 0;
transition: transform 0.125s cubic-bezier(0.6, 0.04, 0.98, 0.335), top 0.05s 0.125s linear, right 0.125s 0.175s ease-in; }
.hamburger--emphatic.is-active .hamburger-inner {
transition-delay: 0s;
transition-timing-function: ease-out;
background-color: transparent; }
.hamburger--emphatic.is-active .hamburger-inner::before {
left: -80px;
top: -80px;
transform: translate3d(80px, 80px, 0) rotate(45deg);
transition: left 0.125s ease-out, top 0.05s 0.125s linear, transform 0.125s 0.175s cubic-bezier(0.075, 0.82, 0.165, 1); }
.hamburger--emphatic.is-active .hamburger-inner::after {
right: -80px;
top: -80px;
transform: translate3d(-80px, 80px, 0) rotate(-45deg);
transition: right 0.125s ease-out, top 0.05s 0.125s linear, transform 0.125s 0.175s cubic-bezier(0.075, 0.82, 0.165, 1); }

/*
* Emphatic Reverse
*/
.hamburger--emphatic-r {
overflow: hidden; }
.hamburger--emphatic-r .hamburger-inner {
transition: background-color 0.125s 0.175s ease-in; }
.hamburger--emphatic-r .hamburger-inner::before {
left: 0;
transition: transform 0.125s cubic-bezier(0.6, 0.04, 0.98, 0.335), top 0.05s 0.125s linear, left 0.125s 0.175s ease-in; }
.hamburger--emphatic-r .hamburger-inner::after {
top: 10px;
right: 0;
transition: transform 0.125s cubic-bezier(0.6, 0.04, 0.98, 0.335), top 0.05s 0.125s linear, right 0.125s 0.175s ease-in; }
.hamburger--emphatic-r.is-active .hamburger-inner {
transition-delay: 0s;
transition-timing-function: ease-out;
background-color: transparent; }
.hamburger--emphatic-r.is-active .hamburger-inner::before {
left: -80px;
top: 80px;
transform: translate3d(80px, -80px, 0) rotate(-45deg);
transition: left 0.125s ease-out, top 0.05s 0.125s linear, transform 0.125s 0.175s cubic-bezier(0.075, 0.82, 0.165, 1); }
.hamburger--emphatic-r.is-active .hamburger-inner::after {
right: -80px;
top: 80px;
transform: translate3d(-80px, -80px, 0) rotate(45deg);
transition: right 0.125s ease-out, top 0.05s 0.125s linear, transform 0.125s 0.175s cubic-bezier(0.075, 0.82, 0.165, 1); }

/*
* Slider
*/
.hamburger--slider .hamburger-inner {
top: 2px; }
.hamburger--slider .hamburger-inner::before {
top: 10px;
transition-property: transform, opacity;
transition-timing-function: ease;
transition-duration: 0.15s; }
.hamburger--slider .hamburger-inner::after {
top: 20px; }

.hamburger--slider.is-active .hamburger-inner {
transform: translate3d(0, 10px, 0) rotate(45deg); }
.hamburger--slider.is-active .hamburger-inner::before {
transform: rotate(-45deg) translate3d(-5.71429px, -6px, 0);
opacity: 0; }
.hamburger--slider.is-active .hamburger-inner::after {
transform: translate3d(0, -20px, 0) rotate(-90deg); }

/*
* Slider Reverse
*/
.hamburger--slider-r .hamburger-inner {
top: 2px; }
.hamburger--slider-r .hamburger-inner::before {
top: 10px;
transition-property: transform, opacity;
transition-timing-function: ease;
transition-duration: 0.15s; }
.hamburger--slider-r .hamburger-inner::after {
top: 20px; }

.hamburger--slider-r.is-active .hamburger-inner {
transform: translate3d(0, 10px, 0) rotate(-45deg); }
.hamburger--slider-r.is-active .hamburger-inner::before {
transform: rotate(45deg) translate3d(5.71429px, -6px, 0);
opacity: 0; }
.hamburger--slider-r.is-active .hamburger-inner::after {
transform: translate3d(0, -20px, 0) rotate(90deg); }

/*
* Spring
*/
.hamburger--spring .hamburger-inner {
top: 2px;
transition: background-color 0s 0.13s linear; }
.hamburger--spring .hamburger-inner::before {
top: 10px;
transition: top 0.1s 0.2s cubic-bezier(0.33333, 0.66667, 0.66667, 1), transform 0.13s cubic-bezier(0.55, 0.055, 0.675, 0.19); }
.hamburger--spring .hamburger-inner::after {
top: 20px;
transition: top 0.2s 0.2s cubic-bezier(0.33333, 0.66667, 0.66667, 1), transform 0.13s cubic-bezier(0.55, 0.055, 0.675, 0.19); }

.hamburger--spring.is-active .hamburger-inner {
transition-delay: 0.22s;
background-color: transparent; }
.hamburger--spring.is-active .hamburger-inner::before {
top: 0;
transition: top 0.1s 0.15s cubic-bezier(0.33333, 0, 0.66667, 0.33333), transform 0.13s 0.22s cubic-bezier(0.215, 0.61, 0.355, 1);
transform: translate3d(0, 10px, 0) rotate(45deg); }
.hamburger--spring.is-active .hamburger-inner::after {
top: 0;
transition: top 0.2s cubic-bezier(0.33333, 0, 0.66667, 0.33333), transform 0.13s 0.22s cubic-bezier(0.215, 0.61, 0.355, 1);
transform: translate3d(0, 10px, 0) rotate(-45deg); }

/*
* Spring Reverse
*/
.hamburger--spring-r .hamburger-inner {
top: auto;
bottom: 0;
transition-duration: 0.13s;
transition-delay: 0s;
transition-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); }
.hamburger--spring-r .hamburger-inner::after {
top: -20px;
transition: top 0.2s 0.2s cubic-bezier(0.33333, 0.66667, 0.66667, 1), opacity 0s linear; }
.hamburger--spring-r .hamburger-inner::before {
transition: top 0.1s 0.2s cubic-bezier(0.33333, 0.66667, 0.66667, 1), transform 0.13s cubic-bezier(0.55, 0.055, 0.675, 0.19); }

.hamburger--spring-r.is-active .hamburger-inner {
transform: translate3d(0, -10px, 0) rotate(-45deg);
transition-delay: 0.22s;
transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); }
.hamburger--spring-r.is-active .hamburger-inner::after {
top: 0;
opacity: 0;
transition: top 0.2s cubic-bezier(0.33333, 0, 0.66667, 0.33333), opacity 0s 0.22s linear; }
.hamburger--spring-r.is-active .hamburger-inner::before {
top: 0;
transform: rotate(90deg);
transition: top 0.1s 0.15s cubic-bezier(0.33333, 0, 0.66667, 0.33333), transform 0.13s 0.22s cubic-bezier(0.215, 0.61, 0.355, 1); }

/*
* Stand
*/
.hamburger--stand .hamburger-inner {
transition: transform 0.075s 0.15s cubic-bezier(0.55, 0.055, 0.675, 0.19), background-color 0s 0.075s linear; }
.hamburger--stand .hamburger-inner::before {
transition: top 0.075s 0.075s ease-in, transform 0.075s 0s cubic-bezier(0.55, 0.055, 0.675, 0.19); }
.hamburger--stand .hamburger-inner::after {
transition: bottom 0.075s 0.075s ease-in, transform 0.075s 0s cubic-bezier(0.55, 0.055, 0.675, 0.19); }

.hamburger--stand.is-active .hamburger-inner {
transform: rotate(90deg);
background-color: transparent;
transition: transform 0.075s 0s cubic-bezier(0.215, 0.61, 0.355, 1), background-color 0s 0.15s linear; }
.hamburger--stand.is-active .hamburger-inner::before {
top: 0;
transform: rotate(-45deg);
transition: top 0.075s 0.1s ease-out, transform 0.075s 0.15s cubic-bezier(0.215, 0.61, 0.355, 1); }
.hamburger--stand.is-active .hamburger-inner::after {
bottom: 0;
transform: rotate(45deg);
transition: bottom 0.075s 0.1s ease-out, transform 0.075s 0.15s cubic-bezier(0.215, 0.61, 0.355, 1); }

/*
* Stand Reverse
*/
.hamburger--stand-r .hamburger-inner {
transition: transform 0.075s 0.15s cubic-bezier(0.55, 0.055, 0.675, 0.19), background-color 0s 0.075s linear; }
.hamburger--stand-r .hamburger-inner::before {
transition: top 0.075s 0.075s ease-in, transform 0.075s 0s cubic-bezier(0.55, 0.055, 0.675, 0.19); }
.hamburger--stand-r .hamburger-inner::after {
transition: bottom 0.075s 0.075s ease-in, transform 0.075s 0s cubic-bezier(0.55, 0.055, 0.675, 0.19); }

.hamburger--stand-r.is-active .hamburger-inner {
transform: rotate(-90deg);
background-color: transparent;
transition: transform 0.075s 0s cubic-bezier(0.215, 0.61, 0.355, 1), background-color 0s 0.15s linear; }
.hamburger--stand-r.is-active .hamburger-inner::before {
top: 0;
transform: rotate(-45deg);
transition: top 0.075s 0.1s ease-out, transform 0.075s 0.15s cubic-bezier(0.215, 0.61, 0.355, 1); }
.hamburger--stand-r.is-active .hamburger-inner::after {
bottom: 0;
transform: rotate(45deg);
transition: bottom 0.075s 0.1s ease-out, transform 0.075s 0.15s cubic-bezier(0.215, 0.61, 0.355, 1); }

/*
* Spin
*/
.hamburger--spin .hamburger-inner {
transition-duration: 0.22s;
transition-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); }
.hamburger--spin .hamburger-inner::before {
transition: top 0.1s 0.25s ease-in, opacity 0.1s ease-in; }
.hamburger--spin .hamburger-inner::after {
transition: bottom 0.1s 0.25s ease-in, transform 0.22s cubic-bezier(0.55, 0.055, 0.675, 0.19); }

.hamburger--spin.is-active .hamburger-inner {
transform: rotate(225deg);
transition-delay: 0.12s;
transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); }
.hamburger--spin.is-active .hamburger-inner::before {
top: 0;
opacity: 0;
transition: top 0.1s ease-out, opacity 0.1s 0.12s ease-out; }
.hamburger--spin.is-active .hamburger-inner::after {
bottom: 0;
transform: rotate(-90deg);
transition: bottom 0.1s ease-out, transform 0.22s 0.12s cubic-bezier(0.215, 0.61, 0.355, 1); }

/*
* Spin Reverse
*/
.hamburger--spin-r .hamburger-inner {
transition-duration: 0.22s;
transition-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); }
.hamburger--spin-r .hamburger-inner::before {
transition: top 0.1s 0.25s ease-in, opacity 0.1s ease-in; }
.hamburger--spin-r .hamburger-inner::after {
transition: bottom 0.1s 0.25s ease-in, transform 0.22s cubic-bezier(0.55, 0.055, 0.675, 0.19); }

.hamburger--spin-r.is-active .hamburger-inner {
transform: rotate(-225deg);
transition-delay: 0.12s;
transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); }
.hamburger--spin-r.is-active .hamburger-inner::before {
top: 0;
opacity: 0;
transition: top 0.1s ease-out, opacity 0.1s 0.12s ease-out; }
.hamburger--spin-r.is-active .hamburger-inner::after {
bottom: 0;
transform: rotate(90deg);
transition: bottom 0.1s ease-out, transform 0.22s 0.12s cubic-bezier(0.215, 0.61, 0.355, 1); }

/*
* Squeeze
*/
.hamburger--squeeze .hamburger-inner {
transition-duration: 0.075s;
transition-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); }
.hamburger--squeeze .hamburger-inner::before {
transition: top 0.075s 0.12s ease, opacity 0.075s ease; }
.hamburger--squeeze .hamburger-inner::after {
transition: bottom 0.075s 0.12s ease, transform 0.075s cubic-bezier(0.55, 0.055, 0.675, 0.19); }

.hamburger--squeeze.is-active .hamburger-inner {
transform: rotate(45deg);
transition-delay: 0.12s;
transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); }
.hamburger--squeeze.is-active .hamburger-inner::before {
top: 0;
opacity: 0;
transition: top 0.075s ease, opacity 0.075s 0.12s ease; }
.hamburger--squeeze.is-active .hamburger-inner::after {
bottom: 0;
transform: rotate(-90deg);
transition: bottom 0.075s ease, transform 0.075s 0.12s cubic-bezier(0.215, 0.61, 0.355, 1); }

/*
* Vortex
*/
.hamburger--vortex .hamburger-inner {
transition-duration: 0.2s;
transition-timing-function: cubic-bezier(0.19, 1, 0.22, 1); }
.hamburger--vortex .hamburger-inner::before, .hamburger--vortex .hamburger-inner::after {
transition-duration: 0s;
transition-delay: 0.1s;
transition-timing-function: linear; }
.hamburger--vortex .hamburger-inner::before {
transition-property: top, opacity; }
.hamburger--vortex .hamburger-inner::after {
transition-property: bottom, transform; }

.hamburger--vortex.is-active .hamburger-inner {
transform: rotate(765deg);
transition-timing-function: cubic-bezier(0.19, 1, 0.22, 1); }
.hamburger--vortex.is-active .hamburger-inner::before, .hamburger--vortex.is-active .hamburger-inner::after {
transition-delay: 0s; }
.hamburger--vortex.is-active .hamburger-inner::before {
top: 0;
opacity: 0; }
.hamburger--vortex.is-active .hamburger-inner::after {
bottom: 0;
transform: rotate(90deg); }

/*
* Vortex Reverse
*/
.hamburger--vortex-r .hamburger-inner {
transition-duration: 0.2s;
transition-timing-function: cubic-bezier(0.19, 1, 0.22, 1); }
.hamburger--vortex-r .hamburger-inner::before, .hamburger--vortex-r .hamburger-inner::after {
transition-duration: 0s;
transition-delay: 0.1s;
transition-timing-function: linear; }
.hamburger--vortex-r .hamburger-inner::before {
transition-property: top, opacity; }
.hamburger--vortex-r .hamburger-inner::after {
transition-property: bottom, transform; }

.hamburger--vortex-r.is-active .hamburger-inner {
transform: rotate(-765deg);
transition-timing-function: cubic-bezier(0.19, 1, 0.22, 1); }
.hamburger--vortex-r.is-active .hamburger-inner::before, .hamburger--vortex-r.is-active .hamburger-inner::after {
transition-delay: 0s; }
.hamburger--vortex-r.is-active .hamburger-inner::before {
top: 0;
opacity: 0; }
.hamburger--vortex-r.is-active .hamburger-inner::after {
bottom: 0;
transform: rotate(-90deg); }

@media only screen and (max-width: 640px) {
.pc {
display: none !important; } }

@media only screen and (min-width: 641px) {
.sp {
display: none !important; } }

html {
font-size: 62.5%;
font-family: "游ゴシック", YuGothic, "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", sans-serif; }

* {
font-size: 14px;
font-size: 1.4rem;
box-sizing: border-box; }

img {
max-width: 100%;
height: auto;
vertical-align: bottom; }

a {
color: inherit;
text-decoration: none;
-webkit-transition: 0.3s;
-moz-transition: 0.3s;
-o-transition: 0.3s;
transition: 0.3s; }
a:hover {
opacity: 0.5; }


.container {
max-width: 1300px;
min-width: 1040px;
height: auto;
padding: 0 30px;
margin: 0 auto;
overflow: hidden; }
@media only screen and (max-width: 640px) {
.container {
min-width: inherit;
width: 100%;
padding: 0 10px; } }

.cont980 {
width: 980px;
padding: 0;
margin: 0 auto;
overflow: hidden; }
@media only screen and (max-width: 640px) {
.cont980 {
width: 100%; } }

.footer {
clear: both;
min-width: 1040px; }
@media only screen and (max-width: 640px) {
.footer {
min-width: inherit; } }
.footer #form_foot {
background-image: url(../images/common/footer_back.jpg);
background-repeat: no-repeat;
background-size: cover; }
@media only screen and (max-width: 640px) {
.footer #form_foot {
background-position: 100%;
background-position: center; } }
.footer #form_foot .white_back {
background-color: rgba(255, 255, 255, 0.8);
margin: 120px auto 65px;
position: relative; }
@media only screen and (max-width: 640px) {
.footer #form_foot .white_back {
width: 80%;
margin: 90px auto 40px; } }
.footer #form_foot .white_back:before {
content: "";
display: block;
opacity: 0.9;
position: absolute;
width: 50px;
height: 48px;
background-image: url(../images/common/point_logo_wh.svg);
background-repeat: no-repeat;
background-position: center;
left: 0;
right: 0;
margin: auto;
top: -48px; }
.footer #form_foot .white_back ul {
padding: 25px 0;
margin: 0;
overflow: hidden; }
@media only screen and (max-width: 640px) {
.footer #form_foot .white_back ul {
padding: 15px 0; } }
.footer #form_foot .white_back ul li {
width: 50%;
display: block;
float: left;
text-align: center;
box-sizing: border-box;
padding: 18px; }
@media only screen and (max-width: 640px) {
.footer #form_foot .white_back ul li {
float: none;
width: 80%;
margin: auto;
padding: 18px 0; } }
.footer #form_foot .white_back ul li:first-child {
border-right: 1px solid #9B8B5C; }
@media only screen and (max-width: 640px) {
.footer #form_foot .white_back ul li:first-child {
border-right: none;
border-bottom: 1px solid #B3B3B3; } }
.footer #form_foot .white_back ul li p {
font-size: 24px;
font-size: 2.4rem;
margin-bottom: 15px;
text-align: center;
letter-spacing: 2px;
font-family: 'Hannari', "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "Sawarabi Mincho", serif;}
@media only screen and (max-width: 640px) {
.footer #form_foot .white_back ul li p {
font-size: 18px;
font-size: 1.8rem; } }
.footer #form_foot .white_back ul li .mail_form_btn {
display: block;
width: 280px;
height: 54px;
background-color: #9B8B5C;
border-radius: 27px;
margin: auto;
line-height: 54px;
color: white;
font-size: 14px;
font-size: 1.4rem;
font-weight: bold; }
@media only screen and (max-width: 640px) {
.footer #form_foot .white_back ul li .mail_form_btn {
width: 224px;
height: 43px;
line-height: 43px;
font-size: 13px;
font-size: 1.3rem; } }
@media only screen and (max-width: 374px) {
.footer #form_foot .white_back ul li .mail_form_btn {
width: 200px;
font-size: 11px;
font-size: 1.1rem; } }
.footer #form_foot .white_back ul li .mail_form_btn:before {
content: "";
display: inline-block;
width: 26px;
height: 16px;
margin-right: 10px;
margin-bottom: -2px;
background-image: url(../images/common/mail_icon.svg);
background-size: 26px; }
.footer #form_foot .white_back ul li .tel_no {
display: block;
color: #9B8B5C;
white-space: nowrap;
font-family: 'EB Garamond', "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "Sawarabi Mincho", serif;
font-size: 51px;
font-size: 5.1rem; }
@media only screen and (min-width: 641px) {
.footer #form_foot .white_back ul li .tel_no{
pointer-events: none;
}
}
@media only screen and (max-width: 640px) {
.footer #form_foot .white_back ul li .tel_no {
font-size: 32px;
font-size: 3.2rem; } }
@media only screen and (max-width: 374px) {
.footer #form_foot .white_back ul li .tel_no {
font-size: 26px;
font-size: 2.6rem; } }
.footer #form_foot .white_back ul li .tel_no:before {
content: "";
display: inline-block;
width: 30px;
height: 27px;
margin-right: 10px;
margin-bottom: 0px;
background-image: url(../images/common/tel_icon.svg);
background-size: 30px;
background-repeat: no-repeat; }
@media only screen and (max-width: 640px) {
.footer #form_foot .white_back ul li .tel_no:before {
width: 24px;
height: 22px;
background-size: 24px; } }
.footer #link_foot {
padding: 35px;
text-align: center;
min-width: 1040px; }
@media only screen and (max-width: 640px) {
.footer #link_foot {
padding: 30px 35px;
min-width: inherit; } }
.footer #link_foot a {
display: inline-block;
font-size: 16px;
font-size: 1.6rem;
font-weight: bold;
margin: 0 20px; }
@media only screen and (max-width: 640px) {
.footer #link_foot a {
display: inline-block;
width: 40%;
margin: 15px 0;
font-size: 14px;
font-size: 1.4rem; } }
.footer #bottom_foot {
background-color: #333333;
padding: 60px 0; }
@media only screen and (max-width: 640px) {
.footer #bottom_foot {
padding: 35px 20px; } }
.footer #bottom_foot .cont980 {
position: relative; }
.footer #bottom_foot .address_info {
float: left;
padding-top: 20px;
width: 240px;
margin-right: 30px;
color: white; }
@media only screen and (max-width: 640px) {
.footer #bottom_foot .address_info {
padding-top: 0;
float: none; } }
.footer #bottom_foot .address_info h5 {
font-weight: bold;
font-size: 18px;
font-size: 1.8rem;
margin-bottom: 20px; }
@media only screen and (max-width: 640px) {
.footer #bottom_foot .address_info h5 {
font-size: 16px;
font-size: 1.6rem; } }
.footer #bottom_foot .address_info h5 span{
  font-size: 14px;
  padding-left: 6px;
}
.footer #bottom_foot .address_info p {
font-size: 12px;
font-size: 1.2rem;
line-height: 1.7em;
font-weight: normal;
letter-spacing: 2px; }
@media only screen and (min-width: 641px) {
.footer #bottom_foot .address_info p {
pointer-events: none;} }
@media only screen and (max-width: 640px) {
.footer #bottom_foot .address_info p {
font-size: 11px;
font-size: 1.1rem;
letter-spacing: normal; } }
.footer #bottom_foot .bottom_map {
float: left; }
@media only screen and (max-width: 640px) {
.footer #bottom_foot .bottom_map {
float: none;
margin-top: 25px; } }
.footer #bottom_foot .bottom_map iframe {
width: 450px;
height: 200px; }
@media only screen and (max-width: 640px) {
.footer #bottom_foot .bottom_map iframe {
width: 100%; } }
.footer #bottom_foot .bottom_map p {
text-align: right;
color: #9B8B5C;
margin-top: 5px;
font-size: 12px;
font-size: 1.2rem; }
.footer #bottom_foot .bottom_txt {
clear: both;
color: #808080;
padding-top: 25px;
font-size: 10px;
font-size: 1rem; }
@media only screen and (max-width: 640px) {
.footer #bottom_foot .bottom_txt {
width: 80%;
line-height: 1.5em; } }
.footer #bottom_foot .copyright {
border-top: 1px solid #377EC3;
color: #377EC3;
font-size: 11px;
font-size: 1.1rem;
padding-top: 10px;
margin-top: 12px; }
@media only screen and (max-width: 640px) {
.footer #bottom_foot .copyright {
font-size: 10px;
font-size: 1rem; } }
.footer #bottom_foot .trast_link {
position: absolute;
top: 75px;
right: 0;
width: 80px;
height: 80px; }
@media only screen and (max-width: 640px) {
.footer #bottom_foot .trast_link {
top: 25px;
width: 64px;
height: 64px; } }

.header {
width: 100%;
height: 66px;
background-color: white;
position: fixed;
z-index: 9999; }
@media only screen and (max-width: 640px) {
.header {
height: 50px; } }
.header .header_inner{
height: auto;
padding: 0 0 0 30px;
margin: 0 auto;
overflow: hidden;
}
@media only screen and (max-width: 640px) {
.header .header_inner{
padding: 0 10px;
width: 100%;
}
}
.header .headerLogo {
display: block;
float: left;
width: 145px; }
.header .headerLogo img {
height: auto;
margin-top: 8px;
width: 145px; }
@media only screen and (max-width: 640px) {
.header .headerLogo {
width: 90px;
margin-top: 10px; }
.header .headerLogo img {
width: 90px;
margin-top: 0;
height: auto; } }
.header #mainNav {
float: right;
/*width: calc($widthcm - 200px);*/
/*width: calc($widthcm - 200px);*/
}
@media only screen and (max-width: 640px) {
.header #mainNav {
display: none;
position: absolute;
top: 50px;
left: 0;
width: 100%;
background-image: url(../images/common/point_logo.svg);
background-repeat: no-repeat;
background-size: 40%;
background-position: 107%; } }
.header #mainNav ul {
display: flex;
flex-direction: row;
height: 66px; }
@media only screen and (max-width: 640px) {
.header #mainNav ul {
padding: 20px 0;
width: 100%;
height: auto;
display: block;
background: rgba(255, 255, 255, 1);
overflow: hidden; } }
.header #mainNav ul li:last-of-type {
text-align: center; }
.header #mainNav ul li:last-of-type a {
display: inline-block; }
.header #mainNav ul li a .find_job_btn{
width: 154px;
}
@media only screen and (max-width: 640px) {
.header #mainNav ul li:last-of-type a {
margin-top: 20px; } }
.header #mainNav ul li a {
font-size: 13px;
font-size: 1.3rem;
font-weight: bold;
margin-left: 2px;
line-height: 66px;
text-align: center;
padding: 0 20px; }
@media only screen and (max-width: 640px) {
.header #mainNav ul li a {
display: block;
line-height: 50px; } }
.header #mainNav ul li a.image_btn {
padding: 0; }
.header #mainNav ul li a img {
height: 66px;
width: auto; }
.header #sp_menu {
float: right;
width: 25px;
margin-top: 15px;
cursor: pointer; }

#page_up {
z-index: 9999;
width: 50px;
height: 50px;
position: fixed;
right: 50px;
cursor: pointer;
bottom: 50px;
border-radius: 50%;
background-image: url(../images/common/page_up.svg);
background-size: cover; }
@media only screen and (max-width: 640px) {
#page_up {
right: 10px; } }
#page_up a {
width: 100%;
height: 100%; }

body.page-company .wrap main .sec--01 {
padding: 80px 0; }
@media only screen and (max-width: 767px) {
body.page-company .wrap main .sec--01 {
padding: 42px 0 130px; } }
body.page-company .wrap main .sec--01 .wrapper {
display: -webkit-flex;
display: flex;
-webkit-flex-wrap: wrap;
flex-wrap: wrap;
-webkit-justify-content: flex-start;
justify-content: flex-start; }
@media only screen and (max-width: 767px) {
body.page-company .wrap main .sec--01 .wrapper {
position: relative; } }
body.page-company .wrap main .sec--01 .wrapper .left {
width: 350px;
margin: 127px 60px 0 0; }
@media only screen and (max-width: 767px) {
body.page-company .wrap main .sec--01 .wrapper .left {
width: 210px;
height: 230px;
position: absolute;
bottom: -70px;
left: -20px;
opacity: .4; } }
body.page-company .wrap main .sec--01 .wrapper .right {
width: 58%;
padding: 20px 0 0;
position: relative; }
@media only screen and (max-width: 767px) {
body.page-company .wrap main .sec--01 .wrapper .right {
width: 100%;
padding: 22px; } }
body.page-company .wrap main .sec--01 .wrapper .right h4 {
font-size: 20px;
font-size: 2rem;
line-height: 1.75;
letter-spacing: 0;
color: #377ec3;
font-weight: bold; }
@media only screen and (max-width: 767px) {
body.page-company .wrap main .sec--01 .wrapper .right h4 {
font-size: 17px;
font-size: 1.7rem;
text-align: justify; } }
body.page-company .wrap main .sec--01 .wrapper .right p {
font-size: 14px;
font-size: 1.4rem;
line-height: 2;
letter-spacing: 0; }
@media only screen and (max-width: 767px) {
body.page-company .wrap main .sec--01 .wrapper .right p {
} }
body.page-company .wrap main .sec--01 .wrapper .right p:nth-of-type(1) {
padding: 25px 0 0; }
@media only screen and (max-width: 767px) {
body.page-company .wrap main .sec--01 .wrapper .right p:nth-of-type(1) {
padding: 18px 0 0; } }
body.page-company .wrap main .sec--01 .wrapper .right p:nth-of-type(2) {
padding: 35px 0 0; }
@media only screen and (max-width: 767px) {
body.page-company .wrap main .sec--01 .wrapper .right p:nth-of-type(2) {
padding: 30px 0 0; } }
body.page-company .wrap main .sec--01 .wrapper .right .name {
display: inline-block;
width: 190px;
height: 19px;
position: absolute;
right: 0;
margin: 15px 0 0; }
@media only screen and (max-width: 767px) {
body.page-company .wrap main .sec--01 .wrapper .right .name {
width: 200px;
height: 22px;
right: 22px;
bottom: -30px; } }

body.page-company .wrap main .sec--02 {
position: relative;
padding: 82px 0 75px; }
@media only screen and (max-width: 767px) {
body.page-company .wrap main .sec--02 {
padding: 32px 0 60px; } }
@media only screen and (max-width: 767px) {
body.page-company .wrap main .sec--02 .sec-title h3 {
font-size: 22px;
font-size: 2.2rem; } }
@media only screen and (max-width: 767px) {
body.page-company .wrap main .sec--02 .txt {
padding: 30px 20px 0; } }
body.page-company .wrap main .sec--02 ul {
width: 980px;
margin: 0 auto;
padding: 35px 0 0; }
@media only screen and (min-width: 768px) {
body.page-company .wrap main .sec--02 ul {
display: -webkit-flex;
display: flex;
-webkit-flex-wrap: wrap;
flex-wrap: wrap;
-webkit-justify-content: space-between;
justify-content: space-between; } }
@media only screen and (max-width: 767px) {
body.page-company .wrap main .sec--02 ul {
width: 100%;
padding: 35px 75px; } }
body.page-company .wrap main .sec--02 ul li {
width: calc(100% / 3 - 10px); }
@media only screen and (max-width: 767px) {
body.page-company .wrap main .sec--02 ul li {
width: 100%;
margin: 10px 0 0; } }
@media only screen and (max-width: 767px) {
body.page-company .wrap main .sec--02 ul li:first-child {
margin: 0; } }
@media only screen and (min-width: 768px) {
body.page-company .wrap main .sec--02 .desc {
padding: 40px 0 0; } }
@media only screen and (max-width: 767px) {
body.page-company .wrap main .sec--02 .desc {
padding: 0 20px; } }
body.page-company .wrap main .sec--02 .desc p {
padding: 0 0 0 14px;
margin: 15px 0 0;
position: relative; }
@media only screen and (max-width: 767px) {
body.page-company .wrap main .sec--02 .desc p {
padding: 0 0 0 10px; } }
@media only screen and (max-width: 320px) {
body.page-company .wrap main .sec--02 .desc p {
display: -webkit-flex;
display: flex;
-webkit-flex-wrap: wrap;
flex-wrap: wrap;
-webkit-justify-content: flex-start;
justify-content: flex-start; } }
body.page-company .wrap main .sec--02 .desc p:nth-of-type(1) {
margin: 0; }
body.page-company .wrap main .sec--02 .desc p::before {
content: '';
width: 10px;
height: 1px;
background: #9b8b5c;
position: absolute;
left: 0;
top: 50%;
-webkit-transform: translate(0, -50%);
-moz-transform: translate(0, -50%);
-ms-transform: translate(0, -50%);
-o-transform: translate(0, -50%);
transform: translate(0, -50%); }
@media only screen and (max-width: 767px) {
body.page-company .wrap main .sec--02 .desc p::before {
width: 7px; } }
@media only screen and (max-width: 320px) {
body.page-company .wrap main .sec--02 .desc p::before {
top: 28%; } }
body.page-company .wrap main .sec--02 .desc p span {
font-size: 14px;
font-size: 1.4rem;
letter-spacing: 0;
color: #9b8b5c; }
@media only screen and (max-width: 767px) {
body.page-company .wrap main .sec--02 .desc p span {
font-size: 12px;
font-size: 1.2rem; } }
@media only screen and (max-width: 320px) {
body.page-company .wrap main .sec--02 .desc p span:nth-of-type(1) {
width: 23%;
line-height: 1.4; } }
@media only screen and (max-width: 320px) {
body.page-company .wrap main .sec--02 .desc p span:nth-of-type(2) {
width: 77%;
line-height: 1.4; } }
@media only screen and (max-width: 320px) {
body.page-company .wrap main .sec--02 .desc p:nth-of-type(2)::before {
top: 50%; } }
body.page-company .wrap main .sec--02 .bg {
width: 100%;
height: 100%;
background: #9b8b5c;
opacity: .1;
position: absolute;
top: 0;
z-index: -1; }

body.page-company .wrap main .sec--03 {
padding: 80px 0 120px; }
@media only screen and (max-width: 767px) {
body.page-company .wrap main .sec--03 {
padding: 48px 20px 85px; } }
body.page-company .wrap main .sec--03 .table {
padding: 47px 0 0;
max-width: 900px;
margin: 0 auto;
width: 100%; }
@media only screen and (max-width: 767px) {
body.page-company .wrap main .sec--03 .table {
padding: 40px 0 0; } }
body.page-company .wrap main .sec--03 .table .row {
width: 100%; }
@media only screen and (min-width: 768px) {
body.page-company .wrap main .sec--03 .table .row {
display: -webkit-flex;
display: flex;
-webkit-flex-wrap: wrap;
flex-wrap: wrap;
-webkit-justify-content: space-between;
justify-content: space-between; } }
@media only screen and (max-width: 767px) {
body.page-company .wrap main .sec--03 .table .row {
padding: 23px 0;
border-bottom: 1px solid #377ec3; } }
body.page-company .wrap main .sec--03 .table .row p {
padding: 32px 0;
font-size: 14px;
font-size: 1.4rem;
letter-spacing: 0;
border-bottom: 1px solid #cccccc; }
@media only screen and (max-width: 767px) {
body.page-company .wrap main .sec--03 .table .row p {
padding: 0;
border-bottom: none; } }
body.page-company .wrap main .sec--03 .table .row p:nth-of-type(1) {
width: 25%;
position: relative;
padding-left: 20px;
font-weight: bold; }
@media only screen and (max-width: 767px) {
body.page-company .wrap main .sec--03 .table .row p:nth-of-type(1) {
width: 100%;
border-bottom: none;
padding-left: 12px; } }
@media only screen and (min-width: 768px) {
body.page-company .wrap main .sec--03 .table .row p:nth-of-type(1)::before {
content: '';
border-bottom: 1px solid #377ec3;
position: absolute;
left: 0;
bottom: -2px;
width: 100%;
height: 1px; } }
body.page-company .wrap main .sec--03 .table .row p:nth-of-type(2) {
width: 75%;
padding-left: 40px; }
@media only screen and (max-width: 767px) {
body.page-company .wrap main .sec--03 .table .row p:nth-of-type(2) {
width: 100%;
padding-left: 12px;
margin: 10px 0 0;
line-height: 1.4; } }
@media only screen and (max-width: 767px) {
body.page-company .wrap main .sec--03 .table .row:nth-of-type(1) {
padding-top: 0; } }
@media only screen and (min-width: 768px) {
body.page-company .wrap main .sec--03 .table .row:nth-of-type(1) p {
padding-top: 0; } }
body.page-company .wrap main .sec--03 .map {
max-width: 900px;
width: 100%;
margin: 80px auto 0;
width: 100%;
height: 300px;
position: relative; }
@media only screen and (max-width: 767px) {
body.page-company .wrap main .sec--03 .map {
margin: 56px auto 0;
height: 185px; } }
body.page-company .wrap main .sec--03 .map h3 {
background: #9b8b5c;
width: 200px;
padding: 15px 0;
font-size: 16px;
font-size: 1.6rem;
letter-spacing: .12em;
text-align: center;
color: #fff;
position: absolute;
top: -20px;
left: 50%;
-webkit-transform: translate(-50%, 0);
-moz-transform: translate(-50%, 0);
-ms-transform: translate(-50%, 0);
-o-transform: translate(-50%, 0);
transform: translate(-50%, 0);
font-weight: bold;
font-family: "Open Sans", sans-serif; }
@media only screen and (max-width: 767px) {
body.page-company .wrap main .sec--03 .map h3 {
font-size: 12px;
font-size: 1.2rem;
width: 160px;
padding: 12px 0; } }
body.page-company .wrap main .sec--03 .map iframe {
width: 100%;
height: 100%; }
body.page-company .wrap main .sec--03 .map a {
font-size: 12px;
font-size: 1.2rem;
display: block;
text-align: right;
padding: 12px 0 0;
color: #9b8b5c; }
@media only screen and (max-width: 767px) {
body.page-company .wrap main .sec--03 .map a {
font-size: 11px;
font-size: 1.1rem;
padding: 5px 0 0; } }

body.home .bglight {
background-color: #377EC3; }

body.home .bgdark {
background-color: #0D406B; }

body.home .txtlight {
color: #B5DEDB; }

body.home .txtdark {
color: #377EC3; }

body.home .txtwhite {
color: white; }

body.home section {
min-width: 1040px; }
@media only screen and (max-width: 640px) {
body.home section {
min-width: inherit; } }
body.home section h2 {
font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "Sawarabi Mincho", serif;
font-size: 28px;
font-size: 2.8rem;
text-align: center;
margin: 74px auto 10px;
letter-spacing: 5px; }
@media only screen and (max-width: 640px) {
body.home section h2 {
font-size: 24px;
font-size: 2.4rem;
line-height: 1.3;
margin-top: 50px; } }
body.home section .subtitle {
text-align: center;
font-weight: bold;
font-size: 16px;
font-size: 1.6rem;
letter-spacing: 3px;
margin-bottom: 30px; }
@media only screen and (max-width: 640px) {
body.home section .subtitle {
font-size: 14px;
font-size: 1.4rem;
margin-bottom: 20px; } }

body.home #mainimage {
padding-top: 66px;
margin-bottom: 30px;
min-width: 1040px; }
@media only screen and (max-width: 640px) {
body.home #mainimage {
padding-top: 50px;
min-width: inherit; } }
body.home #mainimage .image_block {
position: relative; }
body.home #mainimage .image_block .main_capt {
position: absolute;
top: 100px;
left: 0;
width: 740px; }

body.home #search_bar {
text-align: center;
min-width: 1040px; }
@media only screen and (max-width: 640px) {
body.home #search_bar {
min-width: inherit; } }
body.home #search_bar .jsForm #panel_search {
background: none; }
body.home #search_bar .jsForm #panel_search:before {
content: none; }
body.home #search_bar .jsForm #panel_search .panelInner {
padding: 28px 0 28px 60px; }
@media only screen and (max-width: 640px) {
body.home #search_bar .jsForm #panel_search .panelInner {
padding: 28px 0 6px 0;
}
}
body.home #search_bar .jsForm #panel_search .panelInner:before {
content: '';
display: block;
width: 45px;
height: 45px;
background: url("../images/common/search_icon.png") center/44px auto no-repeat;
position: absolute;
left: 10px;
top: 42%;
-webkit-transform: translateY(-50%);
-moz-transform: translateY(-50%);
-ms-transform: translateY(-50%);
-o-transform: translateY(-50%);
transform: translateY(-50%); }
@media only screen and (max-width: 640px) {
body.home #search_bar .jsForm #panel_search .panelInner:before {
width: 75px;
height: 20px;
background: url("../images/common/search_icon_sp.png") center/75px 20px no-repeat;
top: 0;
left: 50%;
-webkit-transform: translateX(-50%);
-moz-transform: translateX(-50%);
-ms-transform: translateX(-50%);
-o-transform: translateX(-50%);
transform: translateX(-50%);
}
}

body.home #search_bar .jsForm #panel_search .jsInner {
padding: 0; }
body.home #search_bar .jsSearchTitle {
display: none; }
body.home #search_bar .jsSearchMessage {
display: none; }
body.home #search_bar .form2 {
display: none; }

body.home .grad_line {
height: 2px;
width: 100%; }

body.home .bluegrade {
background: #2d6ba7;
/* Old browsers */
background: -moz-linear-gradient(left, #2d6ba7 0%, #0e416d 100%);
/* FF3.6-15 */
background: -webkit-linear-gradient(left, #2d6ba7 0%, #0e416d 100%);
/* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to right, #2d6ba7 0%, #0e416d 100%);
/* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#2d6ba7', endColorstr='#0e416d',GradientType=1 );
/* IE6-9 */ }
@media only screen and (min-width: 641px) {
body.home .bluegrade {
margin: 0 0 86px 0;
}
}


body.home #page_link {
min-width: 1040px; }
@media only screen and (max-width: 640px) {
body.home #page_link {
min-width: inherit; } }
@media only screen and (max-width: 640px) {
body.home #page_link .container {
padding: 0; } }
body.home #page_link ul {
overflow: hidden; }
body.home #page_link ul a {
width: 50%;
height: 433px;
display: block;
position: relative;
opacity: 0;
float: left; }
@media only screen and (max-width: 640px) {
body.home #page_link ul a {
float: none;
width: 100%;
height: auto; } }
body.home #page_link ul a img {
width: 100%; }
body.home #page_link ul a .whitearea {
background-color: white;
padding: 40px 0;
position: absolute;
width: 500px;
height: 186px;
text-align: center;
top: 220px;
left: 0;
right: 0;
margin: auto; }
@media only screen and (max-width: 640px) {
body.home #page_link ul a .whitearea {
width: 90%;
height: auto;
position: relative;
top: -15px;
padding: 30px 0 20px; } }
body.home #page_link ul a .whitearea h3 {
font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "Sawarabi Mincho", serif;
letter-spacing: 3px;
font-size: 26px;
font-size: 2.6rem; }
body.home #page_link ul a .whitearea h3 span {
color: #377EC3;
font-size: 34px;
font-size: 3.4rem; }
@media only screen and (max-width: 640px) {
body.home #page_link ul a .whitearea h3 {
font-size: 22px;
font-size: 2.2rem; }
body.home #page_link ul a .whitearea h3 span {
font-size: 26px;
font-size: 2.6rem; } }
body.home #page_link ul a .whitearea .more_info {
border-radius: 25px;
height: 50px;
width: 242px;
margin: 30px auto;
color: white;
font-size: 14px;
font-size: 1.4rem;
font-weight: bold;
text-align: center;
line-height: 50px;
position: relative; }
@media all and (-ms-high-contrast: none){
body.home #page_link ul a .whitearea .more_info {
padding-top: 4px;
}
}
@media only screen and (max-width: 640px) {
body.home #page_link ul a .whitearea .more_info {
height: 40px;
border-radius: 20px;
width: 60%;
margin: 20px auto;
line-height: 40px; } }
body.home #page_link ul a .whitearea .more_info:after {
content: "";
display: block;
position: absolute;
width: 18px;
height: 18px;
top: 0;
bottom: 0;
right: 30px;
margin: auto;
background-image: url(../images/common/arrow.svg);
background-repeat: no-repeat;
background-position: center; }
@media only screen and (max-width: 640px) {
body.home #page_link ul a .whitearea .more_info:after {
right: 20px;
width: 14px;
height: 14px; } }

body.home #search {
padding-bottom: 70px;
position: relative;
overflow: hidden; }
@media only screen and (max-width: 640px) {
body.home #search {
padding-bottom: 35px; } }
body.home #search .backlogo {
opacity: 0.1;
position: absolute;
width: 280px;
top: -12px;
right: -30px; }
@media only screen and (max-width: 640px) {
body.home #search .backlogo {
width: 40%;
right: -10px;
top: -5px; } }
body.home #search .cont980 {
width: 90%; }

body.home #pickup ul a {
display: block;
width: 305px;
margin-right: 32px;
float: left;
border: 1px solid #0D406B;
padding: 18px;
box-sizing: border-box; }
@media only screen and (max-width: 640px) {
body.home #pickup ul a {
width: 75%;
margin: 0 auto 15px;
float: none; } }
body.home #pickup ul a:last-of-type {
margin-right: 0; }
@media only screen and (max-width: 640px) {
body.home #pickup ul a:last-of-type {
margin: 0 auto 15px; } }
body.home #pickup ul a .title_box {
position: relative;
width: 90%;
margin: 0 auto 36px; }
body.home #pickup ul a .title_box h3 {
background-color: #0D406B;
color: white;
text-align: center;
font-weight: bold;
font-size: 13px;
font-size: 1.3rem;
line-height: 20px;
padding: 5px 10px;
display: block;
position: absolute;
top: -26px;
width: 100%;
height: 52px;}
@media all and (-ms-high-contrast: none){
body.home #pickup ul a .title_box h3 {
padding-top: 4px;
line-height: 22px;
padding-bottom: 4px;
}
}
body.home #pickup ul a dl {
border-bottom: 1px solid #CCC;
overflow: hidden;
padding: 7px 0;}

@media only screen and (min-width: 641px) {
  body.home #pickup ul a dl {
    height: 45px;
  }
}


body.home #pickup ul a dl dt {
font-weight: bold;
width: 25%;
font-size: 12px;
font-size: 1.2rem;
line-height: 1.3;
float: left; }
body.home #pickup ul a dl dd {
font-size: 12px;
font-size: 1.2rem;
float: left;
line-height: 1.3;
overflow: hidden;
width: 75%; }

body.home #strength {
background-image: url(../images/top/six_reason_back.jpg);
background-position: center;
background-size: cover;
height: 722px;
margin-top: 68px; }
@media only screen and (max-width: 640px) {
body.home #strength {
margin-top: 58px;
}
}
body.home #strength h2:before {
content: "";
display: inline-block;
width: 37px;
height: 37px;
background-image: url(../images/common/point_logo_gr.svg);
background-repeat: no-repeat;
margin-bottom: -5px;
margin-right: 15px; }
body.home #strength ul {
overflow: hidden; }
body.home #strength ul li {
width: 304px;
height: 214px;
margin-right: 34px;
margin-bottom: 40px;
float: left;
opacity: 0;
background-color: white;
background-image: linear-gradient(135deg, #9B8B5C 25px, transparent 0); }
@media only screen and (max-width: 640px) {
body.home #strength ul li {
width: 45%;
height: 160px;
margin: 0 0 15px 3.3%;
background-image: linear-gradient(135deg, #9B8B5C 15px, transparent 0); }
body.home #strength ul li:nth-child(2n) {
margin-right: 0; } }
body.home #strength ul li:nth-child(3n) {
margin-right: 0; }
@media only screen and (max-width: 640px) {
body.home #strength ul li:nth-child(3n) {
margin-right: auto; } }
body.home #strength ul li figure {
text-align: center;
margin: 40px auto 21px; }
@media only screen and (max-width: 640px) {
body.home #strength ul li figure {
margin: 20px auto; } }
body.home #strength ul li figure img {
height: 67px; }
@media only screen and (max-width: 640px) {
body.home #strength ul li figure img {
height: 60px; } }
body.home #strength ul li p {
height: 52px;
display: flex;
display: -webkit-flex;
display: -ms-flex;
display: -moz-flex;
align-items: center;
-webkit-align-items: center;
-ms-align-items: center;
-moz-align-items: center;
justify-content: center;
-webkit-justify-content: center;
-moz-justify-content: center;
-ms-justify-content: center;
font-size: 20px;
font-size: 2rem;
color: #377EC3;
font-weight: bold;
line-height: 1.3em;
text-align: center;}
@media only screen and (max-width: 640px) {
body.home #strength ul li p {
font-size: 16px;
height: 40px;
font-size: 1.6rem; } }

body.home #company {
background: linear-gradient(#0D406B 67%, rgba(255, 255, 255, 0) 33%);
text-align: center;
position: relative;
overflow: hidden; }
@media only screen and (max-width: 640px) {
body.home #company {
background: linear-gradient(#0D406B 60%, rgba(255, 255, 255, 0) 40%); } }
body.home #company .cont980 {
padding-bottom: 200px;
opacity: 0;}
@media only screen and (max-width: 640px) {
body.home #company .cont980 {
width: 90%; } }
body.home #company .subtitle {
color: #9B8B5C; }
body.home #company .info {
color: white;
margin-bottom: 30px;
font-size: 16px;
font-size: 1.6rem;
text-align: center;}
@media only screen and (max-width: 640px) {
body.home #company .info {
font-size: 13px;
font-size: 1.3rem; } }
body.home #company .company_image {
width: 818px; }
@media only screen and (max-width: 640px) {
body.home #company .company_image {
width: 100%; } }
body.home #company .company_back_logo {
position: absolute;
width: 350px;
height: 350px;
left: 0;
right: -900px;
margin: auto;
top: 360px;
opacity: 0.2; }
body.home #company .btn_box {
position: relative; }
body.home #company .more_info {
border-radius: 25px;
height: 50px;
width: 242px;
margin: auto;
color: white;
font-size: 14px;
font-size: 1.4rem;
font-weight: bold;
text-align: center;
line-height: 50px;
position: absolute;
top: -15px;
right: 0;
left: 0; }
@media all and (-ms-high-contrast: none){
body.home #company .more_info {
padding-top: 4px;
}
}
body.home #company .more_info:after {
content: "";
display: block;
position: absolute;
width: 18px;
height: 18px;
top: 0;
bottom: 0;
right: 30px;
margin: auto;
background-image: url(../images/common/arrow.svg);
background-repeat: no-repeat;
background-position: center;
transform: rotate(-90deg); }

body.home #service {
margin-top: -140px;
position: relative;
overflow: hidden; }
body.home #service .service_inner{
max-width: 1000px;
margin: 0 auto;
}
body.home #service .company_back_logo_sp {
position: absolute;
width: 40%;
height: 150px;
right: -30px;
top: 0px;
opacity: 0.2; }
body.home #service .subtitle {
color: #0D406B; }
body.home #service ul {
overflow: hidden;
opacity: 0;
margin: 50px auto; }
@media only screen and (max-width: 640px) {
body.home #service ul {
margin-bottom: 25px; } }
body.home #service ul li {
border-left: 5px solid #0D406B;
display: block;
position: relative;
float: left;
width: 50%;
padding:28px 26px 28px 47px;
height: 240px;
margin-bottom: 40px; }
body.home #service ul li:nth-child(2), body.home #service ul li:nth-child(3) {
border-left: 5px solid #377EC3; }
body.home #service ul li:nth-child(2) a, body.home #service ul li:nth-child(3) a {
color: #377EC3; }
@media only screen and (max-width: 640px) {
body.home #service ul li {
width: 90%;
margin: 0 auto 20px;
height: auto;
padding: 20px 5px 20px 30px;
float: none; }
body.home #service ul li:nth-child(3) {
border-left: 5px solid #0D406B; }
body.home #service ul li:nth-child(3) a {
color: #0D406B; }
body.home #service ul li:nth-child(4) {
border-left: 5px solid #377EC3; }
body.home #service ul li:nth-child(4) a {
color: #377EC3; } }
body.home #service ul li h3 {
font-size: 24px;
font-size: 2.4rem;
font-weight: bold;
letter-spacing: 2px;
display: flex;
align-items: center; }
body.home #service ul li h3:before {
font-size: 46px;
font-size: 4.6rem;
color: #ABBAC9;
margin-right: 15px;
font-family: adobe-garamond-pro, serif;
font-weight: 400;
font-style: normal;
letter-spacing: -0.02em; }
@media only screen and (max-width: 640px) {
body.home #service ul li h3:before {
font-size: 40px;
font-size: 4rem;
margin-right: 10px;
}
}
body.home #service ul li h3.no01:before {
content: "01"; }
body.home #service ul li h3.no02:before {
content: "02";
color: #A8C7E5; }
body.home #service ul li h3.no03:before {
content: "03";
color: #A8C7E5; }
@media only screen and (max-width: 640px) {
body.home #service ul li h3{
font-size: 17.5px;
}
body.home #service ul li h3.no03:before {
color: #ABBAC9; } }
body.home #service ul li h3.no04:before {
content: "04"; }
@media only screen and (max-width: 640px) {
body.home #service ul li h3.no04:before {
color: #A8C7E5; } }
body.home #service ul li p {
line-height: 1.5em;
margin-top: 18px;
font-size: 14px;
font-size: 1.4rem; }
@media only screen and (max-width: 640px) {
body.home #service ul li p {
font-size: 12px;
font-size: 1.2rem; } }
body.home #service ul li a {
border: 1px solid #ccc;
bottom: 10px;
border-radius: 25px;
height: 50px;
width: 242px;
margin: auto;
color: #0D406B;
font-size: 14px;
font-size: 1.4rem;
font-weight: bold;
text-align: center;
line-height: 50px;
position: absolute; }
@media only screen and (max-width: 640px) {
body.home #service ul li a {
position: relative;
display: block;
bottom: -15px;
margin: 0;
width: 200px;
height: 40px;
font-size: 12px;
border-radius: 20px;
line-height: 40px; } }
body.home #service ul li a:after {
content: "";
display: block;
position: absolute;
top: 0;
bottom: 0;
right: 30px;
width: 18px;
height: 10px;
background: url('../images/common/arrow2.png') center/18px 10px no-repeat;
margin: auto; }
body.home #service ul li:nth-child(2) a:after{
background: url('../images/common/arrow.png') center/18px 10px no-repeat;
}
body.home #service ul li:nth-child(3) a:after{
background: url('../images/common/arrow.png') center/18px 10px no-repeat;
}
@media only screen and (max-width: 640px) {
body.home #service ul li a:after {
right: 15px;
font-size: 10px;
font-size: 1rem; }
body.home #service ul li:nth-child(3) a:after{
background: url('../images/common/arrow2.png') center/18px 10px no-repeat;
}
body.home #service ul li:nth-child(4) a:after{
background: url('../images/common/arrow.png') center/18px 10px no-repeat;
}
}

body.page-service .wrap main .links {
padding: 80px 0 0;
margin-bottom: 74px;}
@media only screen and (max-width: 767px) {
body.page-service .wrap main .links {
padding: 45px 20px 0;
margin-bottom: 4px;} }
@media only screen and (min-width: 768px) {
body.page-service .wrap main .links ul {
display: -webkit-flex;
display: flex;
-webkit-flex-wrap: wrap;
flex-wrap: wrap;
-webkit-justify-content: space-between;
justify-content: space-between; } }
body.page-service .wrap main .links ul li {
width: calc(100% / 4 - 12px); }
@media only screen and (max-width: 767px) {
body.page-service .wrap main .links ul li {
width: 100%;
margin: 10px 0 0; } }
@media only screen and (min-width: 768px) {
body.page-service .wrap main .links ul li::before {
content: '';
display: block;
width: 47px;
height: 37px;
margin-bottom: 15px; } }
body.page-service .wrap main .links ul li:nth-of-type(1)::before {
background: url(../images/service/icon01.png) center/cover no-repeat; }
body.page-service .wrap main .links ul li:nth-of-type(2)::before {
background: url(../images/service/icon02.png) center/cover no-repeat; }
body.page-service .wrap main .links ul li:nth-of-type(3)::before {
background: url(../images/service/icon03.png) center/cover no-repeat; }
body.page-service .wrap main .links ul li:nth-of-type(4)::before {
background: url(../images/service/icon04.png) center/cover no-repeat; }
@media only screen and (max-width: 767px) {
body.page-service .wrap main .links ul li:nth-of-type(1) {
margin: 0; } }
body.page-service .wrap main .links ul li:nth-of-type(2)::before {
width: 50px; }

body.page-service .wrap main .sec--01, body.page-service .wrap main .sec--02 {
display: block;
width: 100%;
position: relative;
margin-bottom: 115px;
padding: 115px 0 100px; }
@media only screen and (max-width: 767px) {
body.page-service .wrap main .sec--01, body.page-service .wrap main .sec--02 {
padding: 74px 0 55px;
margin-bottom: 10px;} }
body.page-service .wrap main .sec--01::before, body.page-service .wrap main .sec--02::before {
content: '';
display: block;
width: 100%;
height: calc(100% - 100px);
position: absolute;
z-index: -1;
top: 215px; }
@media only screen and (max-width: 767px) {
body.page-service .wrap main .sec--01::before, body.page-service .wrap main .sec--02::before {
width: 88%;
top: 108px; } }
body.page-service .wrap main .sec--01 .sec--box {
background: #e7ecf0;
width: 85%; }
body.page-service .wrap main .sec--02 .sec--box{
  background: #ebf2f9;
  width: 85%;
}
@media only screen and (max-width: 767px) {
body.page-service .wrap main .sec--01 .sec--box, body.page-service .wrap main .sec--02 .sec--box {
width: 100%; } }
body.page-service .wrap main .sec--01 .sec--box::after, body.page-service .wrap main .sec--02 .sec--box::after {
content: '';
display: block;
width: 67px;
height: 52px;
position: absolute;
top: 88px; }
@media only screen and (max-width: 767px) {
body.page-service .wrap main .sec--01 .sec--box::after, body.page-service .wrap main .sec--02 .sec--box::after {
top: 64px; } }
body.page-service .wrap main .sec--01 .sec--box .inner-box-wrapper, body.page-service .wrap main .sec--02 .sec--box .inner-box-wrapper {
width: 89%;
margin: 0 auto; }
@media only screen and (max-width: 767px) {
body.page-service .wrap main .sec--01 .sec--box .inner-box-wrapper, body.page-service .wrap main .sec--02 .sec--box .inner-box-wrapper {
width: 100%; } }
body.page-service .wrap main .sec--01 .sec--box .inner-box-wrapper .inner-box, body.page-service .wrap main .sec--02 .sec--box .inner-box-wrapper .inner-box {
background: #fff;
padding: 45px 40px 45px 0;
position: relative; }
@media only screen and (min-width: 768px) {
body.page-service .wrap main .sec--01 .sec--box .inner-box-wrapper .inner-box, body.page-service .wrap main .sec--02 .sec--box .inner-box-wrapper .inner-box {
display: -webkit-flex;
display: flex;
-webkit-flex-wrap: wrap;
flex-wrap: wrap;
-webkit-justify-content: space-between;
justify-content: space-between;} }
@media only screen and (max-width: 767px) {
body.page-service .wrap main .sec--01 .sec--box .inner-box-wrapper .inner-box, body.page-service .wrap main .sec--02 .sec--box .inner-box-wrapper .inner-box {
padding: 35px 18px 30px; } }
@media all and (-ms-high-contrast: none) {
body.page-service .wrap main .sec--01 .sec--box .inner-box-wrapper .inner-box, body.page-service .wrap main .sec--02 .sec--box .inner-box-wrapper .inner-box {
padding: 40px 20px 40px 0; } }
body.page-service .wrap main .sec--01 .sec--box .inner-box-wrapper .inner-box:nth-of-type(1), body.page-service .wrap main .sec--02 .sec--box .inner-box-wrapper .inner-box:nth-of-type(1) {
margin: 40px 0 0; }
body.page-service .wrap main .sec--01 .sec--box .inner-box-wrapper .inner-box:nth-of-type(2), body.page-service .wrap main .sec--02 .sec--box .inner-box-wrapper .inner-box:nth-of-type(2) {
margin: 20px 0 0; }
body.page-service .wrap main .sec--01 .sec--box .inner-box-wrapper .inner-box::before, body.page-service .wrap main .sec--02 .sec--box .inner-box-wrapper .inner-box::before {
content: '';
border-width: 0 30px 30px 30px;
border-color: transparent transparent #9b8b5c transparent;
border-style: solid;
position: absolute;
top: -5px;
left: -20px;
-webkit-transform: rotate(-45deg);
-moz-transform: rotate(-45deg);
-ms-transform: rotate(-45deg);
-o-transform: rotate(-45deg);
transform: rotate(-45deg); }
@media only screen and (max-width: 767px) {
body.page-service .wrap main .sec--01 .sec--box .inner-box-wrapper .inner-box::before, body.page-service .wrap main .sec--02 .sec--box .inner-box-wrapper .inner-box::before {
border-width: 0 20px 20px 20px;
left: -14px; } }
body.page-service .wrap main .sec--01 .sec--box .inner-box-wrapper .inner-box .left, body.page-service .wrap main .sec--02 .sec--box .inner-box-wrapper .inner-box .left {
width: 47%;
text-align: center; }
@media only screen and (max-width: 767px) {
body.page-service .wrap main .sec--01 .sec--box .inner-box-wrapper .inner-box .left, body.page-service .wrap main .sec--02 .sec--box .inner-box-wrapper .inner-box .left {
width: 100%; } }
body.page-service .wrap main .sec--01 .sec--box .inner-box-wrapper .inner-box .left .icon, body.page-service .wrap main .sec--02 .sec--box .inner-box-wrapper .inner-box .left .icon {
display: block;
margin: 0 auto;
width: 49px;
height: 49px; }
@media only screen and (max-width: 767px) {
body.page-service .wrap main .sec--01 .sec--box .inner-box-wrapper .inner-box .left .icon, body.page-service .wrap main .sec--02 .sec--box .inner-box-wrapper .inner-box .left .icon {
width: 40px;
height: 40px; } }
body.page-service .wrap main .sec--01 .sec--box .inner-box-wrapper .inner-box .left p, body.page-service .wrap main .sec--02 .sec--box .inner-box-wrapper .inner-box .left p {
font-size: 20px;
font-size: 2rem;
line-height: 1.65;
padding: 23px 0 0;
color: #0d406b;
font-weight: bold;
text-align: center; }
@media only screen and (max-width: 767px) {
body.page-service .wrap main .sec--01 .sec--box .inner-box-wrapper .inner-box .left p, body.page-service .wrap main .sec--02 .sec--box .inner-box-wrapper .inner-box .left p {
font-size: 16px;
font-size: 1.6rem;
line-height: 1.625;
padding: 25px 0 0; } }
body.page-service .wrap main .sec--01 .sec--box .inner-box-wrapper .inner-box .left p .border, body.page-service .wrap main .sec--02 .sec--box .inner-box-wrapper .inner-box .left p .border {
display: inline-block;
position: relative; }
body.page-service .wrap main .sec--01 .sec--box .inner-box-wrapper .inner-box .left p .border::before, body.page-service .wrap main .sec--01 .sec--box .inner-box-wrapper .inner-box .left p .border::after, body.page-service .wrap main .sec--02 .sec--box .inner-box-wrapper .inner-box .left p .border::before, body.page-service .wrap main .sec--02 .sec--box .inner-box-wrapper .inner-box .left p .border::after {
content: '';
display: block;
width: 100%;
height: 1px;
background: #9b8b5c;
position: absolute;
left: 0; }
body.page-service .wrap main .sec--01 .sec--box .inner-box-wrapper .inner-box .left p .border::before, body.page-service .wrap main .sec--02 .sec--box .inner-box-wrapper .inner-box .left p .border::before {
bottom: -2px; }
body.page-service .wrap main .sec--01 .sec--box .inner-box-wrapper .inner-box .left p .border::after, body.page-service .wrap main .sec--02 .sec--box .inner-box-wrapper .inner-box .left p .border::after {
bottom: -5px; }
body.page-service .wrap main .sec--01 .sec--box .inner-box-wrapper .inner-box .right, body.page-service .wrap main .sec--02 .sec--box .inner-box-wrapper .inner-box .right {
width: 53%;
font-size: 14px;
font-size: 1.4rem;
line-height: 2; }
@media all and (-ms-high-contrast: none) {
body.page-service .wrap main .sec--01 .sec--box .inner-box-wrapper .inner-box .right, body.page-service .wrap main .sec--02 .sec--box .inner-box-wrapper .inner-box .right {
width: 50%; } }
@media screen and (min-width: 768px) and (max-width: 1024px) {
body.page-service .wrap main .sec--01 .sec--box .inner-box-wrapper .inner-box .right, body.page-service .wrap main .sec--02 .sec--box .inner-box-wrapper .inner-box .right {
padding: 0 0 0 10px; } }
@media only screen and (max-width: 767px) {
body.page-service .wrap main .sec--01 .sec--box .inner-box-wrapper .inner-box .right, body.page-service .wrap main .sec--02 .sec--box .inner-box-wrapper .inner-box .right {
width: 100%;
margin: 30px 0 0;
font-size: 14px;
font-size: 1.4rem;
line-height: 1.916666667; } }
body.page-service .wrap main .sec--01 .sec--box .inner-box-wrapper .flow, body.page-service .wrap main .sec--02 .sec--box .inner-box-wrapper .flow {
display: block;
max-width: 920px;
margin: 33px auto 0; }

body.page-service .wrap main .sec--01::before {
background: linear-gradient(to right, #2d6ba7, #0d406b); }
@media only screen and (max-width: 767px) {
body.page-service .wrap main .sec--01::before {
right: 0; } }

body.page-service .wrap main .sec--01 .sec--box {
padding: 90px 10px 80px 160px; }
@media only screen and (max-width: 767px) {
body.page-service .wrap main .sec--01 .sec--box {
padding: 61px 20px 60px; } }
body.page-service .wrap main .sec--01 .sec--box::after {
background: url(../images/service/no01.svg) center/cover no-repeat;
right: 24%; }
@media only screen and (max-width: 767px) {
body.page-service .wrap main .sec--01 .sec--box::after {
right: 7%;
width: 52px;
height: 40px; } }
@media only screen and (max-width: 767px) {
body.page-service .wrap main .sec--01 .sec--box .inner-box-wrapper .flow {
margin: 25px 0 0; } }

body.page-service .wrap main .sec--02::before {
background: linear-gradient(to left, #8ab3dc, #387fc3); }

body.page-service .wrap main .sec--02 .sec--box {
margin-left: auto;
padding: 90px 160px 80px 10px; }
@media only screen and (max-width: 767px) {
body.page-service .wrap main .sec--02 .sec--box {
padding: 61px 20px 60px; } }
body.page-service .wrap main .sec--02 .sec--box::after {
background: url(../images/service/no02.svg) center/cover no-repeat;
left: 22%;
width: 73px; }
@media only screen and (max-width: 767px) {
body.page-service .wrap main .sec--02 .sec--box::after {
left: 7%;
width: 57px;
height: 40px; } }
@media only screen and (max-width: 767px) {
body.page-service .wrap main .sec--02 .sec--box .inner-box-wrapper .inner-box .left p {
color: #377ec3; } }
@media only screen and (max-width: 767px) {
body.page-service .wrap main .sec--02 .sec--box .inner-box-wrapper .flow {
margin: 37px 0 0; } }
body.page-service .wrap main .sec--02 .sec--box .inner-box-wrapper .inner-box:nth-of-type(1) .left .icon {
width: 54px;
height: 54px; }
@media only screen and (max-width: 767px) {
body.page-service .wrap main .sec--02 .sec--box .inner-box-wrapper .inner-box:nth-of-type(1) .left .icon {
width: 50px;
height: 50px; } }
body.page-service .wrap main .sec--02 .sec--box .inner-box-wrapper .inner-box:nth-of-type(1) .left p {
color: #377ec3;
padding: 26px 0 0; }
@media only screen and (max-width: 767px) {
body.page-service .wrap main .sec--02 .sec--box .inner-box-wrapper .inner-box:nth-of-type(1) .left p {
padding: 22px 0 0; } }
@media only screen and (max-width: 767px) {
body.page-service .wrap main .sec--02 .sec--box .inner-box-wrapper .inner-box:nth-of-type(1) .right {
margin: 20px 0 0; } }
@media only screen and (max-width: 767px) {
body.page-service .wrap main .sec--02 .sec--box .inner-box-wrapper .inner-box:nth-of-type(2) .left .icon {
width: 45px;
height: 45px; } }
body.page-service .wrap main .sec--02 .sec--box .inner-box-wrapper .inner-box:nth-of-type(2) .left p {
color: #377ec3; }
@media only screen and (max-width: 767px) {
body.page-service .wrap main .sec--02 .sec--box .inner-box-wrapper .inner-box:nth-of-type(2) .left p {
padding: 15px 0 0; } }

body.page-service .wrap main .bg {
position: relative;
padding: 0 0 120px; }
@media only screen and (max-width: 767px) {
body.page-service .wrap main .bg {
padding: 0; } }
@media only screen and (min-width: 768px) {
body.page-service .wrap main .bg::before {
content: '';
display: block;
position: absolute;
width: 100%;
height: calc(100% - 120px);
background: linear-gradient(to right, #2d6ba7, #0c416c);
z-index: -1;
top: 235px; } }
@media only screen and (min-width: 768px) {
body.page-service .wrap main .bg .sec-wrapper {
  padding-top: 115px;
display: -webkit-flex;
display: flex;
-webkit-flex-wrap: wrap;
flex-wrap: wrap;
-webkit-justify-content: space-between;
justify-content: space-between;
width: 980px;
margin: 140px auto 0; } }
@media only screen and (max-width: 767px) {
body.page-service .wrap main .bg .sec-wrapper {
margin: 88px 0 0; } }
body.page-service .wrap main .bg .sec-wrapper .sec {
width: 48%;
margin: 0 1px;
padding: 80px 40px;
height: 590px;
position: relative; }
@media only screen and (max-width: 767px) {
body.page-service .wrap main .bg .sec-wrapper .sec {
width: 100%;
padding: 63px 20px 65px;
height: auto; } }
body.page-service .wrap main .bg .sec-wrapper .sec .img {
display: block;
padding: 44px 0 0; }
body.page-service .wrap main .bg .sec-wrapper .sec::before {
content: '';
display: block;
width: 67px;
height: 52px;
position: absolute;
top: -30px; }
@media only screen and (max-width: 767px) {
body.page-service .wrap main .bg .sec-wrapper .sec::before {
top: -15px; } }
body.page-service .wrap main .bg .sec-wrapper .sec .txt {
padding: 10px 0 0;
font-weight: normal;
text-align: left; }
body.page-service .wrap main .bg .sec-wrapper .sec--03 {
background: #e7ecf0; }
@media only screen and (max-width: 767px) {
body.page-service .wrap main .bg .sec-wrapper .sec--03 {
padding: 63px 20px 48px;
margin-bottom: 60px; } }
@media only screen and (max-width: 767px) {
body.page-service .wrap main .bg .sec-wrapper .sec--03::after {
content: '';
width: 89%;
height: 100%;
position: absolute;
top: 55px;
right: 0;
background: linear-gradient(to right, #2d6ba7, #0d406b);
z-index: -1; } }
body.page-service .wrap main .bg .sec-wrapper .sec--03::before {
background: url(../images/service/no03.svg) center/cover no-repeat; }
@media only screen and (max-width: 767px) {
body.page-service .wrap main .bg .sec-wrapper .sec--03::before {
right: 7%;
width: 53px;
height: 40px; } }
body.page-service .wrap main .bg .sec-wrapper .sec--04 {
background: #ebf2f9; }
@media only screen and (max-width: 767px) {
body.page-service .wrap main .bg .sec-wrapper .sec--04 {
margin: 40px 0 55px; } }
@media only screen and (max-width: 767px) {
body.page-service .wrap main .bg .sec-wrapper .sec--04::after {
content: '';
width: 89%;
height: 100%;
position: absolute;
top: 55px;
left: 0;
background: linear-gradient(to left, #8ab3dc, #387fc3);
z-index: -1; } }
body.page-service .wrap main .bg .sec-wrapper .sec--04::before {
background: url(../images/service/no04.svg) center/cover no-repeat;
right: 7%; }
@media only screen and (max-width: 767px) {
body.page-service .wrap main .bg .sec-wrapper .sec--04::before {
left: 7%;
width: 53px;
height: 40px; } }
body.page-service main .head .title-area {
width: 100%;
height: auto;
background: linear-gradient(to right, #2d6ba7, #0d406b);
padding: 70px 0 150px;
text-align: center;
position: relative; }
@media only screen and (max-width: 767px) {
body.page-service main .head .title-area {
padding: 45px 0 135px; } }
body.page-service main .head .title-area::before {
content: '';
display: block;
width: 220px;
height: 238px;
background: url(../images/company/logo01.svg) top right/220px 238px no-repeat;
position: absolute;
right: 0;
top: 0; }
@media only screen and (max-width: 767px) {
body.page-service main .head .title-area::before {
width: 80px;
height: 84px;
background-size: 80px 84px;} }
body.page-service main .head .title-area h2 {
color: #fff;
font-size: 32px;
font-size: 3.2rem;
letter-spacing: .08em;
font-family: "Hannari", serif; }
@media only screen and (max-width: 767px) {
body.page-service main .head .title-area h2 {
font-size: 25px;
font-size: 2.5rem; } }
body.page-service main .head .title-area span {
display: block;
color: #9b8b5c;
font-size: 16px;
font-size: 1.6rem;
letter-spacing: .12em;
padding: 12px 0 0;
font-family: "Open Sans", sans-serif; }
@media only screen and (max-width: 767px) {
body.page-service main .head .title-area span {
font-size: 12px;
font-size: 1.2rem; } }

body.page-service main .head .mv {
margin-top: -100px;
position: relative;
z-index: 100; }
@media only screen and (max-width: 767px) {
body.page-service main .head .mv {
margin-top: -100px;
width: 89%;
height: 175px; } }

body.page-service main .sec .sec-title h3 {
display: block;
font-size: 25px;
font-size: 2.5rem;
letter-spacing: .08em;
text-align: center;
color: #333333;
font-family: "Hannari", serif; }
@media only screen and (max-width: 767px) {
body.page-service main .sec .sec-title h3 {
font-size: 22px;
font-size: 2.2rem; } }

body.page-service main .sec .sec-title::after {
content: '';
display: inline-block;
width: 42px;
height: 2px;
background: #9b8b5c;
margin: 20px 0;
position: relative;
left: 50%;
-webkit-transform: translate(-50%, 0);
-moz-transform: translate(-50%, 0);
-ms-transform: translate(-50%, 0);
-o-transform: translate(-50%, 0);
transform: translate(-50%, 0); }
@media all and (-ms-high-contrast: none) {
body.page-service main .sec .sec-title::after {
display: block; } }
@media only screen and (max-width: 767px) {
body.page-service main .sec .sec-title::after {
margin: 12px 0; } }

body.page-service main .sec .sec-title span {
font-size: 17px;
font-size: 1.7rem;
display: block;
width: 100%;
text-align: center;
color: #333333;
padding: 10px 0 0;
font-family: "Hannari", serif; }

body.page-service main .sec .txt {
text-align: center;
font-weight: bold;
font-size: 15px;
font-size: 1.5rem;
line-height: 2;
letter-spacing: 0;
padding: 30px 0 0; }
@media only screen and (max-width: 767px) {
body.page-service main .sec .txt {
font-size: 14px;
font-size: 1.4rem;
padding: 24px 0 0;
margin: 0 auto;
text-align: left; } }
body.page-company main .head .title-area {
width: 100%;
height: auto;
background: linear-gradient(to right, #2d6ba7, #0d406b);
padding: 70px 0 150px;
text-align: center;
position: relative; }
@media only screen and (max-width: 767px) {
body.page-company main .head .title-area {
padding: 45px 0 135px; } }
body.page-company main .head .title-area::before {
content: '';
display: block;
width: 220px;
height: 238px;
background: url(../images/company/logo01.svg) top right/220px 238px no-repeat;
position: absolute;
right: 0;
top: 0; }
@media only screen and (max-width: 767px) {
body.page-company main .head .title-area::before {
width: 80px;
height: 84px;
background-size: 80px 84px;} }
body.page-company main .head .title-area h2 {
color: #fff;
font-size: 32px;
font-size: 3.2rem;
letter-spacing: .08em;
font-family: "Hannari", serif; }
@media only screen and (max-width: 767px) {
body.page-company main .head .title-area h2 {
font-size: 25px;
font-size: 2.5rem; } }
body.page-company main .head .title-area span {
display: block;
color: #9b8b5c;
font-size: 16px;
font-size: 1.6rem;
letter-spacing: .12em;
padding: 12px 0 0;
font-family: "Open Sans", sans-serif; }
@media only screen and (max-width: 767px) {
body.page-company main .head .title-area span {
font-size: 12px;
font-size: 1.2rem; } }

body.page-company main .head .mv {
margin-top: -100px;
position: relative;
z-index: 100; }
@media only screen and (max-width: 767px) {
body.page-company main .head .mv {
margin-top: -100px;
width: 89%;
height: 175px; } }

body.page-company main .sec .sec-title h3 {
display: block;
font-size: 27px;
font-size: 2.7rem;
letter-spacing: .08em;
text-align: center;
color: #333333;
font-family: 'EB Garamond', serif; }
@media only screen and (max-width: 767px) {
body.page-company main .sec .sec-title h3 {
font-size: 22px;
font-size: 2.2rem; } }

body.page-company main .sec .sec-title::after {
content: '';
display: inline-block;
width: 42px;
height: 2px;
background: #9b8b5c;
margin: 20px 0;
position: relative;
left: 50%;
-webkit-transform: translate(-50%, 0);
-moz-transform: translate(-50%, 0);
-ms-transform: translate(-50%, 0);
-o-transform: translate(-50%, 0);
transform: translate(-50%, 0); }
@media all and (-ms-high-contrast: none) {
body.page-company main .sec .sec-title::after {
display: block; } }
@media only screen and (max-width: 767px) {
body.page-company main .sec .sec-title::after {
margin: 12px 0; } }

body.page-company main .sec .sec-title span {
font-size: 17px;
font-size: 1.7rem;
display: block;
width: 100%;
text-align: center;
color: #333333;
padding: 10px 0 0;
font-family: "Hannari", serif; }

body.page-company main .sec .txt {
text-align: center;
font-weight: bold;
font-size: 15px;
font-size: 1.5rem;
line-height: 2;
letter-spacing: 0;
padding: 30px 0 0; }
@media only screen and (max-width: 767px) {
body.page-company main .sec .txt {
font-size: 14px;
font-size: 1.4rem;
padding: 24px 0 0;
margin: 0 auto;
text-align: left; } }

#pickup .cont980{
  opacity: 0;
}