@charset "UTF-8";
.addtoany_content{clear:both;margin:16px auto}.addtoany_header{margin:0 0 16px}.addtoany_list{display:inline;line-height:16px}.addtoany_list a,.widget .addtoany_list a{border:0;box-shadow:none;display:inline-block;font-size:16px;padding:0 4px;vertical-align:middle}.addtoany_list a img{border:0;display:inline-block;opacity:1;overflow:hidden;vertical-align:baseline}.addtoany_list a span{display:inline-block;float:none}.addtoany_list.a2a_kit_size_32 a{font-size:32px}.addtoany_list.a2a_kit_size_32 a:not(.addtoany_special_service)>span{height:32px;line-height:32px;width:32px}.addtoany_list a:not(.addtoany_special_service)>span{border-radius:4px;display:inline-block;opacity:1}.addtoany_list a .a2a_count{position:relative;vertical-align:top}.addtoany_list a:hover,.widget .addtoany_list a:hover{border:0;box-shadow:none}.addtoany_list a:hover img,.addtoany_list a:hover span{opacity:.7}.addtoany_list a.addtoany_special_service:hover img,.addtoany_list a.addtoany_special_service:hover span{opacity:1}.addtoany_special_service{display:inline-block;vertical-align:middle}.addtoany_special_service a,.addtoany_special_service div,.addtoany_special_service div.fb_iframe_widget,.addtoany_special_service iframe,.addtoany_special_service span{margin:0;vertical-align:baseline!important}.addtoany_special_service iframe{display:inline;max-width:none}a.addtoany_share.addtoany_no_icon span.a2a_img_text{display:none}a.addtoany_share img{border:0;width:auto;height:auto}
 html {
overflow-y: scroll;
}
fieldset, img {
border: none;
vertical-align: top;
}
ul, ol {
list-style-type: none;
}
address, caption, cite, code, dfn, em, var {
font-style: normal;
}
caption, th {
text-align: left;
}
a {
outline: none;
} h1, h2, h3, h4, h5, h6,
html, body, div,
p, ul, ol, li, dl, dt, dd,
pre, blockquote,
form, fieldset, input, textarea,
table, th, td, figure {
margin: 0;
padding: 0;
} q:before, q:after {
content: '';
}
table {
border-collapse: collapse;
border-spacing: 0;
}
:root {
color: #000;
}
@media (max-width: 1000px) {
:root {
-webkit-text-size-adjust: 100%;
-moz-text-size-adjust: 100%;
-ms-text-size-adjust: 100%;
text-size-adjust: 100%;
}
}
body {
color: #000;
line-height: 1.5;
font-family: "tbudrgothic-std", "Hiragino Maru Gothic StdN", "ヒラギノ丸ゴ Pro", "Hiragino Maru Gothic Pro", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "HG丸ｺﾞｼｯｸM-PRO", "HGMaruGothicMPRO";
font-size: 13px;
}
@media (max-width: 1000px) {
body {
-webkit-text-size-adjust: 100%;
-moz-text-size-adjust: 100%;
-ms-text-size-adjust: 100%;
text-size-adjust: 100%;
min-width: 640px;
font-size: 24px;
}
}
@media (max-width: 1000px) {
#colorbox, #colorbox * {
max-height: none;
}
#gnavi, #gnavi * {
max-height: none;
}
img {
max-height: none;
max-width: 100%;
}
}
h1, h2, h3, h4, h5, h6 {
font-size: 100%;
font-family: "tbudrgothic-std", "Hiragino Maru Gothic StdN", "ヒラギノ丸ゴ Pro", "Hiragino Maru Gothic Pro", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "HG丸ｺﾞｼｯｸM-PRO", "HGMaruGothicMPRO";
font-weight: 700 !important;
}
p {
font-family: "tbudrgothic-std", "Hiragino Maru Gothic StdN", "ヒラギノ丸ゴ Pro", "Hiragino Maru Gothic Pro", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "HG丸ｺﾞｼｯｸM-PRO", "HGMaruGothicMPRO";
}
button, fieldset, form, input, label, legend, select, textarea {
font-family: inherit;
font-size: 100%;
font-style: inherit;
font-weight: inherit;
}
a {
text-decoration: none;
-webkit-transition: opacity 0.8s;
-o-transition: opacity 0.8s;
transition: opacity 0.8s;
color: #000;
}
@media (min-width: 1001px) {
a:hover {
color: #000;
opacity: 0.5;
}
a:visited {
color: #000;
}
a:active {
text-decoration: none;
}
}
[type=text], [type=email], [type=password], [type=number], textarea, select {
padding: 5px;
-webkit-box-sizing: border-box;
box-sizing: border-box;
border: 1px solid #ddd;
border-radius: 0px;
}
select {
max-width: 100%;
height: 2.5em;
padding-right: 8%;
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
border-radius: 0px;
border: 1px solid #ddd;
background: #fff url(/site/img/arrow.svg) 96% center no-repeat;
background-size: 12px;
}
select::-ms-expand {
display: none;
}
[type=text], [type=email], [type=password], [type=number], textarea {
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
}
[type=text]:focus, [type=email]:focus, [type=password]:focus, [type=number]:focus, textarea:focus {
background: #fff;
border: 1px solid #aaa;
} input[type=radio] {
vertical-align: middle;
}
input[type=radio] + label {
margin-left: 5px;
}
:placeholder-shown {
color: #BABABA;
} ::-webkit-input-placeholder {
color: #BABABA;
} :-moz-placeholder {
color: #BABABA;
opacity: 1;
} ::-moz-placeholder {
color: #BABABA;
opacity: 1;
} :-ms-input-placeholder {
color: #BABABA;
} body {
background: #fff;
overflow-x: hidden;
}
body.lock {
height: 100vh;
overflow: hidden;
padding: 0px !important;
}
@media (max-width: 1000px) {
body {
padding-bottom: 121px;
}
}
.wrap {
position: relative;
width: 960px;
margin: 0px auto;
}
@media (max-width: 1000px) {
.wrap {
width: auto;
margin: 0px 35px;
}
}
.linkbox {
cursor: pointer;
}
@media (min-width: 1001px) {
.linkbox {
-webkit-transition: opacity 0.8s;
-o-transition: opacity 0.8s;
transition: opacity 0.8s;
}
.linkbox:hover {
opacity: 1;
}
}
.sp {
display: none;
}
@media (max-width: 1000px) {
.sp {
display: inherit;
}
}
@media (max-width: 1000px) {
.pc {
display: none;
}
}
.fixd {
position: fixed;
bottom: 0px;
left: 0px;
right: 0px;
z-index: 100;
padding: 20px 14px;
background: #fff;
font-size: 0px;
line-height: 0px;
text-align: center;
}
.fixd .btn {
margin-left: 10px;
}
.fixd .btn img {
width: 150px;
} @media (max-width: 1000px) {
header {
position: fixed;
left: 0px;
top: 0px;
right: 0px;
z-index: 1000;
background: #fff;
border-bottom: 1px solid #efefef;
}
header .wrap {
margin: 0px;
}
}
header .logo {
padding: 15px 0px;
}
header .logo a {
display: block;
}
header .logo a:hover {
opacity: 1;
}
@media (max-width: 1000px) {
header .logo {
position: relative;
z-index: 10;
padding: 20px;
background: #fff;
}
}
header .tel {
position: absolute;
right: 130px;
top: 10px;
}
@media (max-width: 1000px) {
header .tel {
position: static;
text-align: center;
line-height: 2;
}
}
header .text {
padding: 35px;
text-align: center;
font-size: 28px;
font-weight: 700;
}
header .text a {
padding: 0px 1em;
}
header .cbtn {
position: absolute;
right: 0px;
top: 17px;
}
header .cbtn a {
-webkit-transition: .3s;
-o-transition: .3s;
transition: .3s;
}
header .cbtn a:hover {
opacity: 1;
}
@media (min-width: 1001px) {
header #gnavi {
background: #b1dff7;
}
}
@media (max-width: 1000px) {
header #gnavi {
display: none;
position: fixed;
left: 0px;
right: 0px;
top: 0px;
bottom: 0px;
padding-top: 110px;
background: #fff;
overflow: auto;
}
}
header #gnavi ul {
font-size: 0px;
line-height: 0px;
text-align: center;
}
header #gnavi ul li {
display: inline-block;
}
header #gnavi ul li.sp {
display: none;
}
@media (max-width: 1000px) {
header #gnavi ul li {
display: block;
}
}
header #gnavi ul li a {
display: block;
padding: 1em 1.5em;
font-size: 16px;
line-height: 1;
font-weight: bold;
font-weight: 700;
-webkit-transition: 0.3s;
-o-transition: 0.3s;
transition: 0.3s;
}
header #gnavi ul li a:hover {
opacity: 1;
color: #FF8200;
}
@media (max-width: 1000px) {
header #gnavi ul li a {
padding: 1.2em;
font-size: 28px;
background: #b1dff7;
border-bottom: 2px solid #fff;
text-align: left;
}
}
header .menu {
display: none;
position: absolute;
right: 25px;
top: 40px;
width: 45px;
height: 32px;
z-index: 1000;
cursor: pointer;
-webkit-transition: all .4s;
-o-transition: all .4s;
transition: all .4s;
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
@media (max-width: 1000px) {
header .menu {
display: block;
}
}
header .menu span {
display: inline-block;
position: absolute;
left: 0px;
width: 45px;
height: 4px;
background-color: #3198d0;
-webkit-transition: all .4s;
-o-transition: all .4s;
transition: all .4s;
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
header .menu span:nth-of-type(1) {
top: 0px;
-webkit-animation: menu-bar01 .75s forwards;
animation: menu-bar01 .75s forwards;
}
header .menu span:nth-of-type(2) {
top: 14px;
-webkit-transition: all .25s .25s;
-o-transition: all .25s .25s;
transition: all .25s .25s;
opacity: 1;
}
header .menu span:nth-of-type(3) {
bottom: 0px;
-webkit-animation: menu-bar02 .75s forwards;
animation: menu-bar02 .75s forwards;
}
header .menu.active span:nth-of-type(1) {
-webkit-animation: active-menu-bar01 .75s forwards;
animation: active-menu-bar01 .75s forwards;
}
header .menu.active span:nth-of-type(2) {
opacity: 0;
}
header .menu.active span:nth-of-type(3) {
-webkit-animation: active-menu-bar03 .75s forwards;
animation: active-menu-bar03 .75s forwards;
}
@media (max-width: 1000px) {
@-webkit-keyframes menu-bar01 {
0% {
-webkit-transform: translateY(14px) rotate(45deg);
transform: translateY(14px) rotate(45deg);
}
50% {
-webkit-transform: translateY(14px) rotate(0);
transform: translateY(14px) rotate(0);
}
100% {
-webkit-transform: translateY(0) rotate(0);
transform: translateY(0) rotate(0);
}
}
@keyframes menu-bar01 {
0% {
-webkit-transform: translateY(14px) rotate(45deg);
transform: translateY(14px) rotate(45deg);
}
50% {
-webkit-transform: translateY(14px) rotate(0);
transform: translateY(14px) rotate(0);
}
100% {
-webkit-transform: translateY(0) rotate(0);
transform: translateY(0) rotate(0);
}
}
@-webkit-keyframes menu-bar02 {
0% {
-webkit-transform: translateY(-14px) rotate(-45deg);
transform: translateY(-14px) rotate(-45deg);
}
50% {
-webkit-transform: translateY(-14px) rotate(0);
transform: translateY(-14px) rotate(0);
}
100% {
-webkit-transform: translateY(0) rotate(0);
transform: translateY(0) rotate(0);
}
}
@keyframes menu-bar02 {
0% {
-webkit-transform: translateY(-14px) rotate(-45deg);
transform: translateY(-14px) rotate(-45deg);
}
50% {
-webkit-transform: translateY(-14px) rotate(0);
transform: translateY(-14px) rotate(0);
}
100% {
-webkit-transform: translateY(0) rotate(0);
transform: translateY(0) rotate(0);
}
}
@-webkit-keyframes active-menu-bar01 {
0% {
-webkit-transform: translateY(0) rotate(0);
transform: translateY(0) rotate(0);
}
50% {
-webkit-transform: translateY(14px) rotate(0);
transform: translateY(14px) rotate(0);
}
100% {
-webkit-transform: translateY(14px) rotate(45deg);
transform: translateY(14px) rotate(45deg);
}
}
@keyframes active-menu-bar01 {
0% {
-webkit-transform: translateY(0) rotate(0);
transform: translateY(0) rotate(0);
}
50% {
-webkit-transform: translateY(14px) rotate(0);
transform: translateY(14px) rotate(0);
}
100% {
-webkit-transform: translateY(14px) rotate(45deg);
transform: translateY(14px) rotate(45deg);
}
}
@-webkit-keyframes active-menu-bar03 {
0% {
-webkit-transform: translateY(0) rotate(0);
transform: translateY(0) rotate(0);
}
50% {
-webkit-transform: translateY(-14px) rotate(0);
transform: translateY(-14px) rotate(0);
}
100% {
-webkit-transform: translateY(-14px) rotate(-45deg);
transform: translateY(-14px) rotate(-45deg);
}
}
@keyframes active-menu-bar03 {
0% {
-webkit-transform: translateY(0) rotate(0);
transform: translateY(0) rotate(0);
}
50% {
-webkit-transform: translateY(-14px) rotate(0);
transform: translateY(-14px) rotate(0);
}
100% {
-webkit-transform: translateY(-14px) rotate(-45deg);
transform: translateY(-14px) rotate(-45deg);
}
}
} @media (max-width: 1000px) {
article {
padding-top: 111px;
}
}
#eyecatch {
height: 280px;
margin-bottom: 120px;
background: #00b3e2;
}
@media (max-width: 1000px) {
#eyecatch {
height: 320px;
}
}
#eyecatch .eyebox {
position: absolute;
width: 100%;
height: 314px;
margin-bottom: -80px;
border: 5px solid #299bd7;
border-radius: 15px;
background-size: cover;
background-position: center;
background-repeat: no-repeat;
}
#eyecatch .eyebox .ptitle {
position: absolute;
left: 35px;
top: 50%;
-webkit-transform: translateY(-50%);
-ms-transform: translateY(-50%);
transform: translateY(-50%);
}
.pan {
padding: 1em 0px;
color: #fff;
}
.pan a {
color: #fff;
}
.wp-pagenavi {
clear: both;
padding: 20px 0px 40px;
text-align: center;
line-height: 2;
font-weight: bold;
font-weight: 700;
}
@media (max-width: 1000px) {
.wp-pagenavi {
font-size: 22px;
}
}
.wp-pagenavi a, .wp-pagenavi .current, .wp-pagenavi span {
display: inline-block;
width: 2em;
height: 2em;
margin: 0px 0.5em;
background: #3198d0;
vertical-align: middle;
text-align: center;
color: #fff;
line-height: 2;
}
.wp-pagenavi a.nextpostslink, .wp-pagenavi a.previouspostslink, .wp-pagenavi a.extend, .wp-pagenavi .current.nextpostslink, .wp-pagenavi .current.previouspostslink, .wp-pagenavi .current.extend, .wp-pagenavi span.nextpostslink, .wp-pagenavi span.previouspostslink, .wp-pagenavi span.extend {
background: none;
border: none;
}
.wp-pagenavi .current {
background: #ebebeb;
}
.pager {
clear: both;
padding: 20px 0px 0px;
text-align: center;
line-height: 1;
}
.pager a {
display: inline-block;
margin: 0 1em;
}
@media (max-width: 1000px) {
.pager a {
margin: 0px 0.5em;
}
}
.noitem {
padding: 250px 0px;
font-size: 16px;
text-align: center;
}
@media (max-width: 1000px) {
.noitem {
font-size: 24px;
}
}
#banner {
padding: 55px 0px 0px;
background: url(/site/img/index/textbg.png) center 45px no-repeat;
text-align: center;
}
@media (max-width: 1000px) {
#banner {
background: url(/site/img_sp/index/textbg.png) center top no-repeat;
}
}
#banner h2 {
margin-bottom: 10px;
}
@media (max-width: 1000px) {
#banner h2 {
margin-bottom: 20px;
}
#banner h2 img {
height: 36px;
}
}
#banner .text {
margin-bottom: 25px;
font-size: 20px;
font-weight: bold;
font-weight: 700;
}
@media (max-width: 1000px) {
#banner .text {
font-size: 26px;
line-height: 1.9;
}
}
#access {
padding-bottom: 40px;
}
#access h2 {
padding: 50px 0px 20px;
text-align: center;
}
@media (max-width: 1000px) {
#access h2 {
padding-top: 50px;
}
}
#access p {
padding-top: 1em;
font-weight: bold;
font-weight: 700;
text-align: center;
}
#access p span {
margin: 0px 1em;
}
@media (max-width: 1000px) {
#access p span {
display: block;
margin: 0px;
}
} footer .footnav {
background: #3198d0;
}
footer .footnav ul {
padding: 1.5em;
text-align: center;
}
footer .footnav ul li {
display: inline-block;
margin: 0.5em 1em;
}
footer .footnav ul li a {
color: #fff !important;
-webkit-transition: 0.3s;
-o-transition: 0.3s;
transition: 0.3s;
}
footer .footnav ul li a:hover {
opacity: 1;
color: #FF8200 !important;
}
footer .copy {
padding: 1em 0px;
line-height: 1;
text-align: center;
}
@media (max-width: 1000px) {
footer .copy {
background: #f0eded;
font-size: 18px;
}
}
.pagetop {
position: fixed;
right: 24px;
bottom: 24px;
z-index: 300;
width: 56px;
height: 56px;
-webkit-transition: all 0.4s;
-o-transition: all 0.4s;
transition: all 0.4s;
}
@media (max-width: 1000px) {
.pagetop {
width: 80px;
height: 80px;
bottom: 140px;
}
}
.pagetop.active {
bottom: 60px;
}
.pagetop a {
display: block;
height: 56px;
padding-top: 30px;
border: 3px solid #3198d0;
background: #fff url(/site/img/common/top.svg) center 9px no-repeat;
background-size: 26px 14px;
-webkit-box-sizing: border-box;
box-sizing: border-box;
line-height: 1;
text-align: center;
color: #3198d0;
letter-spacing: -0.1em;
font-size: 10px;
font-weight: bold;
font-weight: 700;
text-decoration: none;
opacity: 0.6;
-webkit-transition: all 0.4s;
-o-transition: all 0.4s;
transition: all 0.4s;
}
.pagetop a:hover {
opacity: 1;
}
@media (max-width: 1000px) {
.pagetop a {
display: block;
height: 80px;
font-size: 14px;
padding-top: 48px;
background-size: 40px 28px;
}
} .clearfix:after {
content: "";
display: block;
clear: both;
height: 0px;
visibility: hidden;
}
* html .clearfix {
zoom: 1;
}
*:first-child + html .clearfix {
zoom: 1;
} * {
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
img {
vertical-align: bottom;
} .sp {
display: none;
}
@media (max-width: 1000px) {
.sp {
display: inherit;
}
}
@media (max-width: 1000px) {
.pc {
display: none;
}
} .inner {
position: relative;
margin: 0px auto;
}
.grid_2cell {
display: table;
}
.grid_2cell .cell {
display: table-cell;
vertical-align: middle;
}
ul.ul_table > li > dl {
display: table;
}
ul.ul_table > li > dl > dt,
ul.ul_table > li > dl > dd {
display: table-cell;
vertical-align: middle;
}
ul.ul_table > li > dl > dt {
width: 120px;
padding-right: 4px;
}
a.std_icn1 {
position: relative;
}
a.std_icn1:before {
content: "";
display: inline-block;
vertical-align: middle;
width: 8px;
height: 8px;
margin-right: 0.4em;
background: url(/site/img/common/arr.svg) 0 0 no-repeat;
background-size: contain;
} .list_qaa [type=checkbox] + label:before {
display: none;
} span.ka {
letter-spacing: -.2em;
} input[name="switch"] {
display: none;
} .tabBtn {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-flex-wrap: wrap;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
list-style: none;
width: 100%;
margin: 0 0 0 4px;
padding: 0;
text-align: center;
}
.tabBtn li {
-webkit-flex-basis: 20%;
-ms-flex-preferred-size: 20%;
flex-basis: 20%;
margin-left: -4px;
margin-top: -20px;
z-index: 160;
}
.tabBtn label {
display: block;
cursor: pointer;
padding: 10px 0 24px;
-webkit-transition: background .3s;
-o-transition: background .3s;
transition: background .3s;
font-size: 24px;
border: 4px solid #3198d0;
border-bottom: none;
border-radius: 24px 24px 0 0;
background: #fff;
}
.tabBtn li:nth-last-child(-n+5) label {
padding: 10px 0 12px;
}
.tabBtn label:hover {
color: #3198d0;
} .tabContents section {
padding: 20px;
background: white;
}
.tabContents section::after {
content: "";
display: block;
clear: left;
} .tabContents section {
opacity: .1;
}
.tabContents section {
-webkit-transition: opacity .3s;
-o-transition: opacity .3s;
transition: opacity .3s;
}
#tab1:checked ~ .tabBtn label[for="tab1"],
#tab2:checked ~ .tabBtn label[for="tab2"],
#tab3:checked ~ .tabBtn label[for="tab3"],
#tab4:checked ~ .tabBtn label[for="tab4"],
#tab5:checked ~ .tabBtn label[for="tab5"],
#tab6:checked ~ .tabBtn label[for="tab6"],
#tab7:checked ~ .tabBtn label[for="tab7"],
#tab8:checked ~ .tabBtn label[for="tab8"],
#tab9:checked ~ .tabBtn label[for="tab9"],
#tab10:checked ~ .tabBtn label[for="tab10"] {
color: #fff;
background: #3198d0;
position: relative;
}
#tab1:checked ~ .tabContents #tabsec1,
#tab2:checked ~ .tabContents #tabsec2,
#tab3:checked ~ .tabContents #tabsec3,
#tab4:checked ~ .tabContents #tabsec4,
#tab5:checked ~ .tabContents #tabsec5,
#tab6:checked ~ .tabContents #tabsec6,
#tab7:checked ~ .tabContents #tabsec7,
#tab8:checked ~ .tabContents #tabsec8,
#tab9:checked ~ .tabContents #tabsec9,
#tab10:checked ~ .tabContents #tabsec10 {
opacity: 1;
background: white;
} .tabContents {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
width: 1000%;
-webkit-transition: -webkit-transform .6s;
transition: -webkit-transform .6s;
-o-transition: transform .6s;
transition: transform .6s;
transition: transform .6s, -webkit-transform .6s;
}
.tabContents section {
-webkit-flex-basis: 10%;
-ms-flex-preferred-size: 10%;
flex-basis: 10%;
opacity: .1;
-webkit-transition: opacity .3s;
-o-transition: opacity .3s;
transition: opacity .3s;
border: 4px solid #c3d5e9;
border-radius: 0 0 16px 16px;
}
#tab1:checked ~ .tabContents {
-webkit-transform: translateX(0);
-ms-transform: translateX(0);
transform: translateX(0);
}
#tab2:checked ~ .tabContents {
-webkit-transform: translateX(-10%);
-ms-transform: translateX(-10%);
transform: translateX(-10%);
}
#tab3:checked ~ .tabContents {
-webkit-transform: translateX(-20%);
-ms-transform: translateX(-20%);
transform: translateX(-20%);
}
#tab4:checked ~ .tabContents {
-webkit-transform: translateX(-30%);
-ms-transform: translateX(-30%);
transform: translateX(-30%);
}
#tab5:checked ~ .tabContents {
-webkit-transform: translateX(-40%);
-ms-transform: translateX(-40%);
transform: translateX(-40%);
}
#tab6:checked ~ .tabContents {
-webkit-transform: translateX(-50%);
-ms-transform: translateX(-50%);
transform: translateX(-50%);
}
#tab7:checked ~ .tabContents {
-webkit-transform: translateX(-60%);
-ms-transform: translateX(-60%);
transform: translateX(-60%);
}
#tab8:checked ~ .tabContents {
-webkit-transform: translateX(-70%);
-ms-transform: translateX(-70%);
transform: translateX(-70%);
}
#tab9:checked ~ .tabContents {
-webkit-transform: translateX(-80%);
-ms-transform: translateX(-80%);
transform: translateX(-80%);
}
#tab10:checked ~ .tabContents {
-webkit-transform: translateX(-90%);
-ms-transform: translateX(-90%);
transform: translateX(-90%);
}
.tabContents2 {
width: 100%;
-webkit-transition: -webkit-transform .6s;
transition: -webkit-transform .6s;
-o-transition: transform .6s;
transition: transform .6s;
transition: transform .6s, -webkit-transform .6s;
position: relative;
}
.tabContents2 section {
width: 100%;
-webkit-transition: all 0.2s ease;
-o-transition: all 0.2s ease;
transition: all 0.2s ease;
border: 4px solid #3198d0;
border-radius: 0 0 16px 16px;
display: none;
opacity: .1;
}
.tabContents2 section:hover {
opacity: 0.75;
}
#tab1:checked ~ .tabContents2 #tabsec1,
#tab2:checked ~ .tabContents2 #tabsec2,
#tab3:checked ~ .tabContents2 #tabsec3,
#tab4:checked ~ .tabContents2 #tabsec4,
#tab5:checked ~ .tabContents2 #tabsec5,
#tab6:checked ~ .tabContents2 #tabsec6,
#tab7:checked ~ .tabContents2 #tabsec7,
#tab8:checked ~ .tabContents2 #tabsec8,
#tab9:checked ~ .tabContents2 #tabsec9,
#tab10:checked ~ .tabContents2 #tabsec10 {
display: block;
opacity: 1;
background: #fff;
} .ul_voice {
width: 960px;
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-flex-wrap: wrap;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
-webkit-box-orient: horizontal;
-webkit-box-direction: normal;
-webkit-flex-direction: row;
-ms-flex-direction: row;
flex-direction: row;
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
}
@media (max-width: 1000px) {
.ul_voice {
width: auto;
}
}
.ul_voice > li {
width: auto;
position: relative;
}
@media (max-width: 1000px) {
.ul_voice > li {
width: auto;
}
}
.ul_voice > li:nth-child(2) {
margin-left: 40px;
}
@media (max-width: 1000px) {
.ul_voice > li:nth-child(2) {
margin-left: 0;
}
}
.ul_voice > li:nth-child(2) .desgin_tag:before {
background: url(/site/img/index/obj_tape2.svg) center center no-repeat;
}
.ul_voice > li:nth-child(3) {
width: 960px;
}
@media (max-width: 1000px) {
.ul_voice > li:nth-child(3) {
width: auto;
}
}
.ul_voice > li:nth-child(3) .note_blk {
width: 460px;
}
@media (max-width: 1000px) {
.ul_voice > li:nth-child(3) .note_blk {
width: auto;
margin-bottom: 32px;
}
}
.ul_voice > li:nth-child(3) .etc_blk {
position: absolute;
right: 24px;
top: 50%;
-webkit-transform: translateY(-50%); -ms-transform: translateY(-50%);
transform: translateY(-50%);
}
@media (max-width: 1000px) {
.ul_voice > li:nth-child(3) .etc_blk {
position: static;
-webkit-transform: translateY(0%);
-ms-transform: translateY(0%);
transform: translateY(0%);
text-align: center;
}
.ul_voice > li:nth-child(3) .etc_blk iframe {
width: 560px;
height: 315px;
}
}
.ul_voice > li:nth-child(3) .desgin_tag:before {
background: url(/site/img/index/obj_tape3.svg) center center no-repeat;
}
.desgin_tag {
background: #fffde8;
padding: 56px 20px 32px;
position: relative;
margin: 48px 0 36px;
-webkit-box-shadow: 4px 4px 0 rgba(182, 159, 132, 0.6);
box-shadow: 4px 4px 0 rgba(182, 159, 132, 0.6);
border-radius: 8px;
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
.desgin_tag:before {
content: "";
display: inline-block;
vertical-align: middle;
width: 240px;
height: 80px;
background: url(/site/img/index/obj_tape1.svg) center center no-repeat;
background-size: contain;
position: absolute;
top: -42px;
left: 50%;
-webkit-transform: translateX(-50%);
-ms-transform: translateX(-50%);
transform: translateX(-50%);
}
.desgin_tag .gr_txt {
background-image: -webkit-gradient(linear, left top, right top, from(rgba(207, 191, 173, 0)), color-stop(49%, rgba(207, 191, 173, 0)), color-stop(#fffde8), to(#fffde8)), -webkit-gradient(linear, left top, left bottom, from(rgba(207, 191, 173, 0)), color-stop(94.5%, rgba(207, 191, 173, 0)), to(#424242));
background-image: -webkit-linear-gradient(left, rgba(207, 191, 173, 0) 0%, rgba(207, 191, 173, 0) 49%, #fffde8, #fffde8), -webkit-linear-gradient(top, rgba(207, 191, 173, 0) 0%, rgba(207, 191, 173, 0) 94.5%, #424242 100%);
background-image: -o-linear-gradient(left, rgba(207, 191, 173, 0) 0%, rgba(207, 191, 173, 0) 49%, #fffde8, #fffde8), -o-linear-gradient(top, rgba(207, 191, 173, 0) 0%, rgba(207, 191, 173, 0) 94.5%, #424242 100%);
background-image: linear-gradient(90deg, rgba(207, 191, 173, 0) 0%, rgba(207, 191, 173, 0) 49%, #fffde8, #fffde8), linear-gradient(180deg, rgba(207, 191, 173, 0) 0%, rgba(207, 191, 173, 0) 94.5%, #424242 100%);
background-repeat: repeat-x,repeat-y;
background-size: 4px 100%,100% 2em;
line-height: 2;
text-align: left;
font-size: 16px;
}
@media (max-width: 1000px) {
.desgin_tag .gr_txt {
font-size: 18px;
}
}
.desgin_tag .gr_txt p {
font-family: vdl-pengentle;
font-weight: 700;
font-size: 16px;
}
@media (max-width: 1000px) {
.desgin_tag .gr_txt p {
font-size: 18px;
}
}
.desgin_tag .tmb {
margin: 24px auto 0;
text-align: center;
}
.desgin_tag .name {
font-size: 20px;
color: #3198d0;
text-align: right;
margin-bottom: 16px;
line-height: 1;
}
@media (max-width: 1000px) {
.desgin_tag .name {
font-size: 24px;
}
} .clearfix:after {
content: "";
display: block;
clear: both;
height: 0px;
visibility: hidden;
}
* html .clearfix {
zoom: 1;
}
*:first-child + html .clearfix {
zoom: 1;
} #top {
position: relative;
padding: 15px 0px 0px;
}
@media (max-width: 1000px) {
#top {
padding-top: 130px;
}
}
#top .items {
opacity: 0;
-webkit-transition: 1s;
-o-transition: 1s;
transition: 1s;
}
#top .items .item {
float: left;
margin-right: 45px;
}
@media (max-width: 1000px) {
#top .items .item {
width: 600px;
margin: 0px 20px;
}
}
#top .items .item img {
width: 100%;
}
#top .slick-initialized {
opacity: 1;
}
#top .prev, #top .next {
position: absolute;
top: 50%;
z-index: 10;
-webkit-transform: translateY(-50%);
-ms-transform: translateY(-50%);
transform: translateY(-50%);
}
@media (max-width: 1000px) {
#top .prev img, #top .next img {
width: 54px;
}
}
@media (min-width: 1001px) {
#top .prev {
left: 50%;
z-index: 10;
margin-left: -420px;
}
#top .next {
left: 50%;
margin-left: 370px;
}
}
@media (max-width: 1000px) {
#top .prev {
left: 8px;
}
#top .next {
right: 8px;
}
}
#top .bg {
margin-top: -80px;
padding-top: 95px;
background: #00b3e2;
}
@media (max-width: 1000px) {
#top .bg {
margin-top: -70px;
padding-top: 110px;
padding-bottom: 30px;
}
}
#top .read {
margin-bottom: 0.7em;
font-size: 16px;
color: #fff;
font-weight: bold;
font-weight: 700;
text-align: center;
letter-spacing: 0.04em;
}
@media (max-width: 1000px) {
#top .read {
font-size: 28px;
text-align: left;
}
}
#top .newsbox {
position: relative;
float: left;
width: 575px;
height: 230px;
margin-left: -15px;
padding-left: 95px;
padding-top: 10px;
background: url(/site/img/index/bg.png) no-repeat;
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
@media (max-width: 1000px) {
#top .newsbox {
float: none;
width: auto;
height: auto;
min-height: 440px;
margin: 0px 0px 0px -35px;
padding-left: 116px;
padding-top: 30px;
background: url(/site/img_sp/index/bg.png) 10px bottom no-repeat;
}
}
#top .newsbox h2 {
margin-bottom: 15px;
}
@media (max-width: 1000px) {
#top .newsbox h2 {
padding-left: 35px;
}
}
#top .newsbox ul {
position: relative;
padding: 0.5em 25px;
background: #fff;
border-radius: 8px;
}
@media (max-width: 1000px) {
#top .newsbox ul {
border-radius: 16px;
}
}
#top .newsbox ul:after {
content: "";
position: absolute;
top: 50%;
left: -6px;
margin-top: -5px;
display: block;
width: 0px;
height: 0px;
border-style: solid;
border-width: 5px 6px 5px 0;
border-color: transparent #fff transparent transparent;
}
@media (max-width: 1000px) {
#top .newsbox ul:after {
left: -10px;
margin-top: -10px;
border-width: 10px 10px 10px 0;
}
}
#top .newsbox ul li {
border-bottom: 1px solid #cbe5f3;
}
@media (max-width: 1000px) {
#top .newsbox ul li:nth-child(3) {
border-bottom: none;
}
}
#top .newsbox ul li:last-child {
border: none;
}
@media (max-width: 1000px) {
#top .newsbox ul li:last-child {
display: none;
}
}
@media (max-width: 1000px) {
#top .newsbox ul li:first-child {
display: block;
}
}
#top .newsbox ul li a {
display: block;
position: relative;
padding: 0.7em 110px 0.7em 0px;
background: url(/site/img/index/ar_b.svg) right center no-repeat;
color: #3198d0;
}
#top .newsbox ul li a:hover {
color: #FF8200;
}
@media (max-width: 1000px) {
#top .newsbox ul li a {
padding: 2em 1em 0.7em 0px;
background-size: 8px auto;
}
}
#top .newsbox ul li a span {
display: block;
position: absolute;
right: 30px;
top: 50%;
-webkit-transform: translateY(-50%);
-ms-transform: translateY(-50%);
transform: translateY(-50%);
font-size: 11px;
color: #000;
}
@media (max-width: 1000px) {
#top .newsbox ul li a span {
right: auto;
left: 0px;
top: 0.7em;
font-size: 22px;
-webkit-transform: none;
-ms-transform: none;
transform: none;
}
}
#top .newsbox .more {
position: absolute;
right: 0px;
top: 10px;
}
@media (max-width: 1000px) {
#top .newsbox .more {
right: 15px;
top: 60px;
}
}
#top .newsbox .more a {
display: block;
padding: 0.3em 1em;
background: #006dbf;
border-radius: 1.5em;
font-size: 12px;
color: #fff;
line-height: 1;
-webkit-transition: 0.3s;
-o-transition: 0.3s;
transition: 0.3s;
}
#top .newsbox .more a:hover {
opacity: 1;
background: #FF8200;
}
@media (max-width: 1000px) {
#top .newsbox .more a {
width: 36px;
height: 36px;
padding: 0px;
border-radius: 0px;
background: url(/site/img/index/ar.svg) no-repeat;
background-size: 100%;
text-indent: -9999px;
}
}
#top .channel {
float: right;
width: 380px;
margin-top: 10px;
padding: 8px;
background: #3198d0;
border-radius: 8px;
border: 1px solid #fff;
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
@media (max-width: 1000px) {
#top .channel {
width: auto;
float: none;
margin-top: 40px;
padding: 30px;
border-radius: 16px;
}
}
@media (max-width: 1000px) {
#top .channel iframe {
width: 100%;
}
}
#top .channel img {
max-width: 100%;
}
#top .channel h2 {
padding-top: 13px;
text-align: center;
}
@media (max-width: 1000px) {
#top .channel h2 img {
height: 36px;
}
}
#workbox {
background: url(/site/img/index/workbg.png) center top no-repeat;
}
@media (max-width: 1000px) {
#workbox {
background-image: url(/site/img_sp/index/workbg.png);
}
}
#workbox h2 {
text-align: center;
padding: 40px 95px 40px 0px;
}
@media (max-width: 1000px) {
#workbox h2 {
padding: 60px 0px 20px;
text-align: left;
}
}
#workbox h2 span {
display: block;
margin-top: -1.3em;
padding-left: 95px;
font-size: 14px;
font-weight: normal;
text-align: center;
}
@media (max-width: 1000px) {
#workbox h2 span {
margin: 0;
padding: 20px 0px 0px;
font-size: 24px;
}
}
#workbox .read {
margin-bottom: 1.5em;
font-size: 16px;
line-height: 1.9;
}
@media (max-width: 1000px) {
#workbox .read {
font-size: 26px;
}
}
#workbox .items .item {
position: relative;
float: left;
width: 300px;
margin-right: 30px;
padding-bottom: 2em;
}
@media (max-width: 1000px) {
#workbox .items .item {
float: none;
width: auto;
margin: 0px 0px 35px;
}
}
#workbox .items .item:last-child {
margin-right: 0px;
}
#workbox .items .item .after {
position: relative;
margin-bottom: 10px;
}
#workbox .items .item .after span {
display: block;
position: absolute;
left: 0px;
bottom: 0px;
padding: 0.6em 2em;
background: #3198d0;
color: #fff;
font-weight: bold;
font-weight: 700;
line-height: 1;
}
#workbox .items .item .after img {
width: 100%;
}
#workbox .items .item h3 {
font-size: 20px;
color: #3198d0;
}
@media (max-width: 1000px) {
#workbox .items .item h3 {
font-size: 36px;
}
}
#workbox .items .item h3 + p {
float: left;
width: 165px;
}
@media (max-width: 1000px) {
#workbox .items .item h3 + p {
width: 320px;
}
}
#workbox .items .item .before {
float: right;
width: 120px;
text-align: center;
margin-bottom: -2em;
}
@media (max-width: 1000px) {
#workbox .items .item .before {
width: 226px;
}
}
#workbox .items .item .before img {
width: 100%;
}
#workbox .items .item .before span {
display: block;
padding-top: 0.5em;
color: #3198d0;
font-weight: bold;
font-weight: 700;
}
#workbox .items .item .link {
position: absolute;
left: 0px;
bottom: 0px;
}
#workbox .items .item .link a {
display: block;
padding: 0.4em 1.5em;
border-radius: 1.5em;
background: #3198d0;
color: #fff;
font-size: 12px;
line-height: 1;
-webkit-transition: 0.3s;
-o-transition: 0.3s;
transition: 0.3s;
}
#workbox .items .item .link a:hover {
opacity: 1;
background: #FF8200;
}
@media (max-width: 1000px) {
#workbox .items .item .link a {
font-size: 27px;
}
}
@media (min-width: 1001px) {
#workbox .items .linkbox {
-webkit-transition: opacity 0.8s;
-o-transition: opacity 0.8s;
transition: opacity 0.8s;
display: block;
}
#workbox .items .linkbox:hover {
opacity: 1;
}
#workbox .items .linkbox:hover .after span {
background: #FF8200;
}
#workbox .items .linkbox:hover h3 {
color: #FF8200;
}
#workbox .items .linkbox:hover .before span {
color: #FF8200;
}
#workbox .items .linkbox:hover .link a {
background: #FF8200;
}
#workbox .items .linkbox:hover .link a:hover {
background: #FF8200;
}
}
#columnbox {
padding-top: 50px;
}
@media (max-width: 1000px) {
#columnbox {
padding-top: 10px;
}
}
#columnbox .box {
position: relative;
float: left;
width: 695px;
padding: 15px;
background: #3198d0;
border-radius: 8px;
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
@media (max-width: 1000px) {
#columnbox .box {
float: none;
width: auto;
margin-bottom: 40px;
}
}
#columnbox .box h2 {
margin-bottom: 15px;
}
#columnbox .box .more {
position: absolute;
right: 25px;
top: 38px;
}
@media (max-width: 1000px) {
#columnbox .box .more {
right: 50px;
top: 70px;
}
#columnbox .box .more img {
width: 38px;
}
}
#columnbox .box ul {
padding: 0.7em 20px;
background: #fff;
border-radius: 8px;
}
#columnbox .box ul li {
border-bottom: 1px solid #cbe5f3;
}
#columnbox .box ul li:last-child {
border: none;
}
#columnbox .box ul li a {
display: block;
position: relative;
padding: 0.7em 110px 0.7em 0px;
background: url(/site/img/index/ar_b.svg) right center no-repeat;
color: #3198d0;
}
@media (max-width: 1000px) {
#columnbox .box ul li a {
padding: 2em 1em 0.7em 0px;
background-size: 8px auto;
}
}
#columnbox .box ul li a span {
display: block;
position: absolute;
right: 30px;
top: 50%;
-webkit-transform: translateY(-50%);
-ms-transform: translateY(-50%);
transform: translateY(-50%);
font-size: 11px;
color: #000;
}
@media (max-width: 1000px) {
#columnbox .box ul li a span {
right: auto;
left: 0px;
top: 0.7em;
font-size: 22px;
-webkit-transform: none;
-ms-transform: none;
transform: none;
}
}
#columnbox .snsbox {
float: right;
width: 245px;
}
@media (max-width: 1000px) {
#columnbox .snsbox {
width: auto;
float: none;
margin-bottom: 20px;
}
}
#columnbox .snsbox img {
width: 100%;
}
#columnbox .snsbox .facebook {
margin-bottom: 25px;
}
@media (max-width: 1000px) {
#columnbox .snsbox .facebook iframe {
margin: 0px auto;
}
}
#voicebox {
padding-top: 40px;
margin: 0 auto;
}
#voicebox .hd_std2 {
margin-bottom: 8px;
}
@media (max-width: 1000px) {
#voicebox .hd_std2 {
margin-bottom: 16px;
}
}
@media (max-width: 1000px) {
#voicebox .hd_std2 .tit_std02 {
margin-bottom: 16px;
}
}
#voicebox .hd_std2 .tit_std02:before {
left: -128px;
top: 8px;
}
@media (max-width: 1000px) {
#voicebox .hd_std2 .tit_std02:before {
display: block;
}
}
#voicebox .hd_std2 .desc {
margin-left: 0;
bottom: -10px;
}
#banner .conv_area {
padding: 48px 0px 0px;
text-align: left;
}
@media (max-width: 1000px) {
#banner .conv_area {
padding: 30px 0;
}
} #news #eyecatch .eyebox {
background-image: url(/site/img/news/main.jpg);
}
#news .catnav {
padding-top: 40px;
text-align: center;
font-size: 14px;
}
@media (max-width: 1000px) {
#news .catnav {
padding: 50px 30px 0px;
font-size: 22px;
}
}
#news .catnav li {
display: inline-block;
padding: 0px 0.5em;
line-height: 1.2;
}
#news .catnav li a {
display: block;
padding: 0.5em 1.5em;
border-radius: 1.5em;
color: #fff;
border: 1px solid #3198d0;
}
@media (max-width: 1000px) {
#news .catnav li {
margin-bottom: 0.5em;
}
}
#news .list {
padding-bottom: 20px;
}
#news .list .items {
padding-top: 45px;
}
#news .list .items .item {
float: left;
width: 225px;
margin: 0px 20px 40px 0px;
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
@media (min-width: 1001px) {
#news .list .items .item:nth-child(4n) {
margin-right: 0px;
}
#news .list .items .item:nth-child(4n) + .item {
clear: both;
}
}
@media (max-width: 1000px) {
#news .list .items .item {
width: 100%;
margin-right: 0;
margin-bottom: 40px;
}
}
#news .list .items .item figure img {
width: 100%;
}
#news .list .items .item .date {
padding: 1em 0px 0.5em;
font-size: 12px;
}
@media (max-width: 1000px) {
#news .list .items .item .date {
font-size: 20px;
}
}
#news .list .items .item h3 {
min-height: 2.4em;
font-size: 16px;
line-height: 1.2;
}
@media (max-width: 1000px) {
#news .list .items .item h3 {
min-height: 0px;
font-size: 26px;
}
}
#news .list .items .item .text {
padding: 0.3em 0px 1em;
min-height: 3em;
}
@media (max-width: 1000px) {
#news .list .items .item .text {
min-height: 0px;
}
}
#news .list .items .item .more a {
display: block;
padding: 1em 0px;
text-align: center;
color: #fff;
background: #3198d0;
font-weight: bold;
line-height: 1;
-webkit-transition: .3s;
-o-transition: .3s;
transition: .3s;
}
@media (max-width: 1000px) {
#news .list .items .item .more a {
font-size: 22px;
}
}
#news .list .items .item .more a:hover {
opacity: 1;
background: #b1dff7;
}
#news .list .items .linkbox {
display: block;
}
#news .list .items .linkbox:hover {
opacity: 1;
}
#news .list .items .linkbox .more a:hover {
background: #FF8200;
}
#news .detail {
padding-bottom: 60px;
}
#news .detail .inbox {
padding-top: 45px;
}
#news .detail .cat {
margin-bottom: 0.5em;
}
#news .detail h2 {
padding: 0em 0px 0.5em;
font-size: 32px;
color: #3198d0;
}
@media (max-width: 1000px) {
#news .detail h2 {
font-size: 32px;
}
}
#news .detail .entry {
clear: both;
padding: 0px 0px 50px;
}
#news .detail .addtoany_content {
margin-top: 4em;
}
@media (max-width: 1000px) {
#news .detail .a2a_svg {
width: 56px;
height: 56px;
line-height: 56px;
}
} #tinymce {
padding: 20px;
}
.entry, #tinymce {
word-wrap: break-word;
line-height: 2;
font-size: 16px;
}
@media (max-width: 1000px) {
.entry, #tinymce {
font-size: 24px;
}
}
.entry h1, .entry h2, .entry h3, .entry h4, .entry h5, .entry h6, #tinymce h1, #tinymce h2, #tinymce h3, #tinymce h4, #tinymce h5, #tinymce h6 {
position: static;
clear: both;
float: none;
height: auto;
min-height: 1px;
margin: 0 0 1em;
padding: 0px;
background: none;
border: none;
color: #333;
text-shadow: 1px 1px 0 #fff;
}
.entry h1, #tinymce h1 {
font-size: 145.5%;
}
.entry h2, #tinymce h2 {
font-size: 136.4%;
}
.entry h3, #tinymce h3 {
font-size: 127.3%;
}
.entry h4, #tinymce h4 {
font-size: 127.3%;
}
.entry h5, #tinymce h5 {
font-size: 118.2%;
}
.entry h6, #tinymce h6 {
font-size: 100%;
}
.entry strong, .entry b, #tinymce strong, #tinymce b {
font-weight: bold;
}
.entry p, #tinymce p {
margin: 0em 0em 2em 0em;
}
.entry em, #tinymce em {
font-style: italic;
}
.entry ol, #tinymce ol {
margin: 1em 2em 1em;
}
.entry ul, #tinymce ul {
margin: 1em 0 1em;
}
.entry ul li, #tinymce ul li {
margin: 0em 0em 0.5em 1em;
}
.entry ol li, #tinymce ol li {
margin: 0em 0em 0.5em 0em;
}
.entry ul, #tinymce ul {
list-style: disc;
}
.entry ol, #tinymce ol {
list-style: decimal;
}
.entry dl, #tinymce dl {
margin: 1em 0;
}
.entry dd, #tinymce dd {
margin-left: 2em;
}
.entry table.wp-oembed,
.entry table.wp-oembed td, #tinymce table.wp-oembed,
#tinymce table.wp-oembed td {
border: none;
}
.entry table caption, #tinymce table caption {
font-size: 14px;
font-weight: bold;
text-align: left;
}
.entry table, #tinymce table {
clear: both;
width: 99%;
border-collapse: collapse;
border-spacing: 0;
margin: 1em 0 2em;
}
.entry table th, #tinymce table th {
padding: 0.5em;
background: #f5f5f5;
font-weight: bold;
text-shadow: 1px 1px 0 #fff;
}
.entry table td, #tinymce table td {
padding: .5em;
}
.entry img, #tinymce img {
max-width: 100%;
height: auto;
margin-bottom: 2em;
}
.entry img.aligncenter, #tinymce img.aligncenter {
clear: both;
display: block;
margin: auto;
}
.entry a, #tinymce a {
text-decoration: underline;
}
.entry a:hover, #tinymce a:hover {
opacity: 1;
color: #3198d0;
}
.entry iframe, #tinymce iframe {
max-width: 100%;
}
@media (min-width: 1001px) {
.entry img.alignleft, #tinymce img.alignleft {
float: left;
margin-right: 2em;
}
.entry img.alignright, #tinymce img.alignright {
float: right;
margin-left: 2em;
}
} #contact #eyecatch .eyebox {
background-image: url(/site/img/contact/main.jpg);
}
#contact #sec_intro .heading .tit_sec {
font-size: 29px;
color: #3198d0;
display: inline-block;
}
#contact #sec_intro .heading .att {
display: inline-block;
}
#contact #sec_intro .heading .att span {
color: #3198d0;
}
#contact #sec_intro .intro {
font-size: 15px;
line-height: 2;
}
@media (max-width: 1000px) {
#contact #sec_intro .intro {
font-size: 24px;
}
}
#contact_box {
width: 1000px;
margin: 40px auto 0;
border: 2px solid #D7DFE2;
-webkit-box-sizing: border-box;
box-sizing: border-box;
padding: 40px;
}
@media (max-width: 1000px) {
#contact_box {
width: auto;
margin: 40px 15px 0;
padding: 15px;
}
}
#contact_box input[type='text'].item,
#contact_box input[type='email'].item {
height: 46px;
line-height: 54px;
border: 2px solid #cccccc;
border-radius: 10px;
margin-top: 15px;
padding: 0 15px;
width: 100%;
-webkit-box-sizing: border-box;
box-sizing: border-box;
background: #FFFEF0;
}
#contact_box textarea.item {
background: #FFFEF0;
border: 2px solid #cccccc;
border-radius: 10px;
margin-top: 15px;
padding: 0 15px;
width: 100%;
-webkit-box-sizing: border-box;
box-sizing: border-box;
line-height: 50px;
}
#contact_box label {
font-size: 16px;
font-weight: bold;
}
@media (max-width: 1000px) {
#contact_box label {
font-size: 24px;
}
}
#contact_box label span {
font-weight: normal;
}
#contact_box label span.emphasis {
background: #00C4C4;
margin-left: 10px;
padding: 4px 12px;
color: white;
font-weight: bold;
font-size: 14px;
line-height: 28px;
}
#contact_box .mwform-radio-field {
margin-top: 15px;
}
#contact_box .mwform-radio-field input {
display: none;
}
#contact_box .mwform-radio-field input:checked ~ .mwform-radio-field-text:before {
background-color: #ccc;
}
#contact_box .mwform-radio-field .mwform-radio-field-text {
position: relative;
padding-left: 20px;
}
#contact_box .mwform-radio-field .mwform-radio-field-text:before {
content: ' ';
width: 12px;
height: 12px;
border: 2px solid #ccc;
position: absolute;
top: -webkit-calc(50% - 5px);
top: calc(50% - 5px);
left: 0;
border-radius: 50%;
}
#contact_box .form-group {
margin-bottom: 30px;
}
#contact_box .form-group.tel input[type='text'], #contact_box .form-group.zip input[type='text'] {
max-width: 160px;
}
#contact_box .contact_bottom {
text-align: center;
}
#contact_box .contact_bottom a {
color: #5d9fdb;
text-decoration: none;
}
#contact_box .contact_bottom input[type='submit'] {
font-size: 26px;
font-weight: bold;
color: white;
background-color: #444444;
border: 0;
line-height: 58px;
width: 380px;
margin-bottom: 30px;
border-radius: 40px;
}
#contact_box .contact_bottom input[type='submit']:hover {
background-color: #ee6875;
}
#contact_box .contact_bottom li {
margin: 50px 0 30px;
}
#contact_box div#mw-wp-form-captcha,
#contact_box div#mw-wp-form-captcha,
#contact_box div#mw-wp-form-captcha,
#contact_box div#mw-wp-form-captcha {
text-align: center;
line-height: 2.2em;
padding: 0 3% 2.0em 3%;
}
#contact_box .mwform-radio-field,
#contact_box .mwform-radio-field,
#contact_box .mwform-radio-field,
#contact_box .mwform-radio-field {
margin-top: 15px;
}
.mw_wp_form .vertical-item {
display: block;
} #contact #eyecatch .eyebox {
background-image: url(/site/img/contact/main.jpg);
}
.contactbox {
padding-bottom: 100px;
}
.contactbox .ptitle {
color: #3198d0;
font-size: 29px;
}
@media (max-width: 1000px) {
.contactbox .ptitle {
font-size: 32px;
}
}
.contactbox .ptitle .min {
margin-left: 1em;
font-size: 14px;
color: #000;
}
@media (max-width: 1000px) {
.contactbox .ptitle .min {
font-size: 20px;
}
}
.contactbox .ptitle .min span {
color: #3198d0;
}
.contactbox .tel {
margin-bottom: 60px;
padding-left: 200px;
text-align: center;
}
@media (min-width: 1001px) {
.contactbox .tel a {
pointer-events: none;
}
}
@media (max-width: 1000px) {
.contactbox .tel {
margin-bottom: 30px;
padding: 0px;
}
}
.contactbox .read {
line-height: 2;
}
.contactbox .required {
padding-right: 0.5em;
color: #3198d0;
}
.contactbox form {
text-align: left;
}
.contactbox table {
width: 100%;
margin-bottom: 45px;
border-top: 1px solid #3198d0;
font-size: 14px;
background: #fff;
}
@media (max-width: 1000px) {
.contactbox table {
font-size: 24px;
}
}
.contactbox table th, .contactbox table td {
padding: 0.7em 1em;
border-bottom: 1px solid #3198d0;
}
@media (max-width: 1000px) {
.contactbox table th, .contactbox table td {
display: block;
}
}
.contactbox table th {
width: 14em;
padding: 1em;
vertical-align: top;
}
.contactbox table th span {
font-weight: normal;
font-size: 12px;
color: #3198d0;
}
@media (max-width: 1000px) {
.contactbox table th span {
font-size: 22px;
}
}
@media (max-width: 1000px) {
.contactbox table th {
width: auto;
padding: 1.5em 1em 0px;
border: none;
}
}
@media (max-width: 1000px) {
.contactbox table td {
padding-top: 1em;
padding-bottom: 1.5em;
}
.contactbox table td .ex {
display: block;
padding-top: 0.5em;
}
}
.contactbox table .mt {
margin-top: 10px;
}
.contactbox table input {
width: 50%;
}
.contactbox table input.short {
width: 7em;
}
.contactbox table input[type=checkbox] {
width: auto;
}
@media (max-width: 1000px) {
.contactbox table input {
width: 100%;
padding: 15px 10px;
}
}
@media (max-width: 1000px) {
.contactbox table select {
padding: 10px;
padding-right: 2em;
}
.contactbox table select#item {
width: 100%;
}
}
.contactbox table #zip {
width: 10em;
margin: 0px 5px;
}
.contactbox table textarea {
width: 100%;
height: 18em;
}
.contactbox .complete {
text-align: center;
}
.contactbox .complete h2 {
margin-bottom: 30px;
padding: 90px 0px 0px;
color: #3198d0;
font-size: 28px;
font-weight: normal;
}
.contactbox .complete p {
margin-bottom: 2em;
font-size: 17px;
line-height: 2;
}
@media (max-width: 1000px) {
.contactbox .complete p {
font-size: 24px;
}
}
.contactbox .mw_wp_form .error {
display: inline-block;
}
.contactbox #mw-wp-form-captcha {
text-align: center;
line-height: 2.2em;
padding: 0 3% 2.0em 3%;
}
.contactbox .send, .contactbox .home {
text-align: center;
}
.contactbox .send input, .contactbox .send a, .contactbox .home input, .contactbox .home a {
display: inline-block;
padding: 0.7em 3em;
text-align: center;
font-size: 18px;
border: none;
background: none;
-webkit-box-sizing: border-box;
box-sizing: border-box;
color: #fff;
background: #3198d0;
border-radius: 6px;
cursor: pointer;
}
.contactbox .send input:hover, .contactbox .send a:hover, .contactbox .home input:hover, .contactbox .home a:hover {
background: #FF8200;
-webkit-transition: 0.3s;
-o-transition: 0.3s;
transition: 0.3s;
}
.contactbox .send input.back, .contactbox .send a.back, .contactbox .home input.back, .contactbox .home a.back {
background: #898989;
color: #fff;
margin-right: 1em;
}
@media (max-width: 1000px) {
.contactbox .send input.back, .contactbox .send a.back, .contactbox .home input.back, .contactbox .home a.back {
margin-right: 0px;
}
}
@media (max-width: 1000px) {
.contactbox .send input, .contactbox .send a, .contactbox .home input, .contactbox .home a {
display: block;
width: 100%;
margin-bottom: 15px;
font-size: 24px;
text-align: center;
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
} #privacy #eyecatch .eyebox {
background-image: url(/site/img/privacy/main.jpg);
}
#privacy .sec_privacy1 {
margin-bottom: 80px;
}
#privacy .blk_pri {
margin-bottom: 48px;
}
#privacy .blk_pri .tit {
font-family: dnp-shuei-mincho-pr6n, sans-serif;
font-weight: normal;
font-size: 20px;
line-height: 1.4;
color: #3198d0;
padding: 6px 0 12px;
position: relative;
margin-bottom: 16px;
}
@media (max-width: 1000px) {
#privacy .blk_pri .tit {
font-size: 26px;
}
}
#privacy .blk_pri .tit:after {
content: "";
width: 100%;
height: 1px;
display: block;
position: absolute;
left: 0;
bottom: 0px;
background: #9fa0a0;
}
#privacy .blk_pri ol.ini1 {
margin: 0 40px;
font-size: 16px;
}
@media (max-width: 1000px) {
#privacy .blk_pri ol.ini1 {
font-size: 26px;
}
}
#privacy .blk_pri ol.ini1 > li {
list-style-type: decimal;
margin-bottom: 12px;
}
#privacy .blk_pri ol.ini1 > li > dl > dt {
padding: 8px 0;
border-bottom: 2px solid #B2B3B3;
}
#privacy .blk_pri ol.ini1 > li > dl > dd {
padding: 8px 0;
}
#privacy .blk_pri ol.ol_pri {
font-size: 14px;
margin-top: 8px;
margin-bottom: 32px;
}
@media (max-width: 1000px) {
#privacy .blk_pri ol.ol_pri {
font-size: 24px;
}
}
#privacy .blk_pri ol.ol_pri > li {
line-height: 1.8;
list-style-type: decimal;
list-style-position: inside;
padding: 2px 0 4px;
}
#privacy .blk_pri .txt_gr {
margin-bottom: 24px;
}
#privacy .blk_pri .txt_gr p {
font-size: 14px;
line-height: 2;
}
@media (max-width: 1000px) {
#privacy .blk_pri .txt_gr p {
font-size: 26px;
letter-spacing: 1px;
line-height: 1.6;
}
} #sitemaps .detail {
padding: 30px 0px 60px;
}
#sitemaps .detail .list > li > a {
display: block;
padding: 1em 1em;
font-size: 16px;
}
@media (max-width: 1000px) {
#sitemaps .detail .list > li > a {
font-size: 28px;
}
}
#sitemaps .detail .list ul.children li {
display: inline-block;
}
@media (max-width: 1000px) {
#sitemaps .detail .list ul.children li {
display: block;
margin: 1.5em;
}
}
#sitemaps .detail .list ul.children li a {
display: block;
padding: 1.5em 1em;
margin-right: 1em;
}
@media (max-width: 1000px) {
#sitemaps .detail .list ul.children li a {
padding: 0px;
margin: 0px;
}
} #news #pageTitle .obj {
height: 464px;
}
@media (max-width: 1000px) {
#news #pageTitle .obj {
width: auto;
height: 320px;
}
}
#news #newlist .heading {
margin: 24px 0;
letter-spacing: 0.4em;
}
@media (max-width: 1000px) {
#news #newlist .heading {
text-align: center;
margin: 40px auto;
}
}
#news #newlist .heading .tit, #news #newlist .heading .tit_sitename {
letter-spacing: normal;
display: inline-block;
vertical-align: middle;
}
@media (max-width: 1000px) {
#news #newlist .heading .tit, #news #newlist .heading .tit_sitename {
display: block;
}
}
#news #newlist .heading .tit_sitename .mark, #news #newlist .heading .tit_sitename .type {
display: inline-block;
vertical-align: middle;
}
@media (max-width: 1000px) {
#news #newlist .heading .tit_sitename .mark, #news #newlist .heading .tit_sitename .type {
display: block;
}
}
@media (max-width: 1000px) {
#news #newlist .heading .tit_sitename .mark img {
height: 70px;
}
}
@media (max-width: 1000px) {
#news #newlist .heading .tit_sitename .type img {
height: 22px;
}
}
#news #newlist .heading .tit {
margin-left: 12px;
padding-top: 12px;
line-height: 1;
}
#news #newlist .li_sort {
letter-spacing: -.4em;
margin: 32px -16px 16px 0;
text-align: center;
}
@media (max-width: 1000px) {
#news #newlist .li_sort {
margin: 24px -8px 16px 0;
text-align: left;
}
}
#news #newlist .li_sort > li {
margin-right: 16px;
letter-spacing: normal;
display: inline-block;
vertical-align: top;
}
@media (max-width: 1000px) {
#news #newlist .li_sort > li {
margin-right: 8px;
margin-bottom: 8px;
}
}
#news #newlist .li_sort > li a {
width: 158px;
text-align: center;
font-size: 16px;
display: block;
color: #fff;
background: #3198d0;
line-height: 1;
border-radius: 24px;
padding: 12px 16px;
}
#news #newlist .li_sort > li a.clr_new {
background: #3198d0;
}
#news #newlist .li_sort > li a.clr_rec {
background: #2F7EBA;
}
#news #newlist .li_sort > li a.clr_ir {
background: #FA9126;
}
#news #newlist .li_sort > li a.clr_srvc {
background: #34BE90;
}
#news #newlist .ul_news {
margin: 56px auto;
border: 3px solid #D7DFE2;
padding: 40px;
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
#news #newlist .ul_news > li a {
display: block;
position: relative;
}
#news #newlist .ul_news > li a:after {
content: "";
display: inline-block;
vertical-align: middle;
width: 17px;
height: 17px;
background: url(/site/img/index/news_icn1.svg) center center no-repeat;
background-size: contain;
margin-right: 8px;
position: absolute;
right: 0;
top: 50%;
-webkit-transform: translateY(-50%); -ms-transform: translateY(-50%);
transform: translateY(-50%);
}
@media (max-width: 1000px) {
#news #newlist .ul_news > li a:after {
width: 26px;
height: 26px;
}
}
#news #newlist .ul_news > li .gr {
width: 100%;
display: table;
position: relative;
padding: 8px 3em 8px 0;
}
@media (max-width: 1000px) {
#news #newlist .ul_news > li .gr {
padding: 24px 40px 24px 0;
}
}
#news #newlist .ul_news > li .gr p {
display: table-cell;
vertical-align: top;
font-size: 14px;
}
@media (max-width: 1000px) {
#news #newlist .ul_news > li .gr p {
display: block;
font-size: 24px;
}
}
#news #newlist .ul_news > li .tag_cat {
width: 10em;
}
#news #newlist .ul_news > li .tag_cat span {
text-align: left;
display: block;
padding: 0;
}
@media (max-width: 1000px) {
#news #newlist .ul_news > li .tag_cat span {
position: absolute;
left: 0;
top: 24px;
font-size: 20px;
}
}
#news #newlist .ul_news > li .tag_cat span.clr_new {
color: #61808F;
}
#news #newlist .ul_news > li .tag_cat span.clr_event {
color: #D18241;
}
#news #newlist .ul_news > li .tag_cat span.clr_blog {
color: #D17F7F;
}
#news #newlist .ul_news > li .arti {
font-size: 14px;
padding-left: 16px;
}
@media (max-width: 1000px) {
#news #newlist .ul_news > li .arti {
padding-left: 140px;
}
}
#news #newlist .ul_news > li .data {
width: 8em;
}
@media (max-width: 1000px) {
#news #newlist .ul_news > li .data {
width: auto;
padding-left: 140px;
}
}
#news #newdetail .post {
border: 3px solid #D7DFE2;
padding: 48px;
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
#news #newdetail .post > .heading > .gr {
font-size: 15px;
line-height: 1;
padding: 16px 0;
position: relative;
}
@media (max-width: 1000px) {
#news #newdetail .post > .heading > .gr {
font-size: 24px;
}
}
#news #newdetail .post > .heading > .gr .cat {
display: inline-block;
display: none;
}
#news #newdetail .post > .heading > .gr .cat span {
width: 158px;
text-align: center;
font-size: 14px;
display: block;
color: #fff;
background: #3198d0;
line-height: 1;
border-radius: 16px;
padding: 8px 16px;
}
@media (max-width: 1000px) {
#news #newdetail .post > .heading > .gr .cat span {
font-size: 20px;
}
}
#news #newdetail .post > .heading > .gr .cat span.clr_new {
background: #3198d0;
}
#news #newdetail .post > .heading > .gr .cat span.clr_rec {
background: #2F7EBA;
}
#news #newdetail .post > .heading > .gr .cat span.clr_ir {
background: #FA9126;
}
#news #newdetail .post > .heading > .gr .cat span.clr_srvc {
background: #34BE90;
}
#news #newdetail .post > .heading > .gr .postdate {
color: #858585;
position: absolute;
right: 0;
top: 0;
padding: 16px 0;
}
@media (max-width: 1000px) {
#news #newdetail .post > .heading > .gr .postdate {
position: static;
display: inline-block;
margin-left: 8px;
}
}
#news #newdetail .post > .heading .title {
font-weight: normal;
font-size: 33px;
letter-spacing: .15em;
line-height: 1.4;
margin: 16px auto;
}
@media (max-width: 1000px) {
#news #newdetail .post > .heading .title {
font-size: 34px;
}
}
#news #newdetail .post > .heading .title:after {
content: "";
display: block;
vertical-align: middle;
margin-top: 24px;
width: 100%;
height: 8px;
background: url(/site/img/common/h_bg_hr1.svg) center center repeat-x;
}
#news #newdetail .post .entry {
font-size: 16px;
line-height: 2;
}
@media (max-width: 1000px) {
#news #newdetail .post .entry {
font-size: 26px;
line-height: 1.6;
}
}
#news #newdetail .post .entry p {
font-family: "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", sans-serif;
margin-bottom: 2em;
}
#news #newdetail .post .entry p:last-child {
margin-bottom: 0;
}
#news #newdetail .post .entry img {
width: 100%;
display: block;
margin: 40px auto 0;
}
#news #newdetail .nav_page {
width: 100%;
margin: 40px auto;
letter-spacing: -.4em;
display: table;
}
@media (max-width: 1000px) {
#news #newdetail .nav_page {
margin: 64px auto;
}
}
#news #newdetail .nav_page .np {
letter-spacing: normal;
display: table-cell;
vertical-align: top;
font-size: 14px;
}
@media (max-width: 1000px) {
#news #newdetail .nav_page .np {
font-size: 24px;
}
}
#news #newdetail .nav_page .np a {
color: #3198d0;
}
#news #newdetail .nav_page .prev,
#news #newdetail .nav_page .next {
width: 38%;
position: relative;
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
#news #newdetail .nav_page .back {
width: 24%;
text-align: center;
}
#news #newdetail .nav_page .prev {
padding-left: 16px;
}
#news #newdetail .nav_page .prev:before {
content: "←";
display: inline-block;
margin-right: 8px;
}
#news #newdetail .nav_page .next {
text-align: right;
padding-right: 16px;
}
#news #newdetail .nav_page .next:after {
content: "→";
display: inline-block;
margin-left: 8px;
} .entry {
word-wrap: break-word;
line-height: 2;
font-size: 16px;
}
@media (max-width: 1000px) {
.entry {
font-size: 24px;
}
}
.entry h1, .entry h2, .entry h3, .entry h4, .entry h5, .entry h6 {
position: static;
clear: both;
float: none;
height: auto;
min-height: 1px;
margin: 0 0 1em;
padding: 0px;
background: none;
border: none;
color: #333;
text-shadow: 1px 1px 0 #fff;
}
.entry h1 {
font-size: 145.5%;
}
.entry h2 {
font-size: 136.4%;
}
.entry h3 {
font-size: 127.3%;
}
.entry h4 {
font-size: 127.3%;
}
.entry h5 {
font-size: 118.2%;
}
.entry h6 {
font-size: 100%;
}
.entry strong, .entry b {
font-weight: bold;
}
.entry p {
margin: 0em 0em 2em 0em;
}
.entry em {
font-style: italic;
}
.entry ol {
margin: 1em 2em 1em;
}
.entry ul {
margin: 1em 0 1em;
}
.entry ul li {
margin: 0em 0em 0.5em 1em;
}
.entry ol li {
margin: 0em 0em 0.5em 0em;
}
.entry ul {
list-style: disc;
}
.entry ol {
list-style: decimal;
}
.entry dl {
margin: 1em 0;
}
.entry dd {
margin-left: 2em;
}
.entry table.wp-oembed,
.entry table.wp-oembed td {
border: none;
}
.entry table caption {
font-size: 14px;
font-weight: bold;
text-align: left;
}
.entry table {
clear: both;
width: 99%;
border-collapse: collapse;
border-spacing: 0;
margin: 1em 0 2em;
}
.entry table th {
padding: 0.5em;
background: #f5f5f5;
font-weight: bold;
text-shadow: 1px 1px 0 #fff;
}
.entry table td {
padding: .5em;
}
.entry img {
max-width: 100%;
height: auto;
margin-bottom: 2em;
}
.entry img.aligncenter {
clear: both;
display: block;
margin: auto;
}
.entry a {
text-decoration: underline;
}
.entry iframe {
max-width: 100%;
}
@media (min-width: 1001px) {
.entry img.alignleft {
float: left;
margin-right: 2em;
}
.entry img.alignright {
float: right;
margin-left: 2em;
}
}
article {
position: relative;
padding: 0;
}
@media (max-width: 1000px) {
article #eyecatch {
margin: 110px auto 110px;
}
}
.sec {
margin-bottom: 40px;
}
.sec .tit_std01 {
text-align: center;
position: relative;
margin: 0 auto 20px;
padding-top: 20px;
font-size: 29px;
line-height: 1;
color: #3198d0;
}
@media (max-width: 1000px) {
.sec .tit_std01 {
margin: 0 auto 32px;
line-height: 1.2;
}
}
.sec .tit_std01 > img {
display: inline-block;
vertical-align: middle;
}
.sec .tit_std01:before {
content: "";
display: inline-block;
vertical-align: middle;
width: 72px;
height: 64px;
background: url(/site/img/about/h_icn1.png) center center no-repeat;
background-size: contain;
margin-right: 12px;
}
@media (max-width: 1000px) {
.sec .tit_std01:before {
width: 98px;
height: 88px;
display: block;
margin: 0 auto 16px;
text-align: center;
}
}
.sec .tit_std02 {
display: inline-block;
text-align: center;
margin: 0 auto 20px;
padding-top: 20px;
font-size: 29px;
line-height: 1.4;
color: #3198d0;
position: relative;
}
@media (max-width: 1000px) {
.sec .tit_std02 {
margin: 0 auto 32px;
line-height: 1.2;
}
}
.sec .tit_std02:before {
content: "";
display: inline-block;
vertical-align: middle;
width: 72px;
height: 64px;
background: url(/site/img/about/h_icn1.png) center center no-repeat;
background-size: contain;
position: absolute;
left: -88px;
top: 8px;
}
@media (max-width: 1000px) {
.sec .tit_std02:before {
width: 98px;
height: 88px;
display: block;
margin: 0 auto 16px;
text-align: center;
position: static;
}
}
.sec .hd_std2 {
position: relative;
text-align: center;
}
.sec .hd_std2 .desc {
font-size: 14px;
line-height: 1.8;
text-align: center;
position: absolute;
margin-left: 40px;
bottom: -10px;
left: 50%;
-webkit-transform: translateX(-50%);
-ms-transform: translateX(-50%);
transform: translateX(-50%);
}
@media (max-width: 1000px) {
.sec .hd_std2 .desc {
margin-left: 0;
font-size: 24px;
position: static;
-webkit-transform: translateX(0%);
-ms-transform: translateX(0%);
transform: translateX(0%);
}
}
.sec .hd_std1 {
position: relative;
margin-bottom: 56px;
}
@media (max-width: 1000px) {
.sec .hd_std1 {
margin-bottom: 24px;
}
}
.sec .hd_std1 .desc {
font-size: 14px;
line-height: 1.8;
text-align: center;
position: absolute;
margin-left: 40px;
bottom: -40px;
left: 50%;
-webkit-transform: translateX(-50%);
-ms-transform: translateX(-50%);
transform: translateX(-50%);
}
@media (max-width: 1000px) {
.sec .hd_std1 .desc {
margin-left: 0;
font-size: 24px;
position: static;
-webkit-transform: translateX(0%);
-ms-transform: translateX(0%);
transform: translateX(0%);
}
}
.conv_area {
padding: 80px 0 56px;
}
@media (max-width: 1000px) {
.conv_area {
padding: 30px 30px;
}
}
.conv_area .reco_cont > .tit {
font-size: 28px;
line-height: 1.4;
color: #3198d0;
text-align: center;
margin: 8px auto;
}
@media (max-width: 1000px) {
.conv_area .reco_cont > .tit {
text-align: left;
font-size: 38px;
margin-left: 160px;
line-height: 1.2;
margin-bottom: 24px;
}
}
.conv_area .reco_cont .box_move {
width: 590px;
margin: 0 auto 56px;
background: #3198d0;
border-radius: 8px;
padding: 22px 16px 16px;
-webkit-box-sizing: border-box;
box-sizing: border-box;
color: #fff;
text-align: center;
position: relative;
}
.conv_area .reco_cont .box_move:before {
content: "";
display: inline-block;
vertical-align: middle;
width: 94px;
height: 250px;
background: url(/site/img/common/reco_obj1.svg) center 0 no-repeat;
position: absolute;
left: -110px;
bottom: -56px;
}
@media (max-width: 1000px) {
.conv_area .reco_cont .box_move:before {
width: 113px;
height: 164px;
background: url(/site/img_sp/common/reco_obj1.svg) center 0 no-repeat;
left: 24px;
bottom: auto;
top: -164px;
}
}
@media (max-width: 1000px) {
.conv_area .reco_cont .box_move {
width: auto;
}
}
.conv_area .reco_cont .box_move .tit {
font-size: 24px;
line-height: 1;
}
.conv_area .reco_cont .box_move .txt01 {
font-size: 19px;
line-height: 1.6;
}
.conv_area .reco_cont .box_move ul.ul_reco {
letter-spacing: -.4em;
text-align: center;
margin: 0 -8px;
}
.conv_area .reco_cont .box_move ul.ul_reco > li {
letter-spacing: normal;
display: inline-block;
vertical-align: top;
margin: 4px 8px;
}
@media (max-width: 1000px) {
.conv_area .reco_cont .box_move ul.ul_reco > li {
display: block;
margin: 8px auto;
}
}
.conv_area .box_info {
width: 940px;
margin: 0 auto;
padding: 28px;
-webkit-box-sizing: border-box;
box-sizing: border-box;
background: #1EA939;
border-radius: 8px;
color: #fff;
position: relative;
z-index: 1;
}
@media (max-width: 1000px) {
.conv_area .box_info {
width: auto;
}
}
.conv_area .box_info .obj1 {
position: absolute;
right: 32px;
bottom: 0;
z-index: 2;
}
@media (max-width: 1000px) {
.conv_area .box_info .obj1 {
display: none;
}
}
.conv_area .box_info .heading {
z-index: 100;
}
.conv_area .box_info .heading .tit {
font-size: 22px;
line-height: 1.4;
letter-spacing: .08em;
}
@media (max-width: 1000px) {
.conv_area .box_info .heading .tit {
font-size: 36px;
text-align: center;
}
}
.conv_area .box_info .heading .desc {
font-size: 18px;
}
@media (max-width: 1000px) {
.conv_area .box_info .heading .desc {
font-size: 24px;
font-weight: bold;
font-weight: 700;
}
}
.conv_area .box_info .txt_gr {
z-index: 100;
position: relative;
}
@media (max-width: 1000px) {
.conv_area .box_info .txt_gr {
min-height: 110px;
}
}
.conv_area .box_info .txt_gr p {
font-size: 14px;
}
@media (max-width: 1000px) {
.conv_area .box_info .txt_gr p {
font-size: 24px;
z-index: 100;
font-weight: bold;
font-weight: 700;
}
}
.conv_area .box_info .btn_area {
margin: 16px auto 0;
z-index: 100;
}
@media (max-width: 1000px) {
.conv_area .box_info .btn_area a.btn_std1 {
width: 100%;
font-size: 34px;
line-height: 1.6;
text-shadow: 2px 2px 0 #fff,-2px -2px 0 #fff,-2px 2px 0 #fff,-2px 2px 0 #fff;
z-index: 10;
padding: 32px 64px 32px 32px;
}
.conv_area .box_info .btn_area a.btn_std1:after {
width: 36px;
height: 36px;
}
.conv_area .box_info .btn_area a.btn_std1:before {
content: "";
display: inline-block;
vertical-align: middle;
width: 332px;
height: 238px;
background: url(/site/img/common/info_obj1.png) center 0 no-repeat;
background-size: contain;
position: absolute;
right: 8px;
bottom: 0;
z-index: -1;
}
}
@media (max-width: 1000px) {
.conv_area .box_info .btn_area a.btn_std1 span {
font-size: 25px;
display: block;
line-height: 1.4;
}
}
.conv_area .box_info a.btn_std1 {
font-weight: bold;
font-weight: 700;
font-size: 19px;
line-height: 1;
position: relative;
background: #fff;
padding: 22px 64px 22px 32px;
border-radius: 12px;
-webkit-box-sizing: border-box;
box-sizing: border-box;
display: inline-block;
z-index: 100;
}
.conv_area .box_info a.btn_std1:after {
content: "";
display: inline-block;
vertical-align: middle;
width: 25px;
height: 25px;
background: url(/site/img/common/btn_arr.svg) center center no-repeat;
background-size: contain;
position: absolute;
right: 24px;
top: 50%;
-webkit-transform: translateY(-50%); -ms-transform: translateY(-50%);
transform: translateY(-50%);
}
.conv_area .box_info a.btn_std1:hover {
opacity: 1;
color: #FF8200;
-webkit-transition: 0.3s;
-o-transition: 0.3s;
transition: 0.3s;
}
.conv_area .box_info a.btn_std1:hover:after {
-webkit-transition: 0.3s;
-o-transition: 0.3s;
transition: 0.3s;
right: 20px;
} #about #eyecatch .eyebox {
background-image: url(/site/img/about/main.jpg);
}
#about .sec {
margin-bottom: 40px;
}
#about section#outline {
margin-bottom: 40px;
}
#about section#outline .ul_outline {
width: 760px;
margin: 0 auto;
}
@media (max-width: 1000px) {
#about section#outline .ul_outline {
width: auto;
}
}
#about section#access {
margin-bottom: 0px;
padding-bottom: 0;
}
#about section#access .googlemap {
text-align: center;
font-size: 0;
line-height: 0;
}
#about section#access .googlemap iframe {
width: 100%;
}
#about section#access .add {
background: #e8e8e8;
padding: 24px 0;
}
#about section#access .add p {
font-size: 13px;
font-weight: bold;
font-weight: 700;
padding-top: 0;
}
@media (max-width: 1000px) {
#about section#access .add p {
font-size: 26px;
font-weight: normal;
}
}
#about .ul_outline {
background: #fff;
}
#about .ul_outline > li {
width: 100%;
}
#about .ul_outline > li > dl {
width: 100%;
display: table;
}
#about .ul_outline > li > dl > dt, #about .ul_outline > li > dl > dd {
font-size: 16px;
line-height: 1.8;
padding: 22px 8px 24px 24px;
vertical-align: top;
display: table-cell;
border-top: 1px solid #555;
}
@media (max-width: 1000px) {
#about .ul_outline > li > dl > dt, #about .ul_outline > li > dl > dd {
font-size: 24px;
padding: 24px 8px 24px 16px;
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
}
#about .ul_outline > li > dl > dt {
width: 12em;
background: #e8e8e8;
letter-spacing: .16em;
}
@media (max-width: 1000px) {
#about .ul_outline > li > dl > dt {
width: 8em;
padding-bottom: 8px;
letter-spacing: normal;
}
}
#about .ul_outline > li > dl > dd a {
color: #000;
}
#about .ul_outline > li > dl > dd a:hover {
opacity: 1;
color: #FF8200;
-webkit-transition: 0.3s;
-o-transition: 0.3s;
transition: 0.3s;
}
#about .ul_outline > li > dl > dd ul.ul_li01 > li {
margin-bottom: 8px;
}
#about .ul_outline > li > dl > dd ul.ul_li01 > li:last-child {
margin-bottom: 0;
}
#about .ul_outline > li > dl > dd ul.ul_works > li {
margin-bottom: 24px;
}
#about .ul_outline > li > dl > dd ul.ul_works > li:last-child {
margin-bottom: 0;
}
#about .ul_outline > li > dl > dd ul.ul_works > li > dl > dt, #about .ul_outline > li > dl > dd ul.ul_works > li > dl > dd {
line-height: 1.6;
}
#about .ul_outline > li > dl > dd ul.ul_works > li > dl > dt {
margin-bottom: 6px;
}
#about .ul_outline > li > dl > dd ul.ul_works > li > dl > dd {
margin-bottom: 12px;
}
#about .ul_outline > li > dl > dd ul.ul_works > li > dl > dd:last-child {
margin-bottom: 0;
}
#about .ul_outline > li:last-child > dl > dt {
border-bottom: 1px solid #555;
}
#about .ul_outline > li:last-child > dl > dd {
border-bottom: 1px solid #555;
} #news {
position: relative;
padding: 0;
}
@media (max-width: 1000px) {
#news {
padding-top: 20px;
}
}
#news #eyecatch .eyebox {
background-image: url(/site/img/news/main.jpg);
} #faq #eyecatch .eyebox {
background-image: url(/site/img/faq/main.jpg);
}
#faq #faq_sec {
margin-bottom: 0;
}
#faq .faq_list {
margin-bottom: 40px;
}
#faq .faq_list .li_faq {
margin-top: 16px;
}
#faq .li_faq > li {
padding: 12px 0;
}
@media (max-width: 1000px) {
#faq .li_faq > li {
padding: 0px 0px 24px;
line-height: 1.8;
}
}
#faq .li_faq > li > .q {
padding: 0 0 0 148px;
background: #fff;
position: relative;
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
@media (max-width: 1000px) {
#faq .li_faq > li > .q {
margin: 0 30px;
padding: 0 0 0 128px;
}
}
#faq .li_faq > li > .q:before {
content: "";
display: inline-block;
vertical-align: middle;
width: 144px;
height: 134px;
background: url(/site/img/faq/icn_sb.svg) center center no-repeat;
background-size: contain;
margin-right: 8px;
position: absolute;
left: 12px;
bottom: 0;
z-index: 100;
}
@media (max-width: 1000px) {
#faq .li_faq > li > .q:before {
background: url(/site/img_sp/faq/icn_sb.svg) center center no-repeat;
width: 148px;
height: 153px;
left: 0;
}
}
#faq .li_faq > li > .q .tit_q {
font-size: 22px;
font-weight: bold;
font-weight: 700;
line-height: 1;
padding: 42px 50px 42px 84px;
margin: 0;
-webkit-box-sizing: border-box;
box-sizing: border-box;
position: relative;
bottom: 10px;
cursor: pointer;
border: 5px solid #3198d0;
border-radius: 40px;
}
@media (max-width: 1000px) {
#faq .li_faq > li > .q .tit_q {
font-size: 28px;
line-height: 1.4;
padding: 24px 16px 20px 84px;
overflow: hidden;
}
}
#faq .li_faq > li > .q .tit_q:before {
width: 40px;
height: 32px;
line-height: 1;
margin-right: 16px;
content: "";
display: inline-block;
position: absolute;
left: 24px;
top: 50%;
-webkit-transform: translateY(-50%); -ms-transform: translateY(-50%);
transform: translateY(-50%);
vertical-align: bottom;
background: url(/site/img/faq/icn_q.svg) 0 0 no-repeat;
background-size: contain;
}
@media (max-width: 1000px) {
#faq .li_faq > li > .q .tit_q:before {
width: 50px;
height: 40px;
left: 24px;
top: 16px;
-webkit-transform: translateY(0%); -ms-transform: translateY(0%);
transform: translateY(0%);
}
}
#faq .li_faq > li > .q .tit_q:after {
width: 108px;
height: 22px;
line-height: 1;
margin-left: 16px;
content: "";
display: inline-block;
vertical-align: bottom;
position: absolute;
right: 16px;
top: 50%;
-webkit-transform: translateY(-50%);
-ms-transform: translateY(-50%);
transform: translateY(-50%);
background: url(/site/img/faq/icn_dd.svg) 0 0 no-repeat;
background-size: contain;
}
@media (max-width: 1000px) {
#faq .li_faq > li > .q .tit_q:after {
position: static;
-webkit-transform: translateY(0%);
-ms-transform: translateY(0%);
transform: translateY(0%);
float: right;
margin: 16px 0 0;
}
}
#faq .li_faq > li > .a {
background: #E8E8E8;
overflow: hidden;
display: none;
}
#faq .li_faq > li > .a .box_a {
margin: 24px auto;
padding: 0 24px 32px 236px;
-webkit-box-sizing: border-box;
box-sizing: border-box;
position: relative;
}
@media (max-width: 1000px) {
#faq .li_faq > li > .a .box_a {
margin: 32px auto 24px;
padding: 0px 30px 32px 108px;
}
}
#faq .li_faq > li > .a .box_a:before {
width: 42px;
height: 32px;
line-height: 1;
content: "";
display: inline-block;
position: absolute;
left: 175px;
top: -2px;
vertical-align: bottom;
background: url(/site/img/faq/icn_a.svg) 0 0 no-repeat;
background-size: contain;
}
@media (max-width: 1000px) {
#faq .li_faq > li > .a .box_a:before {
width: 50px;
height: 38px;
left: 40px;
top: 5px;
}
}
#faq .li_faq > li > .a .box_a .desgin_note {
font-size: 22px;
background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0)), color-stop(97%, rgba(0, 0, 0, 0)), color-stop(97%, #999), to(#999));
background-image: -webkit-linear-gradient(top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 97%, #999 97%, #999 100%);
background-image: -o-linear-gradient(top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 97%, #999 97%, #999 100%);
background-image: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 97%, #999 97%, #999 100%);
background-size: 100% 2em;
line-height: 2;
}
#faq .li_faq > li > .a .box_a img {
float: right;
display: block;
padding-left: 40px;
padding-bottom: 4px;
}
#faq .li_faq > li > .a ul, #faq .li_faq > li > .a ol {
font-size: 2.3rem;
line-height: 1.8;
}
#faq .li_faq > li > .a ul.att li, #faq .li_faq > li > .a ol.att li {
text-indent: -1em;
padding-left: 1em;
}
#faq .li_faq > li > .a p {
font-size: 18px;
line-height: 1.8;
display: inline;
}
@media (max-width: 1000px) {
#faq .li_faq > li > .a p {
font-size: 24px;
line-height: 1.6;
}
}
#faq .li_faq > li > .a a.btn_std01 {
margin-top: 16px;
} .conv_area2 {
background: #e3f4e6;
padding: 40px 0;
}
.conv_area2 .tit {
font-size: 33px;
color: #1ea939;
line-height: 1.4;
text-align: center;
margin-bottom: 16px;
}
.conv_area2 .desc {
font-size: 18px;
font-weight: bold;
font-weight: 700;
line-height: 1.8;
}
@media (max-width: 1000px) {
.conv_area2 .desc {
font-size: 24px;
}
}
.conv_area2 .gr_tel {
text-align: center;
margin: 40px auto 16px;
position: relative;
}
.conv_area2 .gr_tel .tel,
.conv_area2 .gr_tel .obj1 {
display: inline-block;
vertical-align: middle;
}
@media (max-width: 1000px) {
.conv_area2 .gr_tel .tel {
padding-top: 150px;
}
}
.conv_area2 .gr_tel .obj1 {
margin-left: 16px;
position: relative;
}
@media (max-width: 1000px) {
.conv_area2 .gr_tel .obj1 {
margin-left: 0;
position: absolute;
top: 8px;
left: 50%;
-webkit-transform: translateX(-50%);
-ms-transform: translateX(-50%);
transform: translateX(-50%);
}
}
.conv_area2 .gr_tel .obj1:before {
content: "";
display: inline-block;
vertical-align: middle;
width: 130px;
height: 78px;
background: url(/site/img/business/tel_gr_txt2.svg) center center no-repeat;
background-size: contain;
position: absolute;
right: -130px;
top: -32px;
}
#business #eyecatch .eyebox {
background-image: url(/site/img/business/main.jpg);
}
@media (max-width: 1000px) {
#business .item .heading {
text-align: center;
margin-bottom: 12px;
}
}
#business .item .heading .desc {
font-size: 16px;
line-height: 1.4;
}
@media (max-width: 1000px) {
#business .item .heading .desc {
font-size: 24px;
}
}
#business .item .heading .tit {
font-size: 29px;
color: #3198d0;
line-height: 1.4;
}
@media (max-width: 1000px) {
#business .item .heading .tit {
font-size: 32px;
}
}
#business .item .lo {
display: table;
margin-bottom: 80px;
}
#business .item .lo .txt_blk,
#business .item .lo .tmb_blk {
display: table-cell;
vertical-align: top;
}
@media (max-width: 1000px) {
#business .item .lo .txt_blk,
#business .item .lo .tmb_blk {
display: block;
margin: 0 auto;
}
}
#business .item .lo .txt_blk {
padding-left: 32px;
font-size: 18px;
line-height: 1.8;
}
@media (max-width: 1000px) {
#business .item .lo .txt_blk {
font-size: 24px;
padding-left: 0;
}
}
#business .item .lo .txt_blk .subtit {
font-size: 22px;
line-height: 1.8;
margin-bottom: 8px;
color: #3198d0;
}
@media (max-width: 1000px) {
#business .item .lo .txt_blk .subtit {
font-size: 30px;
}
}
#business .item .lo .txt_blk .ul_txt_price li,
#business .item .lo .txt_blk .txt_price {
width: 100%;
display: table;
text-align: right;
font-weight: bold;
margin: 16px 0;
}
@media (max-width: 1000px) {
#business .item .lo .txt_blk .ul_txt_price li,
#business .item .lo .txt_blk .txt_price {
margin-bottom: 16px;
}
}
#business .item .lo .txt_blk .ul_txt_price li .amt, #business .item .lo .txt_blk .ul_txt_price li .price,
#business .item .lo .txt_blk .txt_price .amt,
#business .item .lo .txt_blk .txt_price .price {
display: table-cell;
vertical-align: bottom;
}
#business .item .lo .txt_blk .ul_txt_price li .amt,
#business .item .lo .txt_blk .txt_price .amt {
text-align: left;
font-size: 22px;
}
#business .item .lo .txt_blk .ul_txt_price li .amt small,
#business .item .lo .txt_blk .txt_price .amt small {
font-size: 18px;
}
@media (max-width: 1000px) {
#business .item .lo .txt_blk .ul_txt_price li .amt,
#business .item .lo .txt_blk .txt_price .amt {
vertical-align: middle;
width: 55%;
font-size: 32px;
line-height: 1.2;
}
#business .item .lo .txt_blk .ul_txt_price li .amt small,
#business .item .lo .txt_blk .txt_price .amt small {
display: block;
font-size: 24px;
}
}
@media (max-width: 1000px) {
#business .item .lo .txt_blk .ul_txt_price li .price,
#business .item .lo .txt_blk .txt_price .price {
width: 45%;
}
}
#business .item .lo .txt_blk .ul_txt_price li span,
#business .item .lo .txt_blk .txt_price span {
font-size: 22px;
letter-spacing: -.06em;
}
@media (max-width: 1000px) {
#business .item .lo .txt_blk .ul_txt_price li span,
#business .item .lo .txt_blk .txt_price span {
font-size: 32px;
}
}
#business .item .lo .txt_blk .ul_txt_price li span.tax,
#business .item .lo .txt_blk .txt_price span.tax {
font-size: 18px;
}
@media (max-width: 1000px) {
#business .item .lo .txt_blk .ul_txt_price li span.tax,
#business .item .lo .txt_blk .txt_price span.tax {
font-size: 24px;
line-height: 1;
display: block;
}
}
#business .item .lo .txt_blk .ul_txt_price li span.yen,
#business .item .lo .txt_blk .txt_price span.yen {
letter-spacing: normal;
font-size: 32px;
margin-left: 16px;
margin-right: -8px;
}
#business .item .lo .txt_blk .ul_txt_price li span.yen small,
#business .item .lo .txt_blk .txt_price span.yen small {
font-size: 24px;
}
@media (max-width: 1000px) {
#business .item .lo .txt_blk .ul_txt_price li span.yen small,
#business .item .lo .txt_blk .txt_price span.yen small {
font-size: 32px;
}
}
@media (max-width: 1000px) {
#business .item .lo .txt_blk .ul_txt_price li span.yen,
#business .item .lo .txt_blk .txt_price span.yen {
display: block;
font-size: 48px;
line-height: 1;
}
}
#business .item .lo .txt_blk .ul_txt_price > li {
line-height: 1;
margin: 16px 0;
}
#business .item .lo .txt_blk .btn_area {
text-align: center;
}
#business .item .lo .txt_blk a.btn_next {
font-size: 19px;
font-weight: bold;
width: 80%;
text-align: center;
color: #fff;
display: inline-block;
border-radius: 8px;
background: #3198d0;
padding: 0.6em;
-webkit-box-sizing: border-box;
box-sizing: border-box;
position: relative;
}
@media (max-width: 1000px) {
#business .item .lo .txt_blk a.btn_next {
font-size: 28px;
}
}
#business .item .lo .txt_blk a.btn_next:after {
content: "";
display: inline-block;
vertical-align: middle;
width: 38px;
height: 38px;
background: url(/site/img/business/sc_arr.svg) center center no-repeat;
background-size: contain;
position: absolute;
right: 24px;
top: 50%;
-webkit-transform: translateY(-50%); -ms-transform: translateY(-50%);
transform: translateY(-50%);
}
#business .item .lo .tmb_blk span {
width: 330px;
height: 390px;
border: 5px solid #3198d0;
background: #fff;
border-radius: 16px;
position: relative;
display: block;
}
@media (max-width: 1000px) {
#business .item .lo .tmb_blk span {
margin: 0 auto 16px;
}
}
#business .item .lo .tmb_blk img {
border-radius: 16px;
position: absolute;
top: 50%;
left: 50%;
-webkit-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
}
#business #item02 .box {
background: #E8E8E8;
-webkit-box-sizing: border-box;
box-sizing: border-box;
padding: 48px;
margin-bottom: 96px;
}
@media (max-width: 1000px) {
#business #item02 .box {
padding: 30px;
}
}
#business #item02 .box .tit {
text-align: center;
font-size: 20px;
margin-bottom: 40px;
}
@media (max-width: 1000px) {
#business #item02 .box .tit {
font-size: 28px;
}
}
#business #item02 .box .tit span {
font-size: 27px;
}
@media (max-width: 1000px) {
#business #item02 .box .tit span {
font-size: 36px;
display: block;
margin: 0 -12px;
}
}
#business #item02 .box ul.ul_feat {
display: -webkit-inline-box;
display: -webkit-inline-flex;
display: -ms-inline-flexbox;
display: inline-flex;
-webkit-flex-wrap: wrap-reverse;
-ms-flex-wrap: wrap-reverse;
flex-wrap: wrap-reverse;
-webkit-box-orient: horizontal;
-webkit-box-direction: normal;
-webkit-flex-direction: row;
-ms-flex-direction: row;
flex-direction: row;
-webkit-box-pack: justify;
-webkit-justify-content: space-between;
-ms-flex-pack: justify;
justify-content: space-between;
z-index: 100;
position: relative;
}
#business #item02 .box ul.ul_feat > li {
width: 47.5%;
display: inline-block;
margin-bottom: 16px;
}
@media (max-width: 1000px) {
#business #item02 .box ul.ul_feat > li {
width: 100%;
display: block;
}
}
#business #item02 .box ul.ul_feat > li > dl > dt {
color: #3198d0;
font-size: 28px;
line-height: 1;
margin-bottom: 4px;
}
#business #item02 .box ul.ul_feat > li > dl > dt small {
font-size: 22px;
}
@media (max-width: 1000px) {
#business #item02 .box ul.ul_feat > li > dl > dt {
font-size: 38px;
}
#business #item02 .box ul.ul_feat > li > dl > dt small {
font-size: 28px;
}
}
#business #item02 .box ul.ul_feat > li > dl > dd {
font-size: 18px;
line-height: 1.8;
margin-bottom: 16px;
}
@media (max-width: 1000px) {
#business #item02 .box ul.ul_feat > li > dl > dd {
font-size: 24px;
margin-bottom: 24px;
}
}
#business #item02 .box ul.ul_feat > li > dl > dd .att {
font-size: 15px;
font-weight: normal;
}
#business #item02 .box .pickup {
position: relative;
z-index: 1;
}
#business #item02 .box .pickup:after {
content: "";
display: inline-block;
vertical-align: middle;
width: 850px;
height: 302px;
background: url(/site/img/business/feat_bg1.png) center center no-repeat;
background-size: contain;
position: absolute;
left: 0;
top: -64px;
z-index: 1;
}
@media (max-width: 1000px) {
#business #item02 .box .pickup:after {
width: 100%;
height: 302px;
left: 0;
top: 64px;
}
}
#business #item02 .box .pickup .txt1 {
font-weight: bold;
font-size: 22px;
line-height: 1.6;
color: #3198d0;
text-align: center;
z-index: 100;
position: relative;
}
@media (max-width: 1000px) {
#business #item02 .box .pickup .txt1 {
font-size: 32px;
}
}
#business #item02 .box .pickup .ul_balloon {
width: 780px;
margin: 0 auto 40px;
position: relative;
z-index: 10;
}
@media (max-width: 1000px) {
#business #item02 .box .pickup .ul_balloon {
width: auto;
}
}
#business #item02 .box .pickup .ul_balloon > li:nth-child(2) {
position: absolute;
right: 0;
top: 0;
}
@media (max-width: 1000px) {
#business #item02 .box .pickup .ul_balloon > li:nth-child(2) {
position: static;
text-align: right;
}
}
#business #item02 .box .pickup .conv {
text-align: center;
font-weight: 700;
font-size: 26px;
color: #3198d0;
line-height: 1.4;
}
@media (max-width: 1000px) {
#business #item02 .box .pickup .conv {
font-size: 33px;
}
}
#business #item02 .box .pickup .conv strong {
display: block;
font-size: 38px;
}
@media (max-width: 1000px) {
#business #item02 .box .pickup .conv strong {
font-size: 37px;
}
}
#business #item03 .box {
background: #E8E8E8;
-webkit-box-sizing: border-box;
box-sizing: border-box;
padding: 48px;
margin-bottom: 96px;
}
#business #item03 .box .tit {
text-align: center;
font-size: 20px;
margin-bottom: 40px;
}
@media (max-width: 1000px) {
#business #item03 .box .tit {
font-size: 30px;
position: relative;
line-height: 1;
}
}
#business #item03 .box .tit:before {
content: "";
display: inline-block;
vertical-align: middle;
width: 61px;
height: 72px;
background: url(/site/img/business/feat2_h_obj1.svg) center center no-repeat;
background-size: contain;
margin-right: 8px;
}
@media (max-width: 1000px) {
#business #item03 .box .tit:before {
margin-right: 0;
position: absolute;
top: 12px;
left: -30px;
}
}
#business #item03 .box .tit:after {
content: "";
display: inline-block;
vertical-align: middle;
width: 61px;
height: 72px;
background: url(/site/img/business/feat2_h_obj2.svg) center center no-repeat;
background-size: contain;
margin-left: 8px;
}
@media (max-width: 1000px) {
#business #item03 .box .tit:after {
position: absolute;
top: 12px;
}
}
#business #item03 .box .tit span {
font-size: 27px;
}
@media (max-width: 1000px) {
#business #item03 .box .tit span {
font-size: 42px;
line-height: 1;
}
}
#business #item03 .box ul.ul_feat {
display: -webkit-inline-box;
display: -webkit-inline-flex;
display: -ms-inline-flexbox;
display: inline-flex;
-webkit-flex-wrap: wrap-reverse;
-ms-flex-wrap: wrap-reverse;
flex-wrap: wrap-reverse;
-webkit-box-orient: horizontal;
-webkit-box-direction: normal;
-webkit-flex-direction: row;
-ms-flex-direction: row;
flex-direction: row;
-webkit-box-pack: justify;
-webkit-justify-content: space-between;
-ms-flex-pack: justify;
justify-content: space-between;
}
#business #item03 .box ul.ul_feat > li {
width: 30%;
display: inline-block;
margin-bottom: 16px;
}
@media (max-width: 1000px) {
#business #item03 .box ul.ul_feat > li {
width: auto;
display: block;
}
}
#business #item03 .box ul.ul_feat > li > dl > dt {
color: #3198d0;
font-size: 28px;
line-height: 1;
margin-bottom: 4px;
}
@media (max-width: 1000px) {
#business #item03 .box ul.ul_feat > li > dl > dt {
font-size: 38px;
}
}
#business #item03 .box ul.ul_feat > li > dl > dd {
font-size: 18px;
line-height: 1.8;
margin-bottom: 16px;
}
@media (max-width: 1000px) {
#business #item03 .box ul.ul_feat > li > dl > dd {
font-size: 24px;
margin-bottom: 24px;
}
}
#business #item03 .box ul.ul_feat > li > dl > dd .att {
font-size: 15px;
font-weight: normal;
padding-left: 1em;
text-indent: -1em;
}
@media (max-width: 1000px) {
#business #item03 .box ul.ul_feat > li > dl > dd .att {
font-size: 20px;
}
} #flow #eyecatch .eyebox {
background-image: url(/site/img/flow/main.jpg);
}
#flow .sec {
margin-bottom: 0;
}
#flow .ol_anker {
text-align: center;
letter-spacing: -.4em;
}
#flow .ol_anker > li {
display: inline-block;
vertical-align: top;
margin-left: -28px;
position: relative;
}
@media (max-width: 1000px) {
#flow .ol_anker > li {
margin-left: -20px;
}
}
#flow .ol_anker > li a:hover {
opacity: 1;
}
#flow .ol_anker > li:after {
content: "";
display: inline-block;
vertical-align: middle;
width: 58px;
height: 26px;
background: url(/site/img/flow/anker_icn_arr1.svg) center center no-repeat;
background-size: contain;
position: absolute;
right: -16px;
bottom: 66px;
}
@media (max-width: 1000px) {
#flow .ol_anker > li:after {
width: 36px;
height: 18px;
bottom: 44px;
right: -8px;
-webkit-transform: translateX(0%);
-ms-transform: translateX(0%);
transform: translateX(0%);
}
}
#flow .ol_anker > li:first-child {
margin-left: 0;
}
#flow .ol_anker > li:last-child:after {
display: none;
}
#flow .ol_flow {
position: relative;
}
#flow .ol_flow > li {
position: relative;
}
@media (max-width: 1000px) {
#flow .ol_flow > li {
padding: 56px 0;
}
}
#flow .ol_flow > li:first-child {
padding: 56px 0 30px;
}
@media (max-width: 1000px) {
#flow .ol_flow > li:first-child {
padding: 72px 0 48px;
}
}
@media (max-width: 1000px) {
#flow .ol_flow > li:first-child .wrap {
padding-top: 64px;
}
}
#flow .ol_flow > li:first-child .wrap:after {
content: "";
display: inline-block;
vertical-align: middle;
width: 130px;
height: 26px;
background: url(/site/img/flow/ol_obj_start.svg) center center no-repeat;
background-size: contain;
position: absolute;
left: 116px;
top: -8px;
z-index: 500;
}
@media (max-width: 1000px) {
#flow .ol_flow > li:first-child .wrap:after {
top: -8px;
left: 50%;
-webkit-transform: translateX(-50%);
-ms-transform: translateX(-50%);
transform: translateX(-50%);
width: 195px;
height: 38px;
}
}
#flow .ol_flow > li:last-child {
padding: 0 0 40px;
}
@media (max-width: 1000px) {
#flow .ol_flow > li:last-child {
padding-bottom: 80px;
}
}
@media (max-width: 1000px) {
#flow .ol_flow > li:last-child .wrap {
padding-bottom: 64px;
}
}
#flow .ol_flow > li:last-child .wrap:before {
display: none;
}
#flow .ol_flow > li:last-child .wrap:after {
content: "";
display: inline-block;
vertical-align: middle;
width: 130px;
height: 26px;
background: url(/site/img/flow/ol_obj_finish.svg) center center no-repeat;
background-size: contain;
position: absolute;
left: 116px;
bottom: -8px;
}
@media (max-width: 1000px) {
#flow .ol_flow > li:last-child .wrap:after {
left: 50%;
-webkit-transform: translateX(-50%);
-ms-transform: translateX(-50%);
transform: translateX(-50%);
width: 195px;
height: 38px;
}
}
#flow .ol_flow > li:nth-child(odd) {
background: #E8E8E8;
}
#flow .ol_flow > li .wrap {
padding: 16px 0;
min-height: 256px;
position: relative;
}
#flow .ol_flow > li .wrap:before {
content: "";
display: inline-block;
vertical-align: middle;
width: 30px;
height: 60px;
background: url(/site/img/flow/ol_arr1.svg) center center no-repeat;
background-size: contain;
position: absolute;
left: 80px;
bottom: -16px;
z-index: 100;
}
@media (max-width: 1000px) {
#flow .ol_flow > li .wrap:before {
bottom: -88px;
left: 50%;
-webkit-transform: translateX(-50%);
-ms-transform: translateX(-50%);
transform: translateX(-50%);
}
}
#flow .ol_flow > li .tit {
position: absolute;
left: 0;
top: 50%;
-webkit-transform: translateY(-50%);
-ms-transform: translateY(-50%);
transform: translateY(-50%);
}
@media (max-width: 1000px) {
#flow .ol_flow > li .tit {
-webkit-transform: translateX(0%);
-ms-transform: translateX(0%);
transform: translateX(0%);
position: static;
text-align: center;
margin: 0 auto 16px;
}
}
#flow .ol_flow > li .txt_gr {
padding-left: 410px;
}
@media (max-width: 1000px) {
#flow .ol_flow > li .txt_gr {
padding-left: 0;
}
}
#flow .ol_flow > li .txt_gr p.subtit,
#flow .ol_flow > li .txt_gr p.subtit b,
#flow .ol_flow > li .txt_gr > .subtit {
font-weight: bold;
font-weight: 700;
font-size: 22px;
line-height: 1.4;
margin-bottom: 4px;
}
@media (max-width: 1000px) {
#flow .ol_flow > li .txt_gr p.subtit,
#flow .ol_flow > li .txt_gr p.subtit b,
#flow .ol_flow > li .txt_gr > .subtit {
font-size: 32px;
font-weight: bold;
font-weight: 700;
text-align: center;
display: block;
margin-bottom: 16px;
}
}
#flow .ol_flow > li .txt_gr .txt_tel {
font-weight: bold;
font-weight: 900;
color: #1DA939;
font-size: 26px;
line-height: 1;
margin: 8px 0 8px 40px;
}
@media (max-width: 1000px) {
#flow .ol_flow > li .txt_gr .txt_tel {
margin: 32px auto 16px;
font-size: 37px;
text-align: center;
}
}
#flow .ol_flow > li .txt_gr .txt_tel b {
font-size: 38px;
}
@media (max-width: 1000px) {
#flow .ol_flow > li .txt_gr .txt_tel b {
font-size: 54px;
}
}
#flow .ol_flow > li .txt_gr p {
font-size: 16px;
line-height: 1.8;
}
@media (max-width: 1000px) {
#flow .ol_flow > li .txt_gr p {
font-size: 24px;
line-height: 1.6;
}
}
#flow .ol_flow > li .txt_gr .btn_area {
margin: 12px 0;
}
@media (max-width: 1000px) {
#flow .ol_flow > li .txt_gr .btn_area {
text-align: center;
}
}
#flow .ol_flow > li .txt_gr a.btn_det {
font-weight: bold;
font-weight: 700;
font-size: 19px;
line-height: 1;
position: relative;
background: #fff;
padding: 22px 64px 22px 32px;
border: 1px solid #1DA939;
border-radius: 12px;
-webkit-box-sizing: border-box;
box-sizing: border-box;
display: inline-block;
z-index: 100;
}
@media (max-width: 1000px) {
#flow .ol_flow > li .txt_gr a.btn_det {
min-width: 80%;
font-size: 24px;
line-height: 1.2;
text-align: center;
}
}
#flow .ol_flow > li .txt_gr a.btn_det:after {
content: "";
display: inline-block;
vertical-align: middle;
width: 25px;
height: 25px;
background: url(/site/img/common/btn_arr.svg) center center no-repeat;
background-size: contain;
position: absolute;
right: 24px;
top: 50%;
-webkit-transform: translateY(-50%); -ms-transform: translateY(-50%);
transform: translateY(-50%);
}
#flow .ol_flow > li .txt_gr a.btn_det:hover {
opacity: 1;
color: #FF8200;
-webkit-transition: 0.3s;
-o-transition: 0.3s;
transition: 0.3s;
}
#flow .ol_flow > li .txt_gr a.btn_det:hover:after {
-webkit-transition: 0.3s;
-o-transition: 0.3s;
transition: 0.3s;
right: 20px;
}
#flow .ol_flow > li#flow3 .txt_gr {
padding-top: 40px;
}
#flow .ol_flow > li#flow4 {
padding: 24px 0 16px;
}
#flow .ol_flow > li#flow5 .txt_gr {
padding-top: 40px;
} #service #eyecatch .eyebox {
background-image: url(/site/img/service/main.jpg);
}
#service .sec table.table_std1 {
width: 940px;
margin: 0 auto;
border: 1px solid #8D8D8D;
background: #fff;
}
@media (max-width: 1000px) {
#service .sec table.table_std1 {
width: 100%;
}
}
#service .sec table.table_std1 tr th, #service .sec table.table_std1 tr td {
padding: 6px 4px;
font-size: 18px;
font-weight: bold;
font-weight: 700;
text-align: center;
}
#service .sec table.table_std1 tr th span.red, #service .sec table.table_std1 tr td span.red {
color: #FF0000;
}
@media (max-width: 1000px) {
#service .sec table.table_std1 tr th, #service .sec table.table_std1 tr td {
font-size: 22px;
padding: 6px 4px;
}
}
#service .sec table.table_std1 tr th:first-child,
#service .sec table.table_std1 tr td:first-child {
background: #E9FFFF;
}
#service .sec table.table_std1 thead tr th, #service .sec table.table_std1 thead tr td {
color: #3198d0;
border-right: 1px solid #8D8D8D;
border-bottom: 1px solid #8D8D8D;
}
#service .sec table.table_std1 tbody tr th:first-child,
#service .sec table.table_std1 tbody tr td:first-child {
color: #3198d0;
}
#service .sec table.table_std1 tbody tr th, #service .sec table.table_std1 tbody tr td {
border-right: 1px solid #8D8D8D;
}
#service .sec_mgs .mgs_point {
margin-bottom: 64px;
}
#service .sec_mgs .mgs_point div.lo:nth-child(even) .txt_gr {
margin-left: 0px;
}
@media (max-width: 1000px) {
#service .sec_mgs .mgs_point div.lo:nth-child(even) .txt_gr .tit {
text-align: left;
}
}
#service .sec_mgs .mgs_point .lo {
position: relative;
margin-bottom: 24px;
}
#service .sec_mgs .mgs_point .lo .txt_gr {
width: 500px;
padding: 24px;
-webkit-box-sizing: border-box;
box-sizing: border-box;
margin-left: 460px;
}
@media (max-width: 1000px) {
#service .sec_mgs .mgs_point .lo .txt_gr {
width: auto;
margin-left: 0px;
}
}
#service .sec_mgs .mgs_point .lo .txt_gr > .tit {
color: #3198d0;
font-size: 28px;
letter-spacing: .08em;
}
@media (max-width: 1000px) {
#service .sec_mgs .mgs_point .lo .txt_gr > .tit {
text-align: right;
}
}
#service .sec_mgs .mgs_point .lo .txt_gr > .tit span {
font-size: 44px;
}
#service .sec_mgs .mgs_point .lo .txt_gr p {
font-size: 16px;
line-height: 1.8;
letter-spacing: .15em;
}
@media (max-width: 1000px) {
#service .sec_mgs .mgs_point .lo .txt_gr p {
font-size: 24px;
line-height: 1.6;
}
}
#service .sec_mgs .mgs_point .lo1 {
min-height: 340px;
background: url(/site/img/service/mgs_bg1.png) 0 center no-repeat;
}
@media (max-width: 1000px) {
#service .sec_mgs .mgs_point .lo1 {
background: url(/site/img/service/mgs_bg1.png) center 0 no-repeat;
overflow: hidden;
}
}
@media (max-width: 1000px) {
#service .sec_mgs .mgs_point .lo1 .txt_gr {
width: auto;
margin-top: 340px;
}
}
#service .sec_mgs .mgs_point .lo2 {
min-height: 340px;
background: url(/site/img/service/mgs_bg2.png) right center no-repeat;
}
@media (max-width: 1000px) {
#service .sec_mgs .mgs_point .lo2 {
background: url(/site/img/service/mgs_bg2.png) center 0 no-repeat;
overflow: hidden;
}
}
#service .sec_mgs .mgs_point .lo2 .txt_gr {
width: 490px;
}
@media (max-width: 1000px) {
#service .sec_mgs .mgs_point .lo2 .txt_gr {
width: auto;
margin-top: 340px;
}
}
#service .sec_mgs .mgs_point .lo3 {
min-height: 340px;
background: url(/site/img/service/mgs_bg3.png) 0 center no-repeat;
}
@media (max-width: 1000px) {
#service .sec_mgs .mgs_point .lo3 {
background: url(/site/img/service/mgs_bg3.png) center 0 no-repeat;
overflow: hidden;
}
}
#service .sec_mgs .mgs_point .lo3 .txt_gr {
width: 520px;
}
@media (max-width: 1000px) {
#service .sec_mgs .mgs_point .lo3 .txt_gr {
width: auto;
margin-top: 340px;
}
}
#service .sec_mgs .conv {
text-align: center;
position: relative;
margin: 40px auto 64px;
}
#service .sec_mgs .conv:before {
content: "";
display: inline-block;
vertical-align: middle;
width: 814px;
height: 158px;
background: url(/site/img/service/conv_bg1.svg) center center no-repeat;
background-size: contain;
position: absolute;
top: -20px;
left: 50%;
-webkit-transform: translateX(-50%);
-ms-transform: translateX(-50%);
transform: translateX(-50%);
z-index: -1;
}
@media (max-width: 1000px) {
#service .sec_mgs .conv:before {
width: 580px;
height: 158px;
background: url(/site/img_sp/service/conv_bg1.svg) center center no-repeat;
background-size: contain;
top: 20px;
}
}
#service .sec_mgs .conv > .tit {
font-size: 32px;
line-height: 1.4;
color: #3198d0;
margin-bottom: 8px;
}
#service .sec_mgs .conv > .tit span.ca {
letter-spacing: -.4em;
}
#service .sec_mgs .conv > .desc {
font-weight: bold;
font-size: 22px;
line-height: 1.4;
}
@media (max-width: 1000px) {
#service .sec_mgs .conv > .desc {
font-size: 26px;
line-height: 1.9;
}
}
#service .area_two {
background: #E8E8E8;
padding: 32px 0;
}
@media (max-width: 1000px) {
#service .area_two {
padding: 32px 30px;
}
}
#service .sec_merit {
margin-bottom: 40px;
}
#service .sec_merit table.table1 {
margin-bottom: 32px;
}
@media (max-width: 1000px) {
#service .sec_merit table.table1 {
margin-bottom: 8px;
}
}
@media (max-width: 1000px) {
#service .sec_merit table.table1 thead tr th, #service .sec_merit table.table1 thead tr td {
font-size: 18px;
}
}
@media (max-width: 1000px) {
#service .sec_merit table.table1 tbody tr th:first-child,
#service .sec_merit table.table1 tbody tr td:first-child {
min-width: 5em !important;
line-height: 1.4;
}
}
@media (max-width: 1000px) {
#service .sec_merit table.table1 tbody tr th, #service .sec_merit table.table1 tbody tr td {
width: auto;
font-size: 17px;
letter-spacing: -.08em;
}
}
#service .sec_merit table.table1 + .att {
text-align: center;
font-size: 14px;
line-height: 1.8;
margin: -24px auto 16px;
}
#service .sec_merit .conv {
text-align: center;
padding: 24px 0;
}
#service .sec_merit .conv p {
font-size: 22px;
font-weight: bold;
line-height: 1.6;
}
@media (max-width: 1000px) {
#service .sec_merit .conv p {
font-size: 24px;
}
}
#service .sec_notes .txt_blk {
width: 940px;
margin: 0 auto;
font-size: 16px;
margin-bottom: 24px;
line-height: 1.9;
}
@media (max-width: 1000px) {
#service .sec_notes .txt_blk {
width: auto;
font-size: 24px;
}
}
#service .sec_notes .txt_blk > ul {
margin-bottom: 1em;
}
#service .sec_notes .txt_blk > p {
margin-bottom: 1em;
}
#service .sec_notes .txt_blk > p:last-child {
margin-bottom: 0;
}
#service .sec_notes table.table_std1 {
width: 560px;
margin: 0 auto 24px;
}
@media (max-width: 1000px) {
#service .sec_notes table.table_std1 {
width: 100%;
}
}
#service .sec_notes table.table_std1 tr th:first-child,
#service .sec_notes table.table_std1 tr td:first-child {
width: 264px;
}
@media (max-width: 1000px) {
#service .sec_notes table.table_std1 tr th:first-child,
#service .sec_notes table.table_std1 tr td:first-child {
width: 50%;
}
}
#service .sec_efforts .box {
width: 940px;
margin: 56px auto 98px;
border: 5px solid #999;
border-radius: 16px;
-webkit-box-sizing: border-box;
box-sizing: border-box;
padding: 40px;
position: relative;
}
@media (max-width: 1000px) {
#service .sec_efforts .box {
width: auto;
padding: 30px;
margin: 56px 30px 98px;
}
}
#service .sec_efforts .box > .title {
font-size: 26px;
padding: 16px 76px 16px 40px;
position: absolute;
left: -5px;
top: -59.5px;
}
#service .sec_efforts .box .lo {
position: relative;
}
#service .sec_efforts .box .lo > .tmb_gr {
position: absolute;
left: 0;
top: 0;
}
@media (max-width: 1000px) {
#service .sec_efforts .box .lo > .tmb_gr {
position: static;
text-align: center;
margin-bottom: 16px;
}
}
#service .sec_efforts .box .lo > .txt_gr {
margin-left: 270px;
margin-bottom: 64px;
}
@media (max-width: 1000px) {
#service .sec_efforts .box .lo > .txt_gr {
margin: 0;
}
}
#service .sec_efforts .box .lo > .txt_gr .ul_date {
min-height: 246px;
}
#service .sec_efforts .box .lo > .txt_gr .ul_date > li {
font-size: 18px;
line-height: 1.8;
}
@media (max-width: 1000px) {
#service .sec_efforts .box .lo > .txt_gr .ul_date > li {
font-size: 24px;
}
}
#service .sec_efforts .box .lo > .txt_gr .ul_date > li.name {
margin-top: 12px;
}
#service .sec_efforts .box .lo > .txt_gr .ul_date > li.name:first-child {
margin-top: 0;
}
#service .sec_efforts .box .lo > .txt_gr .ul_date > li > dl > dt, #service .sec_efforts .box .lo > .txt_gr .ul_date > li > dl > dd {
display: inline-block;
vertical-align: top;
}
#service .sec_efforts .box .lo > .txt_gr .ul_date > li > dl > dt {
width: 5em;
}
#service .sec_efforts .box .lo > .txt_gr .ul_date > li > dl > dd {
width: 480px;
}
@media (max-width: 1000px) {
#service .sec_efforts .box .lo > .txt_gr .ul_date > li > dl > dd {
width: 460px;
}
}
#service .sec_efforts .box1 {
border-color: #3198D0;
margin-top: 98px;
}
#service .sec_efforts .box1:before {
content: "";
display: inline-block;
vertical-align: middle;
width: 162px;
height: 200px;
background: url(/site/img/service/eff_box_obj1.svg) center center no-repeat;
background-size: contain;
position: absolute;
right: 26px;
top: -204px;
}
@media (max-width: 1000px) {
#service .sec_efforts .box1:before {
right: -12px;
}
}
#service .sec_efforts .box1 > .title {
color: #3198D0;
background: url(/site/img/service/eff_box_bg1.svg) 0 0 no-repeat;
}
#service .sec_efforts .box1 .lo > .txt_gr .ul_date > li > dl > dt {
color: #3198D0;
}
#service .sec_efforts .box2 {
border-color: #1EA939;
margin-bottom: 16px;
}
#service .sec_efforts .box2 > .title {
color: #1EA939;
background: url(/site/img/service/eff_box_bg2.svg) 0 0 no-repeat;
}
#service .sec_efforts .box2 .lo > .txt_gr .ul_date > li > dl > dt {
color: #1EA939;
}
@media (max-width: 1000px) {
#service .sec_efforts .box2 .lo1 {
margin-bottom: 40px;
}
} #method #eyecatch .eyebox {
background-image: url(/site/img/method/main.jpg);
}
.sec_method1 .box_move {
margin-bottom: 80px;
text-align: center;
}
@media (max-width: 1000px) {
.sec_method1 .box_move {
margin: 0 30px;
}
}
.sec_method1 .box_move .move {
margin: 16px auto;
text-align: center;
}
.sec_method1 .box_move .move2 {
display: inline-block;
width: 640px;
margin: 16px auto;
text-align: center;
background: #3B2F2B;
padding: 40px;
border-radius: 24px;
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
.sec_method1 .box_move .move2 iframe {
width: 100%;
}
@media (max-width: 1000px) {
.sec_method1 .box_move .move2 {
width: 100%;
}
}
.sec_method1 .box_move .move2 ul.date {
color: #fff;
font-size: 24px;
line-height: 1.4;
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: justify;
-webkit-justify-content: space-between;
-ms-flex-pack: justify;
justify-content: space-between;
}
.sec_method1 .box_move .move2 ul.date .cap {
font-size: 24px;
}
.sec_method1 .box_move .move2 ul.date .time {
text-align: right;
}
.sec_method1 .box_move .cap {
font-size: 16px;
text-align: center;
}
@media (max-width: 1000px) {
.sec_method1 .box_move .cap {
font-size: 24px;
line-height: 1.8;
}
}
.sec_method1 .ol_methos1 {
text-align: center;
letter-spacing: -.4em;
margin: 32px -20px 80px;
}
.sec_method1 .ol_methos1 > li {
width: 200px;
font-size: 29px;
font-family: "tbudrgothic-std", "Hiragino Maru Gothic StdN", "ヒラギノ丸ゴ Pro", "Hiragino Maru Gothic Pro", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "HG丸ｺﾞｼｯｸM-PRO", "HGMaruGothicMPRO";
font-weight: 700;
color: #1ea939;
display: inline-block;
vertical-align: top;
border-radius: 12px;
border: 5px solid #1ea939;
-webkit-box-sizing: border-box;
box-sizing: border-box;
letter-spacing: normal;
line-height: 72px;
margin: 0 20px;
position: relative;
}
@media (max-width: 1000px) {
.sec_method1 .ol_methos1 > li {
width: 80px;
height: 200px;
-webkit-writing-mode: vertical-rl;
-ms-writing-mode: tb-rl;
writing-mode: vertical-rl;
}
}
.sec_method1 .ol_methos1 > li:after {
content: "";
display: inline-block;
vertical-align: middle;
width: 16px;
height: 34px;
background: url(/site/img/method/ol_arr1.svg) center center no-repeat;
background-size: contain;
position: absolute;
right: -34px;
top: 50%;
-webkit-transform: translateY(-50%);
-ms-transform: translateY(-50%);
transform: translateY(-50%);
z-index: 100;
}
.sec_method1 .ol_methos1 > li:last-child:after {
display: none;
}
.sec_method1 .ol_methos1 > li:nth-child(1):before {
content: "";
display: inline-block;
vertical-align: middle;
width: 76px;
height: 90px;
background: url(/site/img/method/ol_li1_obj.svg) center center no-repeat;
background-size: contain;
position: absolute;
right: -8px;
top: -24px;
z-index: 100;
}
@media (max-width: 1000px) {
.sec_method1 .ol_methos1 > li:nth-child(1):before {
top: auto;
right: -50px;
bottom: -50px;
}
}
.sec_method1 .ol_methos1 > li:nth-child(2):before {
content: "";
display: inline-block;
vertical-align: middle;
width: 192px;
height: 118px;
background: url(/site/img/method/ol_li2_obj.svg) center center no-repeat;
background-size: contain;
position: absolute;
right: 0px;
top: -32px;
z-index: 100;
}
@media (max-width: 1000px) {
.sec_method1 .ol_methos1 > li:nth-child(2):before {
width: 138px;
height: 168px;
background: url(/site/img_sp/method/ol_li2_obj.svg) center center no-repeat;
background-size: contain;
right: -40px;
top: -32px;
}
}
.sec_method1 .ol_methos1 > li:nth-child(4):before {
content: "";
display: inline-block;
vertical-align: middle;
width: 62px;
height: 72px;
background: url(/site/img/method/ol_li4_obj.svg) center center no-repeat;
background-size: contain;
position: absolute;
right: -34px;
top: -16px;
z-index: 100;
}
.sec_method1 .det_gr .flow_desc {
padding: 32px 0 48px;
}
.sec_method1 .det_gr .flow_desc:nth-child(odd) {
background: #e3f4e6;
}
.sec_method1 .det_gr .flow_desc:last-child:after {
display: none;
}
.sec_method1 .det_gr .flow_desc:last-child .wrap:after {
display: none;
}
.sec_method1 .det_gr .flow_desc .wrap {
position: relative;
}
.sec_method1 .det_gr .flow_desc .wrap:after {
content: "";
display: inline-block;
vertical-align: middle;
width: 30px;
height: 60px;
background: url(/site/img/method/flow_arr_ol1.svg) center center no-repeat;
background-size: contain;
position: absolute;
bottom: -80px;
left: 190px;
z-index: 100;
}
@media (max-width: 1000px) {
.sec_method1 .det_gr .flow_desc .wrap:after {
left: 50%;
-webkit-transform: translateX(-50%);
-ms-transform: translateX(-50%);
transform: translateX(-50%);
}
}
.sec_method1 .det_gr .flow_desc .wrap > .tit {
display: inline-block;
font-size: 29px;
color: #1ea939;
position: relative;
}
@media (max-width: 1000px) {
.sec_method1 .det_gr .flow_desc .wrap > .tit {
text-align: center;
}
}
.sec_method1 .det_gr .flow_desc .lo_std1 {
display: table;
}
@media (max-width: 1000px) {
.sec_method1 .det_gr .flow_desc .lo_std1 {
display: block;
}
}
.sec_method1 .det_gr .flow_desc .lo_std1 > .lo1_tmb,
.sec_method1 .det_gr .flow_desc .lo_std1 > .lo1_txt {
display: table-cell;
vertical-align: middle;
font-size: 18px;
}
@media (max-width: 1000px) {
.sec_method1 .det_gr .flow_desc .lo_std1 > .lo1_tmb,
.sec_method1 .det_gr .flow_desc .lo_std1 > .lo1_txt {
display: block;
font-size: 24px;
margin-bottom: 16px;
}
}
.sec_method1 .det_gr .flow_desc .lo_std1 > .lo1_tmb {
padding-right: 32px;
}
@media (max-width: 1000px) {
.sec_method1 .det_gr .flow_desc .lo_std1 > .lo1_tmb {
padding-right: 0;
text-align: center;
margin: 0 auto 16px;
}
}
.sec_method1 .det_gr .flow_desc .lo_std1 > .lo1_tmb img.img_d1 {
border: 5px solid #1ea939;
border-radius: 14px;
}
.sec_method1 .det_gr .flow_desc .lo_std1 > .lo1_txt ul.ul_box {
letter-spacing: -.4em;
text-align: center;
margin: 16px auto 0;
}
.sec_method1 .det_gr .flow_desc .lo_std1 > .lo1_txt ul.ul_box > li {
width: 48%;
background: #fff;
display: inline-block;
vertical-align: top;
border-radius: 10px;
-webkit-box-sizing: border-box;
box-sizing: border-box;
letter-spacing: normal;
text-align: left;
padding: 16px;
}
.sec_method1 .det_gr .flow_desc .lo_std1 > .lo1_txt ul.ul_box > li:nth-child(even) {
margin-left: 4%;
}
@media (max-width: 1000px) {
.sec_method1 .det_gr .flow_desc .lo_std1 > .lo1_txt ul.ul_box > li {
padding: 16px;
}
}
.sec_method1 .det_gr .flow_desc .lo_std1 > .lo1_txt ul.ul_box > li h4 {
font-size: 21px;
color: #1ea939;
}
@media (max-width: 1000px) {
.sec_method1 .det_gr .flow_desc .lo_std1 > .lo1_txt ul.ul_box > li h4 {
font-size: 28px;
}
}
.sec_method1 .det_gr .flow_desc .lo_std1 > .lo1_txt ul.ul_box > li p {
font-size: 18px;
}
@media (max-width: 1000px) {
.sec_method1 .det_gr .flow_desc .lo_std1 > .lo1_txt ul.ul_box > li p {
font-size: 24px;
}
}
.sec_method1 .det_gr #flow_desc02 .wrap > .tit:after {
content: "";
display: inline-block;
vertical-align: middle;
width: 112px;
height: 106px;
background: url(/site/img/method/ol1_desc_obj1.svg) center center no-repeat;
background-size: contain;
position: absolute;
top: -16px;
right: -112px;
z-index: 100;
}
.sec_method1 .det_gr #flow_desc04 .wrap > .tit:after {
content: "";
display: inline-block;
vertical-align: middle;
width: 62px;
height: 74px;
background: url(/site/img/method/ol3_desc_obj1.svg) center center no-repeat;
background-size: contain;
position: absolute;
top: -16px;
right: -94px;
z-index: 100;
}
.sec_method1 .det_gr #flow_desc05 {
padding-bottom: 0;
}
.sec_method1 .box_supp {
background: #e3f4e6;
padding: 16px 44px;
margin-top: 48px;
}
@media (max-width: 1000px) {
.sec_method1 .box_supp {
padding: 16px 30px;
margin: 48px -30px 0;
}
}
.sec_method1 .box_supp .tit {
text-align: center;
font-size: 20px;
padding: 24px 0;
}
@media (max-width: 1000px) {
.sec_method1 .box_supp .tit {
font-size: 24px;
}
}
.sec_method1 .box_supp .tit span {
font-size: 27px;
}
@media (max-width: 1000px) {
.sec_method1 .box_supp .tit span {
font-size: 33px;
}
}
.sec_method1 .box_supp .tit span:before {
content: "";
display: inline-block;
vertical-align: middle;
width: 51px;
height: 48px;
background: url(/site/img/method/supp_h_obj1.svg) center center no-repeat;
background-size: contain;
margin-right: 8px;
}
.sec_method1 .box_supp .tit span:after {
content: "";
display: inline-block;
vertical-align: middle;
width: 51px;
height: 48px;
background: url(/site/img/method/supp_h_obj2.svg) center center no-repeat;
background-size: contain;
margin-left: 8px;
}
.sec_method1 .box_supp .btn_area {
margin: 40px auto;
text-align: center;
}
.sec_method1 .box_supp a.btn {
width: 600px;
background: #1ea939;
border-radius: 8px;
padding: 1em;
font-size: 23px;
font-weight: bold;
font-weight: 700;
display: inline-block;
vertical-align: top;
text-align: center;
color: #fff;
}
@media (max-width: 1000px) {
.sec_method1 .box_supp a.btn {
width: 80%;
}
}
.sec_method1 .box_supp a.btn:hover {
opacity: 1;
background: #FF8200;
-webkit-transition: 0.3s;
-o-transition: 0.3s;
transition: 0.3s;
}
.sec_method1 .box_supp a.btn:after {
content: "";
display: inline-block;
vertical-align: middle;
width: 44px;
height: 15px;
background: url(/site/img/method/supp_btn_arr1.svg) center center no-repeat;
background-size: contain;
margin-left: 12px;
margin-bottom: 4px;
}
.sec_method2 .hd_std1 .desc {
bottom: -32px;
}
.sec_method2 .img_gr {
margin: 32px auto;
text-align: center;
}
.sec_method3 {
padding: 40px 0;
background: #e8e8e8;
margin-bottom: 0;
}
.sec_method3 .desc {
margin: 8px auto 16px;
}
.sec_method3 .desc p {
font-size: 16px;
line-height: 1.9;
}
@media (max-width: 1000px) {
.sec_method3 .desc p {
font-size: 24px;
line-height: 1.6;
}
}
@media (max-width: 1000px) {
.sec_method3 .desc {
margin: 24px auto 16px;
}
}
.sec_method3 .ul_doc {
letter-spacing: -.4em;
margin: 0 -8px;
}
@media (max-width: 1000px) {
.sec_method3 .ul_doc {
margin: 0;
}
}
.sec_method3 .ul_doc > li {
display: inline-block;
vertical-align: top;
letter-spacing: normal;
margin: 8px;
}
@media (max-width: 1000px) {
.sec_method3 .ul_doc > li {
width: 30%;
margin: 16px 1.6%;
}
}
.sec_method3 .ssec_process .flow_process {
padding-top: 24px;
}
.sec_method3 .ssec_process > .one .tit {
color: #3198d0;
font-size: 32px;
text-align: center;
margin-bottom: 4px;
}
@media (max-width: 1000px) {
.sec_method3 .ssec_process > .one .tit {
font-size: 29px;
}
}
.sec_method3 .ssec_process > .one .desc {
font-size: 22px;
text-align: center;
line-height: 1.4;
}
@media (max-width: 1000px) {
.sec_method3 .ssec_process > .one .desc {
font-size: 24px;
}
}
.sec_method3 .ssec_process > .two .tit_icn:before {
width: 100px;
height: 100px;
background: url(/site/img/method/pross_icn1.svg) center center no-repeat;
background-size: contain;
}
@media (max-width: 1000px) {
.sec_method3 .ssec_process > .two .tit_icn:before {
width: 164px;
height: 164px;
}
}
.sec_method3 .ssec_process > .three .tit_icn:before {
width: 56px;
height: 82px;
background: url(/site/img/method/pross_icn2.svg) center center no-repeat;
background-size: contain;
}
@media (max-width: 1000px) {
.sec_method3 .ssec_process > .three .tit_icn:before {
width: 90px;
height: 132px;
}
}
.sec_method3 .ssec_process > .four .tit_icn:before {
width: 46px;
height: 74px;
background: url(/site/img/method/pross_icn3.svg) center center no-repeat;
background-size: contain;
}
@media (max-width: 1000px) {
.sec_method3 .ssec_process > .four .tit_icn:before {
width: 74px;
height: 132px;
}
}
.sec_method3 .ssec_process > .four .att {
font-size: 18px;
text-align: center;
line-height: 1.4;
}
@media (max-width: 1000px) {
.sec_method3 .ssec_process > .four .att {
font-size: 30px;
text-align: left;
}
}
.sec_method3 .ssec_process > .five {
margin-bottom: 40px;
}
.sec_method3 .ssec_process > .five .heading > .tit {
font-size: 32px;
color: #3198d0;
text-align: center;
line-height: 1.4;
}
@media (max-width: 1000px) {
.sec_method3 .ssec_process > .five .heading > .tit {
font-size: 50px;
line-height: 1.2;
}
}
.sec_method3 .ssec_process > .five .heading > .desc {
font-size: 22px;
text-align: center;
}
@media (max-width: 1000px) {
.sec_method3 .ssec_process > .five .heading > .desc {
font-size: 36px;
}
}
.sec_method3 .flow_process {
position: relative;
margin-bottom: 80px;
}
.sec_method3 .flow_process:after {
content: "";
display: inline-block;
vertical-align: middle;
width: 30px;
height: 60px;
background: url(/site/img/method/pross_arr_ol.svg) center center no-repeat;
background-size: contain;
position: absolute;
bottom: -80px;
left: 50%;
-webkit-transform: translateX(-50%);
-ms-transform: translateX(-50%);
transform: translateX(-50%);
}
@media (max-width: 1000px) {
.sec_method3 .flow_process:after {
width: 32px;
height: 64px;
}
}
.sec_method3 .flow_process:last-child:after {
display: none;
}
.sec_method3 .flow_process .tit_icn {
font-size: 21px;
text-align: center;
color: #f65314;
padding: 16px 0 0;
margin-bottom: 4px;
}
@media (max-width: 1000px) {
.sec_method3 .flow_process .tit_icn {
font-size: 34px;
}
}
.sec_method3 .flow_process .tit_icn:before {
content: "";
display: block;
vertical-align: middle;
width: 100px;
height: 100px;
background: url(/site/img/method/pross_icn1.svg) center center no-repeat;
background-size: contain;
margin: 0 auto 8px;
}
.sec_method3 .flow_process .desc {
font-size: 18px;
font-weight: bold;
font-weight: 700;
text-align: center;
}
@media (max-width: 1000px) {
.sec_method3 .flow_process .desc {
font-size: 29px;
}
}
.sec_method3 .flow_process dl.dl_std1 {
margin: 24px auto;
}
.sec_method3 .flow_process dl.dl_std1 > dt {
text-align: center;
font-size: 29px;
font-weight: bold;
font-weight: 700;
color: #1ea939;
}
@media (max-width: 1000px) {
.sec_method3 .flow_process dl.dl_std1 > dt {
font-size: 47px;
}
}
.sec_method3 .flow_process dl.dl_std1 > dd .ol_std1 {
letter-spacing: -.4em;
text-align: center;
margin: 0 -8px;
}
.sec_method3 .flow_process dl.dl_std1 > dd .ol_std1 > li {
width: 248px;
border: 5px solid #1ea939;
border-radius: 10px;
background: #fff;
margin: 0 8px;
padding: 56px 16px 16px;
font-size: 18px;
text-align: left;
-webkit-box-sizing: border-box;
box-sizing: border-box;
display: inline-block;
vertical-align: top;
letter-spacing: normal;
position: relative;
}
@media (max-width: 1000px) {
.sec_method3 .flow_process dl.dl_std1 > dd .ol_std1 > li {
width: 100%;
display: block;
margin-bottom: 16px;
font-size: 24px;
}
}
.sec_method3 .flow_process dl.dl_std1 > dd .ol_std1 > li:before {
content: "";
display: inline-block;
vertical-align: middle;
width: 34px;
height: 34px;
background: url(/site/img/method/pross_ol_icn1.svg) center center no-repeat;
background-size: contain;
position: absolute;
top: 12px;
left: 50%;
-webkit-transform: translateX(-50%);
-ms-transform: translateX(-50%);
transform: translateX(-50%);
}
.sec_method3 .flow_process dl.dl_std1 > dd .ol_std1 > li:nth-child(2) {
width: 290px;
}
@media (max-width: 1000px) {
.sec_method3 .flow_process dl.dl_std1 > dd .ol_std1 > li:nth-child(2) {
width: 100%;
}
}
.sec_method3 .flow_process dl.dl_std1 > dd .ol_std1 > li:nth-child(2):before {
background: url(/site/img/method/pross_ol_icn2.svg) center center no-repeat;
background-size: contain;
}
.sec_method3 .flow_process dl.dl_std1 > dd .ol_std1 > li:nth-child(3):before {
background: url(/site/img/method/pross_ol_icn3.svg) center center no-repeat;
background-size: contain;
} #works #eyecatch .eyebox {
background-image: url(/site/img/works/main.jpg);
}
#works .sec_works1 .box {
width: 940px;
margin: 56px auto 98px;
border-radius: 16px;
-webkit-box-sizing: border-box;
box-sizing: border-box;
padding: 40px;
position: relative;
}
@media (max-width: 1000px) {
#works .sec_works1 .box {
width: auto;
padding: 30px;
margin: 56px 30px 98px;
}
}
#works .sec_works1 .box > .title {
width: 230px;
font-size: 26px;
padding: 16px 76px 16px 40px;
position: absolute;
left: -1px;
top: -54.5px;
}
@media (max-width: 1000px) {
#works .sec_works1 .box > .title {
font-size: 32px;
}
}
#works .sec_works1 .box p.desc {
font-size: 16px;
text-align: center;
}
@media (max-width: 1000px) {
#works .sec_works1 .box p.desc {
font-size: 20px;
}
}
#works .sec_works1 .box .ul_listbanda > li {
position: relative;
}
#works .sec_works1 .box .ul_listbanda > li .tit {
display: inline-block;
font-size: 22px;
position: absolute;
top: -40px;
left: 50%;
-webkit-transform: translateX(-50%);
-ms-transform: translateX(-50%);
transform: translateX(-50%);
}
@media (max-width: 1000px) {
#works .sec_works1 .box .ul_listbanda > li .tit {
font-size: 32px;
top: -50px;
}
}
#works .sec_works1 .box .ul_listbanda > li .tit:before {
content: "";
display: inline-block;
vertical-align: middle;
width: 150px;
height: 150px;
background: url(/site/img/works/case_h_bg1.svg) center center no-repeat;
background-size: contain;
position: absolute;
top: 50%;
left: 50%;
-webkit-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
}
#works .sec_works1 .box .ul_listbanda > li .ul_banda {
width: 700px;
min-height: 185px;
position: relative;
margin: 100px auto 132px;
}
@media (max-width: 1000px) {
#works .sec_works1 .box .ul_listbanda > li .ul_banda {
width: auto;
min-height: inherit;
}
}
#works .sec_works1 .box .ul_listbanda > li .ul_banda:before {
content: "";
display: inline-block;
vertical-align: middle;
width: 60px;
height: 30px;
background: url(/site/img/works/case_arr1.svg) center center no-repeat;
background-size: contain;
position: absolute;
top: 50%;
left: 50%;
-webkit-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
}
@media (max-width: 1000px) {
#works .sec_works1 .box .ul_listbanda > li .ul_banda:before {
width: 30px;
height: 37px;
background: url(/site/img_sp/works/case_arr1.svg) center center no-repeat;
background-size: contain;
}
}
#works .sec_works1 .box .ul_listbanda > li .ul_banda > li {
position: relative;
z-index: 10;
}
#works .sec_works1 .box .ul_listbanda > li .ul_banda > li figure {
z-index: 100;
position: relative;
}
#works .sec_works1 .box .ul_listbanda > li .ul_banda > li a {
display: block;
}
#works .sec_works1 .box .ul_listbanda > li .ul_banda > li a:hover {
opacity: 1;
}
#works .sec_works1 .box .ul_listbanda > li .ul_banda > li a:hover span {
-webkit-transition: .3s;
-o-transition: .3s;
transition: .3s;
background: #FF8200;
}
@media (max-width: 1000px) {
#works .sec_works1 .box .ul_listbanda > li .ul_banda > li {
width: 100%;
}
#works .sec_works1 .box .ul_listbanda > li .ul_banda > li img {
width: 100%;
}
}
#works .sec_works1 .box .ul_listbanda > li .ul_banda > li:nth-child(2) {
position: absolute;
right: 0;
top: 0;
}
@media (max-width: 1000px) {
#works .sec_works1 .box .ul_listbanda > li .ul_banda > li:nth-child(2) {
position: relative;
margin-top: 68px;
}
}
#works .sec_works1 .box .ul_listbanda > li .ul_banda > li img {
display: block;
}
#works .sec_works1 .box .ul_listbanda > li .ul_banda > li span {
display: block;
position: absolute;
left: 0px;
top: 0px;
padding: 0.6em 2em;
background: #999;
color: #fff;
font-weight: bold;
font-weight: 700;
line-height: 1;
}
#works .sec_works1 .box .ul_listbanda > li .ul_banda > li.before {
width: 300px;
}
@media (max-width: 1000px) {
#works .sec_works1 .box .ul_listbanda > li .ul_banda > li.before {
width: auto;
}
}
#works .sec_works1 .box .ul_listbanda > li .ul_banda > li.before:before {
content: "";
display: inline-block;
vertical-align: middle;
width: 238px;
height: 342px;
background: url(/site/img/works/case_before_obj1.svg) center center no-repeat;
background-size: contain;
position: absolute;
top: -100px;
left: -72px;
z-index: 1;
}
@media (max-width: 1000px) {
#works .sec_works1 .box .ul_listbanda > li .ul_banda > li.before:before {
width: 98px;
height: 98px;
background: url(/site/img_sp/works/case_before_obj1.svg) center center no-repeat;
background-size: contain;
top: -86px;
left: auto;
right: 16px;
}
}
#works .sec_works1 .box .ul_listbanda > li .ul_banda > li.after:before {
content: "";
display: inline-block;
vertical-align: middle;
width: 60px;
height: 72px;
background: url(/site/img/works/case_after_obj1.svg) center center no-repeat;
background-size: contain;
position: absolute;
top: -72px;
right: -52px;
}
@media (max-width: 1000px) {
#works .sec_works1 .box .ul_listbanda > li .ul_banda > li.after:before {
width: 96px;
height: 114px;
top: -58px;
left: auto;
right: 16px;
z-index: 10;
}
}
#works .sec_works1 .box .ul_listbanda > li:last-child .ul_banda {
margin: 100px auto 40px;
}
#works .sec_works1 .box1 {
background: #d9e8ce;
-webkit-box-shadow: 4px 4px 0 #b9c6b1;
box-shadow: 4px 4px 0 #b9c6b1;
margin-top: 98px;
}
#works .sec_works1 .box1:before {
content: "";
display: inline-block;
vertical-align: middle;
width: 162px;
height: 200px;
background: url(/site/img/service/eff_box_obj1.svg) center center no-repeat;
background-size: contain;
position: absolute;
right: 26px;
top: -200px;
}
@media (max-width: 1000px) {
#works .sec_works1 .box1:before {
right: 8px;
}
}
#works .sec_works1 .box1 > .title {
color: #1ea939;
background: url(/site/img/works/box_h_bg1.png) 0 0 no-repeat;
}
#works .sec_works1 .box1 .ul_listbanda > li .tit {
color: #1ea939;
}
#works .sec_works1 .box1 .ul_listbanda > li .tit:before {
background: url(/site/img/works/case_h_bg1.svg) center center no-repeat;
background-size: contain;
}
#works .sec_works1 .box1 .ul_listbanda > li .ul_banda > li img {
-webkit-box-shadow: 4px 4px 0 #b9c6b1;
box-shadow: 4px 4px 0 #b9c6b1;
}
#works .sec_works1 .box1 .ul_listbanda > li .ul_banda > li span {
background: #1ea939;
}
#works .sec_works1 .box2 {
background: #ddeefb;
-webkit-box-shadow: 4px 4px 0 #beccd8;
box-shadow: 4px 4px 0 #beccd8;
margin-top: 98px;
}
#works .sec_works1 .box2 > .title {
color: #3198d0;
background: url(/site/img/works/box_h_bg2.png) 0 0 no-repeat;
}
#works .sec_works1 .box2 .ul_listbanda > li .tit {
color: #3198d0;
}
#works .sec_works1 .box2 .ul_listbanda > li .tit:before {
background: url(/site/img/works/case_h_bg2.svg) center center no-repeat;
background-size: contain;
}
#works .sec_works1 .box2 .ul_listbanda > li .ul_banda > li img {
-webkit-box-shadow: 4px 4px 0 #beccd8;
box-shadow: 4px 4px 0 #beccd8;
}
#works .sec_works1 .box2 .ul_listbanda > li .ul_banda > li span {
background: #3198d0;
}
#works .sec_works2 {
margin-top: -100px;
background: url(/site/img/works/work_hd_bg1.png) center 0 no-repeat;
padding: 80px 0 0;
}
@media (max-width: 1000px) {
#works .sec_works2 {
background: url(/site/img_sp/works/work_hd_bg1.png) 100% 0 no-repeat;
}
}
#works .ul_works {
width: 750px;
margin: 40px auto 32px;
}
@media (max-width: 1000px) {
#works .ul_works {
width: auto;
margin: 40px 30px 32px;
}
}
#works .ul_works > li {
border-bottom: 2px solid #c3d5e9;
}
#works .ul_works > li > dl {
display: table;
}
@media (max-width: 1000px) {
#works .ul_works > li > dl {
display: block;
}
}
#works .ul_works > li > dl > dt, #works .ul_works > li > dl > dd {
display: table-cell;
vertical-align: top;
font-size: 20px;
padding: 1em 1em;
line-height: 1.4;
}
@media (max-width: 1000px) {
#works .ul_works > li > dl > dt, #works .ul_works > li > dl > dd {
display: block;
font-size: 24px;
padding: 0.2em;
}
}
@media (max-width: 1000px) {
#works .ul_works > li > dl > dt {
padding-top: 0.8em;
}
}
@media (max-width: 1000px) {
#works .ul_works > li > dl > dd {
padding-bottom: 0.8em;
}
} .animated {
-webkit-animation-duration: 1s;
animation-duration: 1s;
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
}
.animated.hinge {
-webkit-animation-duration: 2s;
animation-duration: 2s;
}
@-webkit-keyframes bounce {
0%, 20%, 50%, 80%, 100% {
-webkit-transform: translateY(0);
transform: translateY(0);
}
40% {
-webkit-transform: translateY(-30px);
transform: translateY(-30px);
}
60% {
-webkit-transform: translateY(-15px);
transform: translateY(-15px);
}
}
@keyframes bounce {
0%, 20%, 50%, 80%, 100% {
-webkit-transform: translateY(0);
-ms-transform: translateY(0);
transform: translateY(0);
}
40% {
-webkit-transform: translateY(-30px);
-ms-transform: translateY(-30px);
transform: translateY(-30px);
}
60% {
-webkit-transform: translateY(-15px);
-ms-transform: translateY(-15px);
transform: translateY(-15px);
}
}
.bounce {
-webkit-animation-name: bounce;
animation-name: bounce;
}
@-webkit-keyframes flash {
0%, 50%, 100% {
opacity: 1;
}
25%, 75% {
opacity: 0;
}
}
@keyframes flash {
0%, 50%, 100% {
opacity: 1;
}
25%, 75% {
opacity: 0;
}
}
.flash {
-webkit-animation-name: flash;
animation-name: flash;
} @-webkit-keyframes pulse {
0% {
-webkit-transform: scale(1);
transform: scale(1);
}
50% {
-webkit-transform: scale(1.1);
transform: scale(1.1);
}
100% {
-webkit-transform: scale(1);
transform: scale(1);
}
}
@keyframes pulse {
0% {
-webkit-transform: scale(1);
-ms-transform: scale(1);
transform: scale(1);
}
50% {
-webkit-transform: scale(1.1);
-ms-transform: scale(1.1);
transform: scale(1.1);
}
100% {
-webkit-transform: scale(1);
-ms-transform: scale(1);
transform: scale(1);
}
}
.pulse {
-webkit-animation-name: pulse;
animation-name: pulse;
}
@-webkit-keyframes shake {
0%, 100% {
-webkit-transform: translateX(0);
transform: translateX(0);
}
10%, 30%, 50%, 70%, 90% {
-webkit-transform: translateX(-10px);
transform: translateX(-10px);
}
20%, 40%, 60%, 80% {
-webkit-transform: translateX(10px);
transform: translateX(10px);
}
}
@keyframes shake {
0%, 100% {
-webkit-transform: translateX(0);
-ms-transform: translateX(0);
transform: translateX(0);
}
10%, 30%, 50%, 70%, 90% {
-webkit-transform: translateX(-10px);
-ms-transform: translateX(-10px);
transform: translateX(-10px);
}
20%, 40%, 60%, 80% {
-webkit-transform: translateX(10px);
-ms-transform: translateX(10px);
transform: translateX(10px);
}
}
.shake {
-webkit-animation-name: shake;
animation-name: shake;
}
@-webkit-keyframes swing {
20% {
-webkit-transform: rotate(15deg);
transform: rotate(15deg);
}
40% {
-webkit-transform: rotate(-10deg);
transform: rotate(-10deg);
}
60% {
-webkit-transform: rotate(5deg);
transform: rotate(5deg);
}
80% {
-webkit-transform: rotate(-5deg);
transform: rotate(-5deg);
}
100% {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
}
@keyframes swing {
20% {
-webkit-transform: rotate(15deg);
-ms-transform: rotate(15deg);
transform: rotate(15deg);
}
40% {
-webkit-transform: rotate(-10deg);
-ms-transform: rotate(-10deg);
transform: rotate(-10deg);
}
60% {
-webkit-transform: rotate(5deg);
-ms-transform: rotate(5deg);
transform: rotate(5deg);
}
80% {
-webkit-transform: rotate(-5deg);
-ms-transform: rotate(-5deg);
transform: rotate(-5deg);
}
100% {
-webkit-transform: rotate(0deg);
-ms-transform: rotate(0deg);
transform: rotate(0deg);
}
}
.swing {
-webkit-transform-origin: top center;
-ms-transform-origin: top center;
transform-origin: top center;
-webkit-animation-name: swing;
animation-name: swing;
}
@-webkit-keyframes tada {
0% {
-webkit-transform: scale(1);
transform: scale(1);
}
10%, 20% {
-webkit-transform: scale(0.9) rotate(-3deg);
transform: scale(0.9) rotate(-3deg);
}
30%, 50%, 70%, 90% {
-webkit-transform: scale(1.1) rotate(3deg);
transform: scale(1.1) rotate(3deg);
}
40%, 60%, 80% {
-webkit-transform: scale(1.1) rotate(-3deg);
transform: scale(1.1) rotate(-3deg);
}
100% {
-webkit-transform: scale(1) rotate(0);
transform: scale(1) rotate(0);
}
}
@keyframes tada {
0% {
-webkit-transform: scale(1);
-ms-transform: scale(1);
transform: scale(1);
}
10%, 20% {
-webkit-transform: scale(0.9) rotate(-3deg);
-ms-transform: scale(0.9) rotate(-3deg);
transform: scale(0.9) rotate(-3deg);
}
30%, 50%, 70%, 90% {
-webkit-transform: scale(1.1) rotate(3deg);
-ms-transform: scale(1.1) rotate(3deg);
transform: scale(1.1) rotate(3deg);
}
40%, 60%, 80% {
-webkit-transform: scale(1.1) rotate(-3deg);
-ms-transform: scale(1.1) rotate(-3deg);
transform: scale(1.1) rotate(-3deg);
}
100% {
-webkit-transform: scale(1) rotate(0);
-ms-transform: scale(1) rotate(0);
transform: scale(1) rotate(0);
}
}
.tada {
-webkit-animation-name: tada;
animation-name: tada;
} @-webkit-keyframes wobble {
0% {
-webkit-transform: translateX(0%);
transform: translateX(0%);
}
15% {
-webkit-transform: translateX(-25%) rotate(-5deg);
transform: translateX(-25%) rotate(-5deg);
}
30% {
-webkit-transform: translateX(20%) rotate(3deg);
transform: translateX(20%) rotate(3deg);
}
45% {
-webkit-transform: translateX(-15%) rotate(-3deg);
transform: translateX(-15%) rotate(-3deg);
}
60% {
-webkit-transform: translateX(10%) rotate(2deg);
transform: translateX(10%) rotate(2deg);
}
75% {
-webkit-transform: translateX(-5%) rotate(-1deg);
transform: translateX(-5%) rotate(-1deg);
}
100% {
-webkit-transform: translateX(0%);
transform: translateX(0%);
}
}
@keyframes wobble {
0% {
-webkit-transform: translateX(0%);
-ms-transform: translateX(0%);
transform: translateX(0%);
}
15% {
-webkit-transform: translateX(-25%) rotate(-5deg);
-ms-transform: translateX(-25%) rotate(-5deg);
transform: translateX(-25%) rotate(-5deg);
}
30% {
-webkit-transform: translateX(20%) rotate(3deg);
-ms-transform: translateX(20%) rotate(3deg);
transform: translateX(20%) rotate(3deg);
}
45% {
-webkit-transform: translateX(-15%) rotate(-3deg);
-ms-transform: translateX(-15%) rotate(-3deg);
transform: translateX(-15%) rotate(-3deg);
}
60% {
-webkit-transform: translateX(10%) rotate(2deg);
-ms-transform: translateX(10%) rotate(2deg);
transform: translateX(10%) rotate(2deg);
}
75% {
-webkit-transform: translateX(-5%) rotate(-1deg);
-ms-transform: translateX(-5%) rotate(-1deg);
transform: translateX(-5%) rotate(-1deg);
}
100% {
-webkit-transform: translateX(0%);
-ms-transform: translateX(0%);
transform: translateX(0%);
}
}
.wobble {
-webkit-animation-name: wobble;
animation-name: wobble;
}
@-webkit-keyframes bounceIn {
0% {
opacity: 0;
-webkit-transform: scale(0.3);
transform: scale(0.3);
}
50% {
opacity: 1;
-webkit-transform: scale(1.05);
transform: scale(1.05);
}
70% {
-webkit-transform: scale(0.9);
transform: scale(0.9);
}
100% {
-webkit-transform: scale(1);
transform: scale(1);
}
}
@keyframes bounceIn {
0% {
opacity: 0;
-webkit-transform: scale(0.3);
-ms-transform: scale(0.3);
transform: scale(0.3);
}
50% {
opacity: 1;
-webkit-transform: scale(1.05);
-ms-transform: scale(1.05);
transform: scale(1.05);
}
70% {
-webkit-transform: scale(0.9);
-ms-transform: scale(0.9);
transform: scale(0.9);
}
100% {
-webkit-transform: scale(1);
-ms-transform: scale(1);
transform: scale(1);
}
}
.bounceIn {
-webkit-animation-name: bounceIn;
animation-name: bounceIn;
}
@-webkit-keyframes bounceInDown {
0% {
opacity: 0;
-webkit-transform: translateY(-2000px);
transform: translateY(-2000px);
}
60% {
opacity: 1;
-webkit-transform: translateY(30px);
transform: translateY(30px);
}
80% {
-webkit-transform: translateY(-10px);
transform: translateY(-10px);
}
100% {
-webkit-transform: translateY(0);
transform: translateY(0);
}
}
@keyframes bounceInDown {
0% {
opacity: 0;
-webkit-transform: translateY(-2000px);
-ms-transform: translateY(-2000px);
transform: translateY(-2000px);
}
60% {
opacity: 1;
-webkit-transform: translateY(30px);
-ms-transform: translateY(30px);
transform: translateY(30px);
}
80% {
-webkit-transform: translateY(-10px);
-ms-transform: translateY(-10px);
transform: translateY(-10px);
}
100% {
-webkit-transform: translateY(0);
-ms-transform: translateY(0);
transform: translateY(0);
}
}
.bounceInDown {
-webkit-animation-name: bounceInDown;
animation-name: bounceInDown;
}
@-webkit-keyframes bounceInLeft {
0% {
opacity: 0;
-webkit-transform: translateX(-2000px);
transform: translateX(-2000px);
}
60% {
opacity: 1;
-webkit-transform: translateX(30px);
transform: translateX(30px);
}
80% {
-webkit-transform: translateX(-10px);
transform: translateX(-10px);
}
100% {
-webkit-transform: translateX(0);
transform: translateX(0);
}
}
@keyframes bounceInLeft {
0% {
opacity: 0;
-webkit-transform: translateX(-2000px);
-ms-transform: translateX(-2000px);
transform: translateX(-2000px);
}
60% {
opacity: 1;
-webkit-transform: translateX(30px);
-ms-transform: translateX(30px);
transform: translateX(30px);
}
80% {
-webkit-transform: translateX(-10px);
-ms-transform: translateX(-10px);
transform: translateX(-10px);
}
100% {
-webkit-transform: translateX(0);
-ms-transform: translateX(0);
transform: translateX(0);
}
}
.bounceInLeft {
-webkit-animation-name: bounceInLeft;
animation-name: bounceInLeft;
}
@-webkit-keyframes bounceInRight {
0% {
opacity: 0;
-webkit-transform: translateX(2000px);
transform: translateX(2000px);
}
60% {
opacity: 1;
-webkit-transform: translateX(-30px);
transform: translateX(-30px);
}
80% {
-webkit-transform: translateX(10px);
transform: translateX(10px);
}
100% {
-webkit-transform: translateX(0);
transform: translateX(0);
}
}
@keyframes bounceInRight {
0% {
opacity: 0;
-webkit-transform: translateX(2000px);
-ms-transform: translateX(2000px);
transform: translateX(2000px);
}
60% {
opacity: 1;
-webkit-transform: translateX(-30px);
-ms-transform: translateX(-30px);
transform: translateX(-30px);
}
80% {
-webkit-transform: translateX(10px);
-ms-transform: translateX(10px);
transform: translateX(10px);
}
100% {
-webkit-transform: translateX(0);
-ms-transform: translateX(0);
transform: translateX(0);
}
}
.bounceInRight {
-webkit-animation-name: bounceInRight;
animation-name: bounceInRight;
}
@-webkit-keyframes bounceInUp {
0% {
opacity: 0;
-webkit-transform: translateY(2000px);
transform: translateY(2000px);
}
60% {
opacity: 1;
-webkit-transform: translateY(-30px);
transform: translateY(-30px);
}
80% {
-webkit-transform: translateY(10px);
transform: translateY(10px);
}
100% {
-webkit-transform: translateY(0);
transform: translateY(0);
}
}
@keyframes bounceInUp {
0% {
opacity: 0;
-webkit-transform: translateY(2000px);
-ms-transform: translateY(2000px);
transform: translateY(2000px);
}
60% {
opacity: 1;
-webkit-transform: translateY(-30px);
-ms-transform: translateY(-30px);
transform: translateY(-30px);
}
80% {
-webkit-transform: translateY(10px);
-ms-transform: translateY(10px);
transform: translateY(10px);
}
100% {
-webkit-transform: translateY(0);
-ms-transform: translateY(0);
transform: translateY(0);
}
}
.bounceInUp {
-webkit-animation-name: bounceInUp;
animation-name: bounceInUp;
}
@-webkit-keyframes bounceOut {
0% {
-webkit-transform: scale(1);
transform: scale(1);
}
25% {
-webkit-transform: scale(0.95);
transform: scale(0.95);
}
50% {
opacity: 1;
-webkit-transform: scale(1.1);
transform: scale(1.1);
}
100% {
opacity: 0;
-webkit-transform: scale(0.3);
transform: scale(0.3);
}
}
@keyframes bounceOut {
0% {
-webkit-transform: scale(1);
-ms-transform: scale(1);
transform: scale(1);
}
25% {
-webkit-transform: scale(0.95);
-ms-transform: scale(0.95);
transform: scale(0.95);
}
50% {
opacity: 1;
-webkit-transform: scale(1.1);
-ms-transform: scale(1.1);
transform: scale(1.1);
}
100% {
opacity: 0;
-webkit-transform: scale(0.3);
-ms-transform: scale(0.3);
transform: scale(0.3);
}
}
.bounceOut {
-webkit-animation-name: bounceOut;
animation-name: bounceOut;
}
@-webkit-keyframes bounceOutDown {
0% {
-webkit-transform: translateY(0);
transform: translateY(0);
}
20% {
opacity: 1;
-webkit-transform: translateY(-20px);
transform: translateY(-20px);
}
100% {
opacity: 0;
-webkit-transform: translateY(2000px);
transform: translateY(2000px);
}
}
@keyframes bounceOutDown {
0% {
-webkit-transform: translateY(0);
-ms-transform: translateY(0);
transform: translateY(0);
}
20% {
opacity: 1;
-webkit-transform: translateY(-20px);
-ms-transform: translateY(-20px);
transform: translateY(-20px);
}
100% {
opacity: 0;
-webkit-transform: translateY(2000px);
-ms-transform: translateY(2000px);
transform: translateY(2000px);
}
}
.bounceOutDown {
-webkit-animation-name: bounceOutDown;
animation-name: bounceOutDown;
}
@-webkit-keyframes bounceOutLeft {
0% {
-webkit-transform: translateX(0);
transform: translateX(0);
}
20% {
opacity: 1;
-webkit-transform: translateX(20px);
transform: translateX(20px);
}
100% {
opacity: 0;
-webkit-transform: translateX(-2000px);
transform: translateX(-2000px);
}
}
@keyframes bounceOutLeft {
0% {
-webkit-transform: translateX(0);
-ms-transform: translateX(0);
transform: translateX(0);
}
20% {
opacity: 1;
-webkit-transform: translateX(20px);
-ms-transform: translateX(20px);
transform: translateX(20px);
}
100% {
opacity: 0;
-webkit-transform: translateX(-2000px);
-ms-transform: translateX(-2000px);
transform: translateX(-2000px);
}
}
.bounceOutLeft {
-webkit-animation-name: bounceOutLeft;
animation-name: bounceOutLeft;
}
@-webkit-keyframes bounceOutRight {
0% {
-webkit-transform: translateX(0);
transform: translateX(0);
}
20% {
opacity: 1;
-webkit-transform: translateX(-20px);
transform: translateX(-20px);
}
100% {
opacity: 0;
-webkit-transform: translateX(2000px);
transform: translateX(2000px);
}
}
@keyframes bounceOutRight {
0% {
-webkit-transform: translateX(0);
-ms-transform: translateX(0);
transform: translateX(0);
}
20% {
opacity: 1;
-webkit-transform: translateX(-20px);
-ms-transform: translateX(-20px);
transform: translateX(-20px);
}
100% {
opacity: 0;
-webkit-transform: translateX(2000px);
-ms-transform: translateX(2000px);
transform: translateX(2000px);
}
}
.bounceOutRight {
-webkit-animation-name: bounceOutRight;
animation-name: bounceOutRight;
}
@-webkit-keyframes bounceOutUp {
0% {
-webkit-transform: translateY(0);
transform: translateY(0);
}
20% {
opacity: 1;
-webkit-transform: translateY(20px);
transform: translateY(20px);
}
100% {
opacity: 0;
-webkit-transform: translateY(-2000px);
transform: translateY(-2000px);
}
}
@keyframes bounceOutUp {
0% {
-webkit-transform: translateY(0);
-ms-transform: translateY(0);
transform: translateY(0);
}
20% {
opacity: 1;
-webkit-transform: translateY(20px);
-ms-transform: translateY(20px);
transform: translateY(20px);
}
100% {
opacity: 0;
-webkit-transform: translateY(-2000px);
-ms-transform: translateY(-2000px);
transform: translateY(-2000px);
}
}
.bounceOutUp {
-webkit-animation-name: bounceOutUp;
animation-name: bounceOutUp;
}
@-webkit-keyframes fadeIn {
0% {
opacity: 0;
}
100% {
opacity: 1;
}
}
@keyframes fadeIn {
0% {
opacity: 0;
}
100% {
opacity: 1;
}
}
.fadeIn {
-webkit-animation-name: fadeIn;
animation-name: fadeIn;
}
@-webkit-keyframes fadeInDown {
0% {
opacity: 0;
-webkit-transform: translateY(-20px);
transform: translateY(-20px);
}
100% {
opacity: 1;
-webkit-transform: translateY(0);
transform: translateY(0);
}
}
@keyframes fadeInDown {
0% {
opacity: 0;
-webkit-transform: translateY(-20px);
-ms-transform: translateY(-20px);
transform: translateY(-20px);
}
100% {
opacity: 1;
-webkit-transform: translateY(0);
-ms-transform: translateY(0);
transform: translateY(0);
}
}
.fadeInDown {
-webkit-animation-name: fadeInDown;
animation-name: fadeInDown;
}
@-webkit-keyframes fadeInDownBig {
0% {
opacity: 0;
-webkit-transform: translateY(-2000px);
transform: translateY(-2000px);
}
100% {
opacity: 1;
-webkit-transform: translateY(0);
transform: translateY(0);
}
}
@keyframes fadeInDownBig {
0% {
opacity: 0;
-webkit-transform: translateY(-2000px);
-ms-transform: translateY(-2000px);
transform: translateY(-2000px);
}
100% {
opacity: 1;
-webkit-transform: translateY(0);
-ms-transform: translateY(0);
transform: translateY(0);
}
}
.fadeInDownBig {
-webkit-animation-name: fadeInDownBig;
animation-name: fadeInDownBig;
}
@-webkit-keyframes fadeInLeft {
0% {
opacity: 0;
-webkit-transform: translateX(-20px);
transform: translateX(-20px);
}
100% {
opacity: 1;
-webkit-transform: translateX(0);
transform: translateX(0);
}
}
@keyframes fadeInLeft {
0% {
opacity: 0;
-webkit-transform: translateX(-20px);
-ms-transform: translateX(-20px);
transform: translateX(-20px);
}
100% {
opacity: 1;
-webkit-transform: translateX(0);
-ms-transform: translateX(0);
transform: translateX(0);
}
}
.fadeInLeft {
-webkit-animation-name: fadeInLeft;
animation-name: fadeInLeft;
}
@-webkit-keyframes fadeInLeftBig {
0% {
opacity: 0;
-webkit-transform: translateX(-2000px);
transform: translateX(-2000px);
}
100% {
opacity: 1;
-webkit-transform: translateX(0);
transform: translateX(0);
}
}
@keyframes fadeInLeftBig {
0% {
opacity: 0;
-webkit-transform: translateX(-2000px);
-ms-transform: translateX(-2000px);
transform: translateX(-2000px);
}
100% {
opacity: 1;
-webkit-transform: translateX(0);
-ms-transform: translateX(0);
transform: translateX(0);
}
}
.fadeInLeftBig {
-webkit-animation-name: fadeInLeftBig;
animation-name: fadeInLeftBig;
}
@-webkit-keyframes fadeInRight {
0% {
opacity: 0;
-webkit-transform: translateX(20px);
transform: translateX(20px);
}
100% {
opacity: 1;
-webkit-transform: translateX(0);
transform: translateX(0);
}
}
@keyframes fadeInRight {
0% {
opacity: 0;
-webkit-transform: translateX(20px);
-ms-transform: translateX(20px);
transform: translateX(20px);
}
100% {
opacity: 1;
-webkit-transform: translateX(0);
-ms-transform: translateX(0);
transform: translateX(0);
}
}
.fadeInRight {
-webkit-animation-name: fadeInRight;
animation-name: fadeInRight;
}
@-webkit-keyframes fadeInRightBig {
0% {
opacity: 0;
-webkit-transform: translateX(2000px);
transform: translateX(2000px);
}
100% {
opacity: 1;
-webkit-transform: translateX(0);
transform: translateX(0);
}
}
@keyframes fadeInRightBig {
0% {
opacity: 0;
-webkit-transform: translateX(2000px);
-ms-transform: translateX(2000px);
transform: translateX(2000px);
}
100% {
opacity: 1;
-webkit-transform: translateX(0);
-ms-transform: translateX(0);
transform: translateX(0);
}
}
.fadeInRightBig {
-webkit-animation-name: fadeInRightBig;
animation-name: fadeInRightBig;
}
@-webkit-keyframes fadeInUp {
0% {
opacity: 0;
-webkit-transform: translateY(20px);
transform: translateY(20px);
}
100% {
opacity: 1;
-webkit-transform: translateY(0);
transform: translateY(0);
}
}
@keyframes fadeInUp {
0% {
opacity: 0;
-webkit-transform: translateY(20px);
-ms-transform: translateY(20px);
transform: translateY(20px);
}
100% {
opacity: 1;
-webkit-transform: translateY(0);
-ms-transform: translateY(0);
transform: translateY(0);
}
}
.fadeInUp {
-webkit-animation-name: fadeInUp;
animation-name: fadeInUp;
}
@-webkit-keyframes fadeInUpBig {
0% {
opacity: 0;
-webkit-transform: translateY(2000px);
transform: translateY(2000px);
}
100% {
opacity: 1;
-webkit-transform: translateY(0);
transform: translateY(0);
}
}
@keyframes fadeInUpBig {
0% {
opacity: 0;
-webkit-transform: translateY(2000px);
-ms-transform: translateY(2000px);
transform: translateY(2000px);
}
100% {
opacity: 1;
-webkit-transform: translateY(0);
-ms-transform: translateY(0);
transform: translateY(0);
}
}
.fadeInUpBig {
-webkit-animation-name: fadeInUpBig;
animation-name: fadeInUpBig;
}
@-webkit-keyframes fadeOut {
0% {
opacity: 1;
}
100% {
opacity: 0;
}
}
@keyframes fadeOut {
0% {
opacity: 1;
}
100% {
opacity: 0;
}
}
.fadeOut {
-webkit-animation-name: fadeOut;
animation-name: fadeOut;
}
@-webkit-keyframes fadeOutDown {
0% {
opacity: 1;
-webkit-transform: translateY(0);
transform: translateY(0);
}
100% {
opacity: 0;
-webkit-transform: translateY(20px);
transform: translateY(20px);
}
}
@keyframes fadeOutDown {
0% {
opacity: 1;
-webkit-transform: translateY(0);
-ms-transform: translateY(0);
transform: translateY(0);
}
100% {
opacity: 0;
-webkit-transform: translateY(20px);
-ms-transform: translateY(20px);
transform: translateY(20px);
}
}
.fadeOutDown {
-webkit-animation-name: fadeOutDown;
animation-name: fadeOutDown;
}
@-webkit-keyframes fadeOutDownBig {
0% {
opacity: 1;
-webkit-transform: translateY(0);
transform: translateY(0);
}
100% {
opacity: 0;
-webkit-transform: translateY(2000px);
transform: translateY(2000px);
}
}
@keyframes fadeOutDownBig {
0% {
opacity: 1;
-webkit-transform: translateY(0);
-ms-transform: translateY(0);
transform: translateY(0);
}
100% {
opacity: 0;
-webkit-transform: translateY(2000px);
-ms-transform: translateY(2000px);
transform: translateY(2000px);
}
}
.fadeOutDownBig {
-webkit-animation-name: fadeOutDownBig;
animation-name: fadeOutDownBig;
}
@-webkit-keyframes fadeOutLeft {
0% {
opacity: 1;
-webkit-transform: translateX(0);
transform: translateX(0);
}
100% {
opacity: 0;
-webkit-transform: translateX(-20px);
transform: translateX(-20px);
}
}
@keyframes fadeOutLeft {
0% {
opacity: 1;
-webkit-transform: translateX(0);
-ms-transform: translateX(0);
transform: translateX(0);
}
100% {
opacity: 0;
-webkit-transform: translateX(-20px);
-ms-transform: translateX(-20px);
transform: translateX(-20px);
}
}
.fadeOutLeft {
-webkit-animation-name: fadeOutLeft;
animation-name: fadeOutLeft;
}
@-webkit-keyframes fadeOutLeftBig {
0% {
opacity: 1;
-webkit-transform: translateX(0);
transform: translateX(0);
}
100% {
opacity: 0;
-webkit-transform: translateX(-2000px);
transform: translateX(-2000px);
}
}
@keyframes fadeOutLeftBig {
0% {
opacity: 1;
-webkit-transform: translateX(0);
-ms-transform: translateX(0);
transform: translateX(0);
}
100% {
opacity: 0;
-webkit-transform: translateX(-2000px);
-ms-transform: translateX(-2000px);
transform: translateX(-2000px);
}
}
.fadeOutLeftBig {
-webkit-animation-name: fadeOutLeftBig;
animation-name: fadeOutLeftBig;
}
@-webkit-keyframes fadeOutRight {
0% {
opacity: 1;
-webkit-transform: translateX(0);
transform: translateX(0);
}
100% {
opacity: 0;
-webkit-transform: translateX(20px);
transform: translateX(20px);
}
}
@keyframes fadeOutRight {
0% {
opacity: 1;
-webkit-transform: translateX(0);
-ms-transform: translateX(0);
transform: translateX(0);
}
100% {
opacity: 0;
-webkit-transform: translateX(20px);
-ms-transform: translateX(20px);
transform: translateX(20px);
}
}
.fadeOutRight {
-webkit-animation-name: fadeOutRight;
animation-name: fadeOutRight;
}
@-webkit-keyframes fadeOutRightBig {
0% {
opacity: 1;
-webkit-transform: translateX(0);
transform: translateX(0);
}
100% {
opacity: 0;
-webkit-transform: translateX(2000px);
transform: translateX(2000px);
}
}
@keyframes fadeOutRightBig {
0% {
opacity: 1;
-webkit-transform: translateX(0);
-ms-transform: translateX(0);
transform: translateX(0);
}
100% {
opacity: 0;
-webkit-transform: translateX(2000px);
-ms-transform: translateX(2000px);
transform: translateX(2000px);
}
}
.fadeOutRightBig {
-webkit-animation-name: fadeOutRightBig;
animation-name: fadeOutRightBig;
}
@-webkit-keyframes fadeOutUp {
0% {
opacity: 1;
-webkit-transform: translateY(0);
transform: translateY(0);
}
100% {
opacity: 0;
-webkit-transform: translateY(-20px);
transform: translateY(-20px);
}
}
@keyframes fadeOutUp {
0% {
opacity: 1;
-webkit-transform: translateY(0);
-ms-transform: translateY(0);
transform: translateY(0);
}
100% {
opacity: 0;
-webkit-transform: translateY(-20px);
-ms-transform: translateY(-20px);
transform: translateY(-20px);
}
}
.fadeOutUp {
-webkit-animation-name: fadeOutUp;
animation-name: fadeOutUp;
}
@-webkit-keyframes fadeOutUpBig {
0% {
opacity: 1;
-webkit-transform: translateY(0);
transform: translateY(0);
}
100% {
opacity: 0;
-webkit-transform: translateY(-2000px);
transform: translateY(-2000px);
}
}
@keyframes fadeOutUpBig {
0% {
opacity: 1;
-webkit-transform: translateY(0);
-ms-transform: translateY(0);
transform: translateY(0);
}
100% {
opacity: 0;
-webkit-transform: translateY(-2000px);
-ms-transform: translateY(-2000px);
transform: translateY(-2000px);
}
}
.fadeOutUpBig {
-webkit-animation-name: fadeOutUpBig;
animation-name: fadeOutUpBig;
}
@-webkit-keyframes flip {
0% {
-webkit-transform: perspective(400px) translateZ(0) rotateY(0) scale(1);
transform: perspective(400px) translateZ(0) rotateY(0) scale(1);
-webkit-animation-timing-function: ease-out;
animation-timing-function: ease-out;
}
40% {
-webkit-transform: perspective(400px) translateZ(150px) rotateY(170deg) scale(1);
transform: perspective(400px) translateZ(150px) rotateY(170deg) scale(1);
-webkit-animation-timing-function: ease-out;
animation-timing-function: ease-out;
}
50% {
-webkit-transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1);
transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1);
-webkit-animation-timing-function: ease-in;
animation-timing-function: ease-in;
}
80% {
-webkit-transform: perspective(400px) translateZ(0) rotateY(360deg) scale(0.95);
transform: perspective(400px) translateZ(0) rotateY(360deg) scale(0.95);
-webkit-animation-timing-function: ease-in;
animation-timing-function: ease-in;
}
100% {
-webkit-transform: perspective(400px) translateZ(0) rotateY(360deg) scale(1);
transform: perspective(400px) translateZ(0) rotateY(360deg) scale(1);
-webkit-animation-timing-function: ease-in;
animation-timing-function: ease-in;
}
}
@keyframes flip {
0% {
-webkit-transform: perspective(400px) translateZ(0) rotateY(0) scale(1);
-ms-transform: perspective(400px) translateZ(0) rotateY(0) scale(1);
transform: perspective(400px) translateZ(0) rotateY(0) scale(1);
-webkit-animation-timing-function: ease-out;
animation-timing-function: ease-out;
}
40% {
-webkit-transform: perspective(400px) translateZ(150px) rotateY(170deg) scale(1);
-ms-transform: perspective(400px) translateZ(150px) rotateY(170deg) scale(1);
transform: perspective(400px) translateZ(150px) rotateY(170deg) scale(1);
-webkit-animation-timing-function: ease-out;
animation-timing-function: ease-out;
}
50% {
-webkit-transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1);
-ms-transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1);
transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1);
-webkit-animation-timing-function: ease-in;
animation-timing-function: ease-in;
}
80% {
-webkit-transform: perspective(400px) translateZ(0) rotateY(360deg) scale(0.95);
-ms-transform: perspective(400px) translateZ(0) rotateY(360deg) scale(0.95);
transform: perspective(400px) translateZ(0) rotateY(360deg) scale(0.95);
-webkit-animation-timing-function: ease-in;
animation-timing-function: ease-in;
}
100% {
-webkit-transform: perspective(400px) translateZ(0) rotateY(360deg) scale(1);
-ms-transform: perspective(400px) translateZ(0) rotateY(360deg) scale(1);
transform: perspective(400px) translateZ(0) rotateY(360deg) scale(1);
-webkit-animation-timing-function: ease-in;
animation-timing-function: ease-in;
}
}
.animated.flip {
-webkit-backface-visibility: visible;
backface-visibility: visible;
-webkit-animation-name: flip;
animation-name: flip;
}
@-webkit-keyframes flipInX {
0% {
-webkit-transform: perspective(400px) rotateX(90deg);
transform: perspective(400px) rotateX(90deg);
opacity: 0;
}
40% {
-webkit-transform: perspective(400px) rotateX(-10deg);
transform: perspective(400px) rotateX(-10deg);
}
70% {
-webkit-transform: perspective(400px) rotateX(10deg);
transform: perspective(400px) rotateX(10deg);
}
100% {
-webkit-transform: perspective(400px) rotateX(0deg);
transform: perspective(400px) rotateX(0deg);
opacity: 1;
}
}
@keyframes flipInX {
0% {
-webkit-transform: perspective(400px) rotateX(90deg);
-ms-transform: perspective(400px) rotateX(90deg);
transform: perspective(400px) rotateX(90deg);
opacity: 0;
}
40% {
-webkit-transform: perspective(400px) rotateX(-10deg);
-ms-transform: perspective(400px) rotateX(-10deg);
transform: perspective(400px) rotateX(-10deg);
}
70% {
-webkit-transform: perspective(400px) rotateX(10deg);
-ms-transform: perspective(400px) rotateX(10deg);
transform: perspective(400px) rotateX(10deg);
}
100% {
-webkit-transform: perspective(400px) rotateX(0deg);
-ms-transform: perspective(400px) rotateX(0deg);
transform: perspective(400px) rotateX(0deg);
opacity: 1;
}
}
.flipInX {
-webkit-backface-visibility: visible !important;
backface-visibility: visible !important;
-webkit-animation-name: flipInX;
animation-name: flipInX;
}
@-webkit-keyframes flipInY {
0% {
-webkit-transform: perspective(400px) rotateY(90deg);
transform: perspective(400px) rotateY(90deg);
opacity: 0;
}
40% {
-webkit-transform: perspective(400px) rotateY(-10deg);
transform: perspective(400px) rotateY(-10deg);
}
70% {
-webkit-transform: perspective(400px) rotateY(10deg);
transform: perspective(400px) rotateY(10deg);
}
100% {
-webkit-transform: perspective(400px) rotateY(0deg);
transform: perspective(400px) rotateY(0deg);
opacity: 1;
}
}
@keyframes flipInY {
0% {
-webkit-transform: perspective(400px) rotateY(90deg);
-ms-transform: perspective(400px) rotateY(90deg);
transform: perspective(400px) rotateY(90deg);
opacity: 0;
}
40% {
-webkit-transform: perspective(400px) rotateY(-10deg);
-ms-transform: perspective(400px) rotateY(-10deg);
transform: perspective(400px) rotateY(-10deg);
}
70% {
-webkit-transform: perspective(400px) rotateY(10deg);
-ms-transform: perspective(400px) rotateY(10deg);
transform: perspective(400px) rotateY(10deg);
}
100% {
-webkit-transform: perspective(400px) rotateY(0deg);
-ms-transform: perspective(400px) rotateY(0deg);
transform: perspective(400px) rotateY(0deg);
opacity: 1;
}
}
.flipInY {
-webkit-backface-visibility: visible !important;
backface-visibility: visible !important;
-webkit-animation-name: flipInY;
animation-name: flipInY;
}
@-webkit-keyframes flipOutX {
0% {
-webkit-transform: perspective(400px) rotateX(0deg);
transform: perspective(400px) rotateX(0deg);
opacity: 1;
}
100% {
-webkit-transform: perspective(400px) rotateX(90deg);
transform: perspective(400px) rotateX(90deg);
opacity: 0;
}
}
@keyframes flipOutX {
0% {
-webkit-transform: perspective(400px) rotateX(0deg);
-ms-transform: perspective(400px) rotateX(0deg);
transform: perspective(400px) rotateX(0deg);
opacity: 1;
}
100% {
-webkit-transform: perspective(400px) rotateX(90deg);
-ms-transform: perspective(400px) rotateX(90deg);
transform: perspective(400px) rotateX(90deg);
opacity: 0;
}
}
.flipOutX {
-webkit-animation-name: flipOutX;
animation-name: flipOutX;
-webkit-backface-visibility: visible !important;
backface-visibility: visible !important;
}
@-webkit-keyframes flipOutY {
0% {
-webkit-transform: perspective(400px) rotateY(0deg);
transform: perspective(400px) rotateY(0deg);
opacity: 1;
}
100% {
-webkit-transform: perspective(400px) rotateY(90deg);
transform: perspective(400px) rotateY(90deg);
opacity: 0;
}
}
@keyframes flipOutY {
0% {
-webkit-transform: perspective(400px) rotateY(0deg);
-ms-transform: perspective(400px) rotateY(0deg);
transform: perspective(400px) rotateY(0deg);
opacity: 1;
}
100% {
-webkit-transform: perspective(400px) rotateY(90deg);
-ms-transform: perspective(400px) rotateY(90deg);
transform: perspective(400px) rotateY(90deg);
opacity: 0;
}
}
.flipOutY {
-webkit-backface-visibility: visible !important;
backface-visibility: visible !important;
-webkit-animation-name: flipOutY;
animation-name: flipOutY;
}
@-webkit-keyframes lightSpeedIn {
0% {
-webkit-transform: translateX(100%) skewX(-30deg);
transform: translateX(100%) skewX(-30deg);
opacity: 0;
}
60% {
-webkit-transform: translateX(-20%) skewX(30deg);
transform: translateX(-20%) skewX(30deg);
opacity: 1;
}
80% {
-webkit-transform: translateX(0%) skewX(-15deg);
transform: translateX(0%) skewX(-15deg);
opacity: 1;
}
100% {
-webkit-transform: translateX(0%) skewX(0deg);
transform: translateX(0%) skewX(0deg);
opacity: 1;
}
}
@keyframes lightSpeedIn {
0% {
-webkit-transform: translateX(100%) skewX(-30deg);
-ms-transform: translateX(100%) skewX(-30deg);
transform: translateX(100%) skewX(-30deg);
opacity: 0;
}
60% {
-webkit-transform: translateX(-20%) skewX(30deg);
-ms-transform: translateX(-20%) skewX(30deg);
transform: translateX(-20%) skewX(30deg);
opacity: 1;
}
80% {
-webkit-transform: translateX(0%) skewX(-15deg);
-ms-transform: translateX(0%) skewX(-15deg);
transform: translateX(0%) skewX(-15deg);
opacity: 1;
}
100% {
-webkit-transform: translateX(0%) skewX(0deg);
-ms-transform: translateX(0%) skewX(0deg);
transform: translateX(0%) skewX(0deg);
opacity: 1;
}
}
.lightSpeedIn {
-webkit-animation-name: lightSpeedIn;
animation-name: lightSpeedIn;
-webkit-animation-timing-function: ease-out;
animation-timing-function: ease-out;
}
@-webkit-keyframes lightSpeedOut {
0% {
-webkit-transform: translateX(0%) skewX(0deg);
transform: translateX(0%) skewX(0deg);
opacity: 1;
}
100% {
-webkit-transform: translateX(100%) skewX(-30deg);
transform: translateX(100%) skewX(-30deg);
opacity: 0;
}
}
@keyframes lightSpeedOut {
0% {
-webkit-transform: translateX(0%) skewX(0deg);
-ms-transform: translateX(0%) skewX(0deg);
transform: translateX(0%) skewX(0deg);
opacity: 1;
}
100% {
-webkit-transform: translateX(100%) skewX(-30deg);
-ms-transform: translateX(100%) skewX(-30deg);
transform: translateX(100%) skewX(-30deg);
opacity: 0;
}
}
.lightSpeedOut {
-webkit-animation-name: lightSpeedOut;
animation-name: lightSpeedOut;
-webkit-animation-timing-function: ease-in;
animation-timing-function: ease-in;
}
@-webkit-keyframes rotateIn {
0% {
-webkit-transform-origin: center center;
transform-origin: center center;
-webkit-transform: rotate(-200deg);
transform: rotate(-200deg);
opacity: 0;
}
100% {
-webkit-transform-origin: center center;
transform-origin: center center;
-webkit-transform: rotate(0);
transform: rotate(0);
opacity: 1;
}
}
@keyframes rotateIn {
0% {
-webkit-transform-origin: center center;
-ms-transform-origin: center center;
transform-origin: center center;
-webkit-transform: rotate(-200deg);
-ms-transform: rotate(-200deg);
transform: rotate(-200deg);
opacity: 0;
}
100% {
-webkit-transform-origin: center center;
-ms-transform-origin: center center;
transform-origin: center center;
-webkit-transform: rotate(0);
-ms-transform: rotate(0);
transform: rotate(0);
opacity: 1;
}
}
.rotateIn {
-webkit-animation-name: rotateIn;
animation-name: rotateIn;
}
@-webkit-keyframes rotateInDownLeft {
0% {
-webkit-transform-origin: left bottom;
transform-origin: left bottom;
-webkit-transform: rotate(-90deg);
transform: rotate(-90deg);
opacity: 0;
}
100% {
-webkit-transform-origin: left bottom;
transform-origin: left bottom;
-webkit-transform: rotate(0);
transform: rotate(0);
opacity: 1;
}
}
@keyframes rotateInDownLeft {
0% {
-webkit-transform-origin: left bottom;
-ms-transform-origin: left bottom;
transform-origin: left bottom;
-webkit-transform: rotate(-90deg);
-ms-transform: rotate(-90deg);
transform: rotate(-90deg);
opacity: 0;
}
100% {
-webkit-transform-origin: left bottom;
-ms-transform-origin: left bottom;
transform-origin: left bottom;
-webkit-transform: rotate(0);
-ms-transform: rotate(0);
transform: rotate(0);
opacity: 1;
}
}
.rotateInDownLeft {
-webkit-animation-name: rotateInDownLeft;
animation-name: rotateInDownLeft;
}
@-webkit-keyframes rotateInDownRight {
0% {
-webkit-transform-origin: right bottom;
transform-origin: right bottom;
-webkit-transform: rotate(90deg);
transform: rotate(90deg);
opacity: 0;
}
100% {
-webkit-transform-origin: right bottom;
transform-origin: right bottom;
-webkit-transform: rotate(0);
transform: rotate(0);
opacity: 1;
}
}
@keyframes rotateInDownRight {
0% {
-webkit-transform-origin: right bottom;
-ms-transform-origin: right bottom;
transform-origin: right bottom;
-webkit-transform: rotate(90deg);
-ms-transform: rotate(90deg);
transform: rotate(90deg);
opacity: 0;
}
100% {
-webkit-transform-origin: right bottom;
-ms-transform-origin: right bottom;
transform-origin: right bottom;
-webkit-transform: rotate(0);
-ms-transform: rotate(0);
transform: rotate(0);
opacity: 1;
}
}
.rotateInDownRight {
-webkit-animation-name: rotateInDownRight;
animation-name: rotateInDownRight;
}
@-webkit-keyframes rotateInUpLeft {
0% {
-webkit-transform-origin: left bottom;
transform-origin: left bottom;
-webkit-transform: rotate(90deg);
transform: rotate(90deg);
opacity: 0;
}
100% {
-webkit-transform-origin: left bottom;
transform-origin: left bottom;
-webkit-transform: rotate(0);
transform: rotate(0);
opacity: 1;
}
}
@keyframes rotateInUpLeft {
0% {
-webkit-transform-origin: left bottom;
-ms-transform-origin: left bottom;
transform-origin: left bottom;
-webkit-transform: rotate(90deg);
-ms-transform: rotate(90deg);
transform: rotate(90deg);
opacity: 0;
}
100% {
-webkit-transform-origin: left bottom;
-ms-transform-origin: left bottom;
transform-origin: left bottom;
-webkit-transform: rotate(0);
-ms-transform: rotate(0);
transform: rotate(0);
opacity: 1;
}
}
.rotateInUpLeft {
-webkit-animation-name: rotateInUpLeft;
animation-name: rotateInUpLeft;
}
@-webkit-keyframes rotateInUpRight {
0% {
-webkit-transform-origin: right bottom;
transform-origin: right bottom;
-webkit-transform: rotate(-90deg);
transform: rotate(-90deg);
opacity: 0;
}
100% {
-webkit-transform-origin: right bottom;
transform-origin: right bottom;
-webkit-transform: rotate(0);
transform: rotate(0);
opacity: 1;
}
}
@keyframes rotateInUpRight {
0% {
-webkit-transform-origin: right bottom;
-ms-transform-origin: right bottom;
transform-origin: right bottom;
-webkit-transform: rotate(-90deg);
-ms-transform: rotate(-90deg);
transform: rotate(-90deg);
opacity: 0;
}
100% {
-webkit-transform-origin: right bottom;
-ms-transform-origin: right bottom;
transform-origin: right bottom;
-webkit-transform: rotate(0);
-ms-transform: rotate(0);
transform: rotate(0);
opacity: 1;
}
}
.rotateInUpRight {
-webkit-animation-name: rotateInUpRight;
animation-name: rotateInUpRight;
}
@-webkit-keyframes rotateOut {
0% {
-webkit-transform-origin: center center;
transform-origin: center center;
-webkit-transform: rotate(0);
transform: rotate(0);
opacity: 1;
}
100% {
-webkit-transform-origin: center center;
transform-origin: center center;
-webkit-transform: rotate(200deg);
transform: rotate(200deg);
opacity: 0;
}
}
@keyframes rotateOut {
0% {
-webkit-transform-origin: center center;
-ms-transform-origin: center center;
transform-origin: center center;
-webkit-transform: rotate(0);
-ms-transform: rotate(0);
transform: rotate(0);
opacity: 1;
}
100% {
-webkit-transform-origin: center center;
-ms-transform-origin: center center;
transform-origin: center center;
-webkit-transform: rotate(200deg);
-ms-transform: rotate(200deg);
transform: rotate(200deg);
opacity: 0;
}
}
.rotateOut {
-webkit-animation-name: rotateOut;
animation-name: rotateOut;
}
@-webkit-keyframes rotateOutDownLeft {
0% {
-webkit-transform-origin: left bottom;
transform-origin: left bottom;
-webkit-transform: rotate(0);
transform: rotate(0);
opacity: 1;
}
100% {
-webkit-transform-origin: left bottom;
transform-origin: left bottom;
-webkit-transform: rotate(90deg);
transform: rotate(90deg);
opacity: 0;
}
}
@keyframes rotateOutDownLeft {
0% {
-webkit-transform-origin: left bottom;
-ms-transform-origin: left bottom;
transform-origin: left bottom;
-webkit-transform: rotate(0);
-ms-transform: rotate(0);
transform: rotate(0);
opacity: 1;
}
100% {
-webkit-transform-origin: left bottom;
-ms-transform-origin: left bottom;
transform-origin: left bottom;
-webkit-transform: rotate(90deg);
-ms-transform: rotate(90deg);
transform: rotate(90deg);
opacity: 0;
}
}
.rotateOutDownLeft {
-webkit-animation-name: rotateOutDownLeft;
animation-name: rotateOutDownLeft;
}
@-webkit-keyframes rotateOutDownRight {
0% {
-webkit-transform-origin: right bottom;
transform-origin: right bottom;
-webkit-transform: rotate(0);
transform: rotate(0);
opacity: 1;
}
100% {
-webkit-transform-origin: right bottom;
transform-origin: right bottom;
-webkit-transform: rotate(-90deg);
transform: rotate(-90deg);
opacity: 0;
}
}
@keyframes rotateOutDownRight {
0% {
-webkit-transform-origin: right bottom;
-ms-transform-origin: right bottom;
transform-origin: right bottom;
-webkit-transform: rotate(0);
-ms-transform: rotate(0);
transform: rotate(0);
opacity: 1;
}
100% {
-webkit-transform-origin: right bottom;
-ms-transform-origin: right bottom;
transform-origin: right bottom;
-webkit-transform: rotate(-90deg);
-ms-transform: rotate(-90deg);
transform: rotate(-90deg);
opacity: 0;
}
}
.rotateOutDownRight {
-webkit-animation-name: rotateOutDownRight;
animation-name: rotateOutDownRight;
}
@-webkit-keyframes rotateOutUpLeft {
0% {
-webkit-transform-origin: left bottom;
transform-origin: left bottom;
-webkit-transform: rotate(0);
transform: rotate(0);
opacity: 1;
}
100% {
-webkit-transform-origin: left bottom;
transform-origin: left bottom;
-webkit-transform: rotate(-90deg);
transform: rotate(-90deg);
opacity: 0;
}
}
@keyframes rotateOutUpLeft {
0% {
-webkit-transform-origin: left bottom;
-ms-transform-origin: left bottom;
transform-origin: left bottom;
-webkit-transform: rotate(0);
-ms-transform: rotate(0);
transform: rotate(0);
opacity: 1;
}
100% {
-webkit-transform-origin: left bottom;
-ms-transform-origin: left bottom;
transform-origin: left bottom;
-webkit-transform: rotate(-90deg);
-ms-transform: rotate(-90deg);
transform: rotate(-90deg);
opacity: 0;
}
}
.rotateOutUpLeft {
-webkit-animation-name: rotateOutUpLeft;
animation-name: rotateOutUpLeft;
}
@-webkit-keyframes rotateOutUpRight {
0% {
-webkit-transform-origin: right bottom;
transform-origin: right bottom;
-webkit-transform: rotate(0);
transform: rotate(0);
opacity: 1;
}
100% {
-webkit-transform-origin: right bottom;
transform-origin: right bottom;
-webkit-transform: rotate(90deg);
transform: rotate(90deg);
opacity: 0;
}
}
@keyframes rotateOutUpRight {
0% {
-webkit-transform-origin: right bottom;
-ms-transform-origin: right bottom;
transform-origin: right bottom;
-webkit-transform: rotate(0);
-ms-transform: rotate(0);
transform: rotate(0);
opacity: 1;
}
100% {
-webkit-transform-origin: right bottom;
-ms-transform-origin: right bottom;
transform-origin: right bottom;
-webkit-transform: rotate(90deg);
-ms-transform: rotate(90deg);
transform: rotate(90deg);
opacity: 0;
}
}
.rotateOutUpRight {
-webkit-animation-name: rotateOutUpRight;
animation-name: rotateOutUpRight;
}
@-webkit-keyframes slideInDown {
0% {
opacity: 0;
-webkit-transform: translateY(-2000px);
transform: translateY(-2000px);
}
100% {
-webkit-transform: translateY(0);
transform: translateY(0);
}
}
@keyframes slideInDown {
0% {
opacity: 0;
-webkit-transform: translateY(-2000px);
-ms-transform: translateY(-2000px);
transform: translateY(-2000px);
}
100% {
-webkit-transform: translateY(0);
-ms-transform: translateY(0);
transform: translateY(0);
}
}
.slideInDown {
-webkit-animation-name: slideInDown;
animation-name: slideInDown;
}
@-webkit-keyframes slideInLeft {
0% {
opacity: 0;
-webkit-transform: translateX(-2000px);
transform: translateX(-2000px);
}
100% {
-webkit-transform: translateX(0);
transform: translateX(0);
}
}
@keyframes slideInLeft {
0% {
opacity: 0;
-webkit-transform: translateX(-2000px);
-ms-transform: translateX(-2000px);
transform: translateX(-2000px);
}
100% {
-webkit-transform: translateX(0);
-ms-transform: translateX(0);
transform: translateX(0);
}
}
.slideInLeft {
-webkit-animation-name: slideInLeft;
animation-name: slideInLeft;
}
@-webkit-keyframes slideInRight {
0% {
opacity: 0;
-webkit-transform: translateX(2000px);
transform: translateX(2000px);
}
100% {
-webkit-transform: translateX(0);
transform: translateX(0);
}
}
@keyframes slideInRight {
0% {
opacity: 0;
-webkit-transform: translateX(2000px);
-ms-transform: translateX(2000px);
transform: translateX(2000px);
}
100% {
-webkit-transform: translateX(0);
-ms-transform: translateX(0);
transform: translateX(0);
}
}
.slideInRight {
-webkit-animation-name: slideInRight;
animation-name: slideInRight;
}
@-webkit-keyframes slideOutLeft {
0% {
-webkit-transform: translateX(0);
transform: translateX(0);
}
100% {
opacity: 0;
-webkit-transform: translateX(-2000px);
transform: translateX(-2000px);
}
}
@keyframes slideOutLeft {
0% {
-webkit-transform: translateX(0);
-ms-transform: translateX(0);
transform: translateX(0);
}
100% {
opacity: 0;
-webkit-transform: translateX(-2000px);
-ms-transform: translateX(-2000px);
transform: translateX(-2000px);
}
}
.slideOutLeft {
-webkit-animation-name: slideOutLeft;
animation-name: slideOutLeft;
}
@-webkit-keyframes slideOutRight {
0% {
-webkit-transform: translateX(0);
transform: translateX(0);
}
100% {
opacity: 0;
-webkit-transform: translateX(2000px);
transform: translateX(2000px);
}
}
@keyframes slideOutRight {
0% {
-webkit-transform: translateX(0);
-ms-transform: translateX(0);
transform: translateX(0);
}
100% {
opacity: 0;
-webkit-transform: translateX(2000px);
-ms-transform: translateX(2000px);
transform: translateX(2000px);
}
}
.slideOutRight {
-webkit-animation-name: slideOutRight;
animation-name: slideOutRight;
}
@-webkit-keyframes slideOutUp {
0% {
-webkit-transform: translateY(0);
transform: translateY(0);
}
100% {
opacity: 0;
-webkit-transform: translateY(-2000px);
transform: translateY(-2000px);
}
}
@keyframes slideOutUp {
0% {
-webkit-transform: translateY(0);
-ms-transform: translateY(0);
transform: translateY(0);
}
100% {
opacity: 0;
-webkit-transform: translateY(-2000px);
-ms-transform: translateY(-2000px);
transform: translateY(-2000px);
}
}
.slideOutUp {
-webkit-animation-name: slideOutUp;
animation-name: slideOutUp;
}
@-webkit-keyframes hinge {
0% {
-webkit-transform: rotate(0);
transform: rotate(0);
-webkit-transform-origin: top left;
transform-origin: top left;
-webkit-animation-timing-function: ease-in-out;
animation-timing-function: ease-in-out;
}
20%, 60% {
-webkit-transform: rotate(80deg);
transform: rotate(80deg);
-webkit-transform-origin: top left;
transform-origin: top left;
-webkit-animation-timing-function: ease-in-out;
animation-timing-function: ease-in-out;
}
40% {
-webkit-transform: rotate(60deg);
transform: rotate(60deg);
-webkit-transform-origin: top left;
transform-origin: top left;
-webkit-animation-timing-function: ease-in-out;
animation-timing-function: ease-in-out;
}
80% {
-webkit-transform: rotate(60deg) translateY(0);
transform: rotate(60deg) translateY(0);
opacity: 1;
-webkit-transform-origin: top left;
transform-origin: top left;
-webkit-animation-timing-function: ease-in-out;
animation-timing-function: ease-in-out;
}
100% {
-webkit-transform: translateY(700px);
transform: translateY(700px);
opacity: 0;
}
}
@keyframes hinge {
0% {
-webkit-transform: rotate(0);
-ms-transform: rotate(0);
transform: rotate(0);
-webkit-transform-origin: top left;
-ms-transform-origin: top left;
transform-origin: top left;
-webkit-animation-timing-function: ease-in-out;
animation-timing-function: ease-in-out;
}
20%, 60% {
-webkit-transform: rotate(80deg);
-ms-transform: rotate(80deg);
transform: rotate(80deg);
-webkit-transform-origin: top left;
-ms-transform-origin: top left;
transform-origin: top left;
-webkit-animation-timing-function: ease-in-out;
animation-timing-function: ease-in-out;
}
40% {
-webkit-transform: rotate(60deg);
-ms-transform: rotate(60deg);
transform: rotate(60deg);
-webkit-transform-origin: top left;
-ms-transform-origin: top left;
transform-origin: top left;
-webkit-animation-timing-function: ease-in-out;
animation-timing-function: ease-in-out;
}
80% {
-webkit-transform: rotate(60deg) translateY(0);
-ms-transform: rotate(60deg) translateY(0);
transform: rotate(60deg) translateY(0);
opacity: 1;
-webkit-transform-origin: top left;
-ms-transform-origin: top left;
transform-origin: top left;
-webkit-animation-timing-function: ease-in-out;
animation-timing-function: ease-in-out;
}
100% {
-webkit-transform: translateY(700px);
-ms-transform: translateY(700px);
transform: translateY(700px);
opacity: 0;
}
}
.hinge {
-webkit-animation-name: hinge;
animation-name: hinge;
} @-webkit-keyframes rollIn {
0% {
opacity: 0;
-webkit-transform: translateX(-100%) rotate(-120deg);
transform: translateX(-100%) rotate(-120deg);
}
100% {
opacity: 1;
-webkit-transform: translateX(0px) rotate(0deg);
transform: translateX(0px) rotate(0deg);
}
}
@keyframes rollIn {
0% {
opacity: 0;
-webkit-transform: translateX(-100%) rotate(-120deg);
-ms-transform: translateX(-100%) rotate(-120deg);
transform: translateX(-100%) rotate(-120deg);
}
100% {
opacity: 1;
-webkit-transform: translateX(0px) rotate(0deg);
-ms-transform: translateX(0px) rotate(0deg);
transform: translateX(0px) rotate(0deg);
}
}
.rollIn {
-webkit-animation-name: rollIn;
animation-name: rollIn;
} @-webkit-keyframes rollOut {
0% {
opacity: 1;
-webkit-transform: translateX(0px) rotate(0deg);
transform: translateX(0px) rotate(0deg);
}
100% {
opacity: 0;
-webkit-transform: translateX(100%) rotate(120deg);
transform: translateX(100%) rotate(120deg);
}
}
@keyframes rollOut {
0% {
opacity: 1;
-webkit-transform: translateX(0px) rotate(0deg);
-ms-transform: translateX(0px) rotate(0deg);
transform: translateX(0px) rotate(0deg);
}
100% {
opacity: 0;
-webkit-transform: translateX(100%) rotate(120deg);
-ms-transform: translateX(100%) rotate(120deg);
transform: translateX(100%) rotate(120deg);
}
}
.rollOut {
-webkit-animation-name: rollOut;
animation-name: rollOut;
}.slick-slider {
position: relative;
display: block;
-webkit-box-sizing: border-box;
box-sizing: border-box;
-webkit-touch-callout: none;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
-ms-touch-action: pan-y;
touch-action: pan-y;
-webkit-tap-highlight-color: transparent;
}
.slick-list {
position: relative;
overflow: hidden;
display: block;
margin: 0;
padding: 0;
}
.slick-list:focus {
outline: none;
}
.slick-list.dragging {
cursor: pointer;
cursor: hand;
}
.slick-slider .slick-track,
.slick-slider .slick-list {
-webkit-transform: translate3d(0, 0, 0);
-ms-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
.slick-track {
position: relative;
left: 0;
top: 0;
display: block;
margin-left: auto;
margin-right: auto;
}
.slick-track:before, .slick-track:after {
content: "";
display: table;
}
.slick-track:after {
clear: both;
}
.slick-loading .slick-track {
visibility: hidden;
}
.slick-slide {
float: left;
height: 100%;
min-height: 1px;
display: none;
}
[dir="rtl"] .slick-slide {
float: right;
}
.slick-slide img {
display: block;
}
@media (min-width: 1001px) {
.slick-slide img.sp {
display: none;
}
}
@media (max-width: 1000px) {
.slick-slide img.pc {
display: none;
}
.slick-slide img.sp {
display: block;
}
}
.slick-slide.slick-loading img {
display: none;
}
.slick-slide.dragging img {
pointer-events: none;
}
.slick-initialized .slick-slide {
display: block;
}
.slick-loading .slick-slide {
visibility: hidden;
}
.slick-vertical .slick-slide {
display: block;
height: auto;
border: 1px solid transparent;
}
.slick-arrow.slick-hidden {
display: none;
}
.slick-dots {
position: absolute;
bottom: -60px;
display: block;
width: 100%;
padding: 0;
list-style: none;
text-align: center;
}
.slick-dots li {
position: relative;
display: inline-block;
width: 20px;
height: 20px;
margin: 0 5px;
padding: 0;
cursor: pointer;
}
@media (max-width: 1000px) {
.slick-dots li {
margin: 0px 10px;
}
}
.slick-dots li button {
font-size: 0;
line-height: 0;
display: block;
width: 20px;
height: 20px;
padding: 5px;
cursor: pointer;
color: transparent;
border: 0;
outline: none;
background: transparent;
}
.slick-dots li button:hover,
.slick-dots li button:focus {
outline: none;
}
.slick-dots li button:hover:before,
.slick-dots li button:focus:before {
opacity: 1;
}
.slick-dots li button:before {
font-family: 'slick';
font-size: 6px;
line-height: 20px;
position: absolute;
top: 0;
left: 0;
width: 10px;
height: 10px;
border-radius: 10px;
content: "";
text-align: center;
background: #999999;
color: #999999;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
@media (max-width: 1000px) {
.slick-dots li button:before {
width: 16px;
height: 16px;
}
}
.slick-dots li.slick-active button:before {
background: #e88e22;
color: #e88e22;
}#colorbox, #cboxOverlay, #cboxWrapper{position:absolute; top:0; left:0; z-index:9999; overflow:hidden;}
#cboxWrapper {max-width:none;}
#cboxOverlay{position:fixed; width:100%; height:100%;}
#cboxMiddleLeft, #cboxBottomLeft{clear:left;}
#cboxContent{position:relative;}
#cboxLoadedContent{overflow:auto; -webkit-overflow-scrolling: touch;}
#cboxTitle{margin:0;}
#cboxLoadingOverlay, #cboxLoadingGraphic{position:absolute; top:0; left:0; width:100%; height:100%;}
#cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow{cursor:pointer;}
.cboxPhoto{float:left; margin:auto; border:0; display:block; max-width:none; -ms-interpolation-mode:bicubic;}
.cboxIframe{width:100%; height:100%; display:block; border:0; padding:0; margin:0;}
#colorbox, #cboxContent, #cboxLoadedContent{box-sizing:content-box; -moz-box-sizing:content-box; -webkit-box-sizing:content-box;} #cboxOverlay{background:url(/lib/img/colorbox/overlay.png) repeat 0 0; opacity: 0.9; filter: alpha(opacity = 90);}
#colorbox{outline:0;}
#cboxTopLeft{width:21px; height:21px; background:url(/lib/img/colorbox/controls.png) no-repeat -101px 0;}
#cboxTopRight{width:21px; height:21px; background:url(/lib/img/colorbox/controls.png) no-repeat -130px 0;}
#cboxBottomLeft{width:21px; height:21px; background:url(/lib/img/colorbox/controls.png) no-repeat -101px -29px;}
#cboxBottomRight{width:21px; height:21px; background:url(/lib/img/colorbox/controls.png) no-repeat -130px -29px;}
#cboxMiddleLeft{width:21px; background:url(/lib/img/colorbox/controls.png) left top repeat-y;}
#cboxMiddleRight{width:21px; background:url(/lib/img/colorbox/controls.png) right top repeat-y;}
#cboxTopCenter{height:21px; background:url(/lib/img/colorbox/border.png) 0 0 repeat-x;}
#cboxBottomCenter{height:21px; background:url(/lib/img/colorbox/border.png) 0 -29px repeat-x;}
#cboxContent{background:#fff; overflow:hidden;}
.cboxIframe{background:#fff;}
#cboxError{padding:50px; border:1px solid #ccc;}
#cboxLoadedContent{margin-bottom:28px;}
#cboxTitle{position:absolute; bottom:4px; left:0; text-align:center; width:100%; color:#949494;}
#cboxCurrent{position:absolute; bottom:4px; left:58px; color:#949494;}
#cboxLoadingOverlay{background:url(/lib/img/colorbox/loading_background.png) no-repeat center center;}
#cboxLoadingGraphic{background:url(/lib/img/colorbox/loading.gif) no-repeat center center;} #cboxPrevious, #cboxNext, #cboxSlideshow, #cboxClose {border:0; padding:0; margin:0; overflow:visible; width:auto; background:none; } #cboxPrevious:active, #cboxNext:active, #cboxSlideshow:active, #cboxClose:active {outline:0;}
#cboxSlideshow{position:absolute; bottom:4px; right:30px; color:#0092ef;}
#cboxPrevious{position:absolute; bottom:0; left:0; background:url(/lib/img/colorbox/controls.png) no-repeat -75px 0; width:25px; height:25px; text-indent:-9999px;}
#cboxPrevious:hover{background-position:-75px -25px;}
#cboxNext{position:absolute; bottom:0; left:27px; background:url(/lib/img/colorbox/controls.png) no-repeat -50px 0; width:25px; height:25px; text-indent:-9999px;}
#cboxNext:hover{background-position:-50px -25px;}
#cboxClose{position:absolute; bottom:0; right:0; background:url(/lib/img/colorbox/controls.png) no-repeat -25px 0; width:25px; height:25px; text-indent:-9999px;}
#cboxClose:hover{background-position:-25px -25px;} .cboxIE #cboxTopLeft,
.cboxIE #cboxTopCenter,
.cboxIE #cboxTopRight,
.cboxIE #cboxBottomLeft,
.cboxIE #cboxBottomCenter,
.cboxIE #cboxBottomRight,
.cboxIE #cboxMiddleLeft,
.cboxIE #cboxMiddleRight {
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#00FFFFFF,endColorstr=#00FFFFFF);
}