@charset "UTF-8";

/*! normalize.css v3.0.2 | MIT License | git.io/normalize */

abbr,
acronym,
fieldset,
img,
input,
legend {
border: 0
}

a,
a:active,
a:hover,
input {
outline: 0
}

#header .header_in:after,
q:after,
q:before {
content: ''
}

html {
font-family: sans-serif;
-ms-text-size-adjust: 100%;
-webkit-text-size-adjust: 100%
}

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

audio,
canvas,
progress,
video {
display: inline-block;
vertical-align: baseline
}

audio:not([controls]) {
display: none;
height: 0
}

[hidden],
template {
display: none
}

a {
background-color: transparent
}

abbr[title] {
border-bottom: 1px dotted
}

b,
optgroup,
strong {
font-weight: 700
}

mark {
background: #ff0;
color: #000
}

small {
font-size: 80%
}

sub,
sup {
font-size: 75%;
line-height: 0;
position: relative;
vertical-align: baseline
}

sup {
top: -.5em
}

sub {
bottom: -.25em
}

svg:not(:root) {
overflow: hidden
}

figure {
margin: 1em 40px
}

hr {
-webkit-box-sizing: content-box;
box-sizing: content-box;
height: 0
}

pre,
textarea {
overflow: auto
}

code,
kbd,
pre,
samp {
font-family: monospace;
font-size: 1em
}

button,
input,
optgroup,
select,
textarea {
color: inherit;
font: inherit;
margin: 0
}

a,
body,
input {
color: #454445
}

button {
overflow: visible
}

button,
select {
text-transform: none
}

button,
html input[type=button],
input[type=reset],
input[type=submit] {
-webkit-appearance: button;
cursor: pointer
}

button[disabled],
html input[disabled] {
cursor: default
}

button::-moz-focus-inner,
input::-moz-focus-inner {
border: 0;
padding: 0
}

input {
line-height: normal
}

input[type=checkbox],
input[type=radio] {
-webkit-box-sizing: border-box;
box-sizing: border-box;
padding: 0
}

input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {
height: auto
}

input[type=search] {
-webkit-appearance: textfield;
-webkit-box-sizing: content-box;
box-sizing: content-box
}

input[type=search]::-webkit-search-cancel-button,
input[type=search]::-webkit-search-decoration {
-webkit-appearance: none
}

legend {
padding: 0
}

blockquote,
body,
dd,
div,
dl,
dt,
fieldset,
form,
h1,
h2,
h3,
h4,
h5,
h6,
input,
li,
ol,
p,
pre,
td,
textarea,
th,
ul {
margin: 0;
padding: 0
}

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

address,
caption,
cite,
code,
dfn,
th,
var {
font-style: normal
}

ol,
ul {
list-style: none
}

caption,
th {
text-align: left
}

h1,
h2,
h3,
h4,
h5,
h6 {
font-size: 100%;
text-align: left
}

a,
img {
vertical-align: top;
display: inline-block;
}

@font-face {
font-family: "Bank Gothic";
src: url(../font/bankgothicltbtlight.eot) format("eot"), url(../font/bankgothicltbtlight.woff) format("woff")
}

html {
font-size: 62.5%
}

body {
margin: 0;
width: 100%;
font-size: 1.6rem;
line-height: 1.75;
font-family: "Yu Gothic", YuGothic, "ヒラギノ角ゴ Pro W3", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "Lucida Grande", "Lucida Sans Unicode", Arial, Verdana, sans-serif;
/*word-break: break-all*/
word-break: normal;
}

#header .header_in .right,
#top_main .info_tit,
.top_tit .tit {
font-family: "Bank Gothic", Orbitron, "Lucida Grande", "Lucida Sans Unicode", Arial, Verdana, sans-serif;
font-weight: 100
}

a,
input {
text-decoration: none
}

a,
a:active,
a:hover,
a:link,
a:visited {
text-decoration: underline
}

#header .header_in {
-webkit-box-sizing: border-box;
box-sizing: border-box;
max-width: 1366px;
padding-right: 43px;
margin: 0 auto;
position: relative;
overflow: visible
}

#header .header_in .line {
display: block;
width: 150px;
position: absolute;
height: 860px;
right: 15px;
top: 0;
background: #efae00;
z-index: -1
}

#header .header_in .gnav li > a:after,
#header .header_in .gnav li.active span:after,
#header .header_in .lang li a:after {
display: block;
width: 20px;
height: 2px;
background: #efae00;
right: 0;
bottom: 0
}

#header .header_in:after {
display: block;
clear: both
}

#header .header_in .logo {
float: left;
padding-top: 40px;
padding-left: 35px
}

#header .header_in .right {
float: right;
color: #1e1e1e
}

#header .header_in .right a {
text-decoration: none
}

#header .header_in .lang {
/*overflow: hidden;*/
padding: 15px 0 30px;
margin-right: 150px
}
#header .header_in .lang:after{
content: '';
display: block;
clear: both;
}

#header .header_in .lang ul {
/*overflow: hidden;*/
float: right
}

#header .header_in .lang li {
float: left;
padding-left: 34px;
position: relative;
font-size: 1.6rem;
line-height: 1.3
}

#header .header_in .lang li+li:before {
content: '/';
display: block;
position: absolute;
top: 0;
bottom: 0;
left: 19px;
margin: auto 0
}

#header .header_in .gnav li a:after,
#header .header_in .gnav li span:after,
#header .header_in .gnav ul:after,
#header .header_in .lang li a:after,
#top_main:before {
content: ''
}

#header .header_in .lang li a {
position: relative
}

#header .header_in .lang li a:after {
position: absolute;
left: 0;
margin: 0 auto;
opacity: 0;
-webkit-transition: all .2s ease;
transition: all .2s ease
}

#header .header_in .lang li a:hover:after,
#header .header_in .lang li.active a:after {
opacity: 1
}

#header .header_in .lang li img {
vertical-align: middle;
margin-top: -2px
}

/*ツールチップ*/
#header .header_in .lang li:hover .tool {
opacity: 1;
}
#header .header_in .lang li.grayout a:after {
display: none;
}
#header .header_in .lang li.grayout a {
opacity: 0.5;
}

.tool {
display: block;
font-size: 10px;
background-color: #454445;
color: #fff;
border-radius: 3px;
padding: 6px 10px;
margin-top: 5px;
line-height: 1;
position: absolute;
top:18px;
right: 0;
width: 35px;
opacity: 0;
transition-duration: 0.3s;
}

.tool:after {
content:'▲';
display: block;
position: absolute;
top: -7px;
right: 5px;
color: #000;
}

#header .header_in .gnav ul {
/*padding-bottom: 15px*/
}

#header .header_in .gnav ul:after {
display: block;
clear: both
}

#header .header_in .gnav li {
float: left;
margin-left: 15px;
font-size: 1.8rem
}

#header .header_in .gnav li img {
vertical-align: middle
}

#header .header_in .gnav li > a,
#header .header_in .gnav li > span {
position: relative
}

#header .header_in .gnav li > a:after,
#header .header_in .gnav li.active span:after {
position: absolute;
left: 0;
bottom: 10px;
margin: 0 auto;
opacity: 0;
-webkit-transition: all .2s ease;
transition: all .2s ease
}

#header .header_in .gnav li > a:hover:after,
#header .header_in .gnav li.active > a:after,
#header .header_in .gnav li > span:hover:after,
#header .header_in .gnav li.active span:after {
opacity: 1
}

#top_foot .box .ban a:hover,
#top_service .list li:hover .img,
footer .scrool_top a:hover {
opacity: .8
}

#header .header_in .gnav li{
position: relative;
}

#header .header_in .gnav li > a,
#header .header_in .gnav li > span{
cursor: pointer;
display: inline-block;
padding-bottom: 15px;
}

#header .header_in .gnav li .list_in{
display: none;
position: absolute;
z-index: 999;
font-size: 14px;
text-align: center;
line-height: 1.15;
width: 160px;
top: 20px;
padding-top: 20px;
left: calc(50% - 80px);/* 要素の幅/2（160/2 = 80）+ 親要素の幅/2（17/2 = 8.5） */
cursor: pointer;
}


/*#header .header_in .gnav li:hover .list_in{
display: block;
}*/
#header .header_in .gnav li .list_in p{
background: #f5f5f5;
font-family: "Yu Gothic", YuGothic, "ヒラギノ角ゴ Pro W3", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "Lucida Grande", "Lucida Sans Unicode", Arial, Verdana, sans-serif;
}
#header .header_in .gnav li .list_in p a{
display: flex;
justify-content: center;
align-items: center;
height: 52px;
margin: 0 5px;
letter-spacing: 0.08em;
font-weight: bold;
}
#header .header_in .gnav li .list_in p + p a{
border-top: 1px solid #e6e6e6;
}
#header .header_in .gnav li .list_in p a:hover{
background: #eee;
}

@media screen and (max-width:1000px) {
#header .header_in .lang {
padding-bottom: 10px
}
#header .header_in .logo {
padding-top: 20px
}
#header .header_in .logo img {
width: 250px;
height: auto
}
#header .header_in .gnav li {
font-size: 1.6rem;
margin-left: 15px
}
#header .header_in .gnav li > a{
display: inline-block;
width: 34.3px;
}
#header .header_in .gnav li.service > span{width: 75.3px;}
#header .header_in .gnav li.company > a{width: 87.5px;}
#header .header_in .gnav li.ir > span{width: 15px;}
#header .header_in .gnav li.careers > a{width: 81.5px;}
#header .header_in .gnav li.contact > a{width: 81.5px;}
#header .header_in .gnav li a img,
#header .header_in .gnav li span img{
width: 100%;
height: auto;
}
/*#header .header_in .gnav li img {
height: 8.5px;
width: auto;
max-width: 100%;
min-width: 100%;
}*/
}

@media screen and (max-width:820px) {
#header .header_in .logo {
padding-left: 15px
}
#header .header_in .logo img {
width: 180px
}
}

#header .header_in .gnav li.contact {
margin-left: 57px
}

#header .header_in .gnav li.contact a {
color: #fff
}

#header .header_in .gnav li.contact a:after {
background: #fff
}

#header .header_in .fix_header_wrap {
-webkit-transition: all ease .2s;
transition: all ease .2s
}

#header .header_in .fix_header_wrap.fixed .fix_header{
max-width: 1366px;
margin: 0 auto;
}

#header .header_in .fix_header_wrap.fixed {
position: fixed;
top: 0;
left: 0;
width: 100%;
background: #fff;
z-index: 999;
border-bottom: solid 1px #e6e6e6
}

#header .header_in .fix_header_wrap.fixed .logo {
padding: 7px 0 10px 35px
}

#header .header_in .fix_header_wrap.fixed .logo img {
width: 250px;
height: auto
}

#header .header_in .fix_header_wrap.fixed .lang {
display: none
}

#header .header_in .fix_header_wrap.fixed .gnav ul {
padding: 0
}

#header .header_in .fix_header_wrap.fixed .gnav li {
/*padding: 15px 0*/
}

#header .header_in .fix_header_wrap.fixed .gnav li > a,
#header .header_in .fix_header_wrap.fixed .gnav li > span{
padding: 15px 0;
}

#header .header_in .fix_header_wrap.fixed .gnav li > a:after,
#header .header_in .fix_header_wrap.fixed .gnav li span:after {
bottom: 15px;
}

#header .header_in .fix_header_wrap.fixed .gnav li .list_in{
top: 40px;
}

#header .header_in .fix_header_wrap.fixed .gnav {
margin-right: 15px
}

#header .header_in .fix_header_wrap.fixed .gnav li.contact {
width: 150px;
background: #efae00;
margin-left: 30px;
text-align: center
}

@media screen and (max-width:980px) {
#header .header_in .fix_header_wrap.fixed .logo {
padding-left: 10px
}
#header .header_in .fix_header_wrap.fixed .logo img {
width: 180px
}
#header .header_in .fix_header_wrap.fixed .gnav li.contact {
margin-left: 15px
}
}

#top_main {
padding-top: 10px;
position: relative;
overflow: hidden
}

#top_main:before {
display: block;
position: absolute;
width: 100%;
height: 150px;
bottom: 0;
background:  left -127px no-repeat #efae00;
background-size: 60% 250px;
z-index: -1
}

#top_main .main {
position: relative;
max-width: 1366px;
margin: 0 auto
}

#top_main .main_tit {
position: absolute;
top: 350px;
z-index: 2
}

#top_main .main_img {
max-width: 1150px;
width: calc(100% - 172px - 43px);
height: 570px;
margin: 0 43px 0 auto;
background: url(../img/top/main_img.jpg) right center no-repeat;
background-size: cover;
position: relative;
z-index: 1
}

#top_main .main_video {
max-width: 5000px;
width: calc(100%);
height: calc(85%);
margin: 0 0 0 auto;
position: relative;
z-index: 1
}

@media screen and (max-width:900px) {
#top_main .main_tit {
top: auto;
bottom: 20%
}
#top_main .main_tit img {
width: 700px;
height: auto
}
#top_main .main_img {
width: calc(100% - 153px - 43px);
height: 380px;
margin: 0 43px 0 auto
}
}

#top_main .info_tit:after,
.top_tit:before {
top: 0;
right: 0;
content: ''
}

#top_main .info_box {
max-width: 1280px;
width: 96%;
margin: 0 auto;
color: #fff;
padding: 15px 0;
}

#top_main .info_box:after {
content: '';
display: block;
clear: both
}

#top_main .info_box a {
color: #fff;
text-decoration: none
}

#top_main .info_box a:hover {
text-decoration: underline
}

#top_main .info_tit {
width: 170px;
font-size: 1.8rem;
float: left;
position: relative
}

#top_main .info_tit:after {
display: block;
width: 20px;
height: 1px;
background: #fff;
position: absolute;
bottom: 0;
margin: auto 0
}

#top_main .info_tit img {
vertical-align: middle;
margin-top: -4px
}

#top_main .info_list {
-webkit-box-sizing: border-box;
box-sizing: border-box;
padding: 3px 0 0 12px;
float: right;
width: calc(100% - 170px);
font-size: 1.3rem;
letter-spacing: .1em
}

#top_main .info_list ul {
position: relative;
z-index: 0
}

#top_main .info_list li {
text-overflow: ellipsis;
white-space: nowrap;
display: none
}

#top_main .info_list li .tag {
display: inline-block;
background: #000;
color: #fff;
padding: 3px 14px 1px;
margin-right: 15px;
/*box-shadow: 0px 0px 3px 2px #051538;*/
border: solid 1px rgba(255,255,255,0.3);
}

#top_main .info_list li a {
display: inline-block;
padding-top: 2px
}

.top_tit {
position: relative;
padding-top: 80px;
line-height: 1.2
}

.top_tit:before {
display: block;
width: 1px;
height: 70px;
position: absolute;
background: #505050;
left: 0;
margin: 0 auto
}

.top_tit .tit {
font-size: 5.4rem;
letter-spacing: .2em;
text-align: center;
max-width: 1280px;
margin: 0 auto
}

.top_tit .tit img {
vertical-align: middle;
margin-top: -5px
}

#top_about {
padding-top: 10px;
margin-top: 40px;
background: #fff
}

#top_about .box {
max-width: 1050px;
width: 96%;
margin: 20px auto 0;
overflow: hidden
}

#top_about .box .col {
float: left;
width: 50%
}

#top_about .box .img img {
width: 95%;
height: 100%;
}

#top_about .box .txt_box {
margin-top: 30px;
text-align: center;
color: #454445;
max-width: 511px;
height: 511px;
background: url(../img/top/about_bg.png) left top no-repeat #efae00;
background-size: cover;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column
}

#top_about .box .txt_box .tit {
font-size: 2.4rem;
letter-spacing: .1em;
font-weight: 700
}

#top_about .box .txt_box .txt {
font-size: 1.6rem;
letter-spacing: .1em;
line-height: 1.5;
margin-top: 30px
}

@media screen and (max-width:930px) {
#top_about .box .txt_box {
height: 400px
}
#top_about .box .txt_box .tit {
font-size: 2rem
}
#top_about .box .txt_box .txt {
font-size: 1.3rem
}
}


#top_other {
    padding-top: 10px;
    margin-top: 40px;
    background: #fff
}

#top_other .box {
    max-width: 700px;
    width: 96%;
    margin: 20px auto 0;
    overflow: hidden
}

#top_other .box .col {
    float: left;
    width: 50%
}

#top_other .box .img img {
    width: 95%;
    height: 100%;
}

#top_other .box .txt_box {
    margin-top: 30px;
    text-align: center;
    color: #454445;
    max-width: 511px;
    height: 511px;
    background: url(../img/top/about_bg.png) left top no-repeat #efae00;
    background-size: cover;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column
}

#top_other .box .txt_box .tit {
    font-size: 2.4rem;
    letter-spacing: .1em;
    font-weight: 700
}

#top_other .box .txt_box .txt {
    font-size: 1.6rem;
    letter-spacing: .1em;
    line-height: 1.5;
    margin-top: 30px
}

@media screen and (max-width:930px) {
    #top_other .box .txt_box {
        height: 400px
    }
    #top_other .box .txt_box .tit {
        font-size: 2rem
    }
    #top_other .box .txt_box .txt {
        font-size: 1.3rem
    }
}


#top_service {
margin: -140px 0 0;
padding: 180px 0 60px;
background: url(../img/top/about_bg_top.png) left top no-repeat, url(../img/top/about_bg_bottom.png) right bottom no-repeat, url(../img/top/service_bg.jpg) center center no-repeat;
background-size: 100% 200px, 100% 200px, cover
}

#top_service .top_tit:before {
background: #fff
}

#top_service .top_tit .tit {
color: #fff
}

#top_service .list {
max-width: 1080px;
width: 96%;
margin: 20px auto
}

#top_service .list li {
position: relative
}

#top_service .list li:after {
content: '';
display: block;
width: calc(50% - 20px);
height: 350px;
background: #efae00;
position: absolute;
top: 10px;
left: 20px;
z-index: 1
}

#top_service .list li a {
display: table;
background: #fff;
margin: 0 30px;
position: relative;
z-index: 2;
text-decoration: none
}

#top_service .list li a>div {
display: table-cell;
vertical-align: middle
}

#top_service .list li+li {
margin-top: 30px
}

#top_service .list li:nth-child(even):after {
left: auto;
right: 20px
}

#top_service .list li:nth-child(even) a {
direction: rtl
}

#top_service .list .img {
padding: 10px;
-webkit-transition: all .1s ease;
transition: all .1s ease
}

#top_service .list .txtBox {
padding: 60px 0 90px 55px;
direction: ltr;
vertical-align: top
}

#top_service .list .tit {
font-size: 2.4rem;
line-height: 1.2;
letter-spacing: .1em;
position: relative
}

#top_info .box .tit,
#top_service .list .btn,
#top_service .list .tit span {
line-height: 1.1;
font-family: "Bank Gothic", Orbitron, "Lucida Grande", "Lucida Sans Unicode", Arial, Verdana, sans-serif;
font-weight: 100
}

#top_service .list .tit:before {
content: '';
display: block;
width: 40px;
height: 7px;
background: #454445;
position: absolute;
top: 0;
bottom: 0;
margin: auto 0;
left: -55px
}

#top_service .list .tit span {
display: block;
font-size: 1.8rem;
margin-top: 10px
}

#top_service .list .tit span img{
max-width: 100%;
}

#top_service .list .txt {
margin-top: 10px;
font-size: 1.6rem;
letter-spacing: .1em;
padding-right: 40px
}

#top_service .list .btn {
position: absolute;
font-size: 1.8rem;
bottom: 30px;
min-width: 300px;
text-align: center;
padding: 15px 0 14px;
border: 1px solid #1e1e1e;
background: url(../img/common/ico_arrow.png) right 20px center no-repeat #fff;
-webkit-transition: all .1s ease;
transition: all .1s ease
}

#top_service .list li:nth-child(odd) .btn {
right: -30px
}

#top_service .list li:nth-child(even) .btn {
left: -30px
}

#top_service .list li:hover .btn {
background: url(../img/common/ico_arrow.png) right 10px center no-repeat #fff
}

#top_service .list li .btn img {
vertical-align: middle;
margin-top: -4px
}

@media screen and (max-width:900px) {
#top_service .list .img {
width: 50%
}
#top_service .list .img img {
width: 100%
}
}

#top_info .box {
max-width: 1050px;
width: 96%;
margin: 40px auto 0;
overflow: hidden
}

#top_info .box .col {
float: left;
width: calc(50% - 11px)
}

#top_info .box .col.ir {
margin-left: 22px
}

#top_info .box .tit {
font-size: 3.2rem;
letter-spacing: .1em;
text-align: center;
padding-bottom: 10px;
border-bottom: solid 4px #efae00;
margin-bottom: 30px
}

#top_info .box .tit img {
vertical-align: middle;
margin-top: -5px
}

#top_info .box .col.ir .tit {
border-bottom: solid 4px #454445
}

#top_info .box .list li a {
display: block;
text-decoration: none
}

#top_info .box .list li a:hover {
text-decoration: underline
}

#top_info .box .list li+li {
margin-top: 25px;
padding-top: 25px;
border-top: solid 1px #c8c8c8
}

#top_info .box .list li .meta {
font-size: 1.4rem;
letter-spacing: .1em;
margin-bottom: 7px
}

#top_info .box .list li .meta span {
display: inline-block;
font-size: 1.3rem;
line-height: 1.5;
letter-spacing: .1em;
/*border: 1px solid #c8c8c8;*/
min-width: 138px;
text-align: center;
-webkit-box-sizing: border-box;
box-sizing: border-box;
padding: 2px 5px 1px;
margin-left: 10px;
color: #fff;
}

#top_contact .btn a,
#top_info .box .btn a {
display: block;
border: 1px solid #1e1e1e;
-webkit-transition: all .1s ease;
text-align: center
}

#top_info .box .list li .txt {
font-size: 1.4rem;
line-height: 1.7;
letter-spacing: .1em;
}

#top_info .box .list li a.pdf{
padding-right: 35px;
background: url(../img/ir/news/icon_pdf.png) right 6px center no-repeat;
background-size: 23px;
}

#top_info .box .list li a.link_m{
padding-right: 30px;
background: url(../img/ir/news/icon_link.png) right 6px center no-repeat;
background-size: 23px;
}

/*#top_info .box .list li a.pdf .txt:after {
content: '';
display: inline-block;
background: url(../img/ir/news/icon_pdf.png) center no-repeat;
width: 20px;
height: 24px;
background-size: 20px auto;
margin: -3px 0 -5px 5px;
position: relative;
bottom: -2px;
}

#top_info .box .list li a.link_m .txt:after {
content: '';
display: inline-block;
background: url(../img/ir/news/icon_link.png) right center no-repeat;
width: 20px;
height: 24px;
background-size: 20px auto;
margin: -3px 0 -5px 5px;
position: relative;
bottom: -2px;
}*/

#top_contact .btn a,
#top_foot .box .ban a,
#top_info .box .btn a {
line-height: 1.1;
display: block;
font-family: "Bank Gothic", Orbitron, "Lucida Grande", "Lucida Sans Unicode", Arial, Verdana, sans-serif;
font-weight: 100;
text-decoration: none
}

#top_info .box .btn a {
width: calc(100% - 4px);
font-size: 1.8rem;
padding: 15px 0 14px;
background: url(../img/common/ico_arrow.png) right 20px center no-repeat #fff;
transition: all .1s ease;
margin-top: 25px
}

#top_info .box .btn a img {
vertical-align: middle;
margin-top: -5px
}

#top_info .box .btn a:hover {
background: url(../img/common/ico_arrow.png) right 10px center no-repeat #fff
}

#top_foot .box {
overflow: hidden;
margin-top: 120px
}

#top_foot .box .ban {
float: left;
width: 50%
}

#top_foot .box .ban a {
color: #fff;
font-size: 3.6rem;
padding: 40px 0 40px 66px;
-webkit-transition: all .4s ease;
transition: all .4s ease;
position: relative;
background-size: cover
}

#top_foot .box .ban a img {
vertical-align: middle;
margin-top: -3px
}

#top_foot .box .ban.careers a {
background: url(../img/top/foot_careers.jpg) center center no-repeat;
background-size: cover
}

#top_foot .box .ban.company a {
background: url(../img/top/foot_company.jpg) center center no-repeat;
background-size: cover
}

#top_foot .box .ban a:after {
position: absolute;
top: 0;
bottom: 0;
right: 45px;
margin: auto 0;
content: '';
display: block;
width: 43px;
height: 26px;
background: url(../img/top/foot_ico.png) right top no-repeat;
-webkit-transition: all .4s ease;
transition: all .4s ease
}

#top_foot .box .ban a:hover:after {
right: 30px
}

#top_contact {
padding-top: 75px;
max-width: 96%;
margin: 0 auto
}

#top_contact .top_tit {
padding-top: 0
}

#top_contact .top_tit:before {
content: normal
}

#top_contact .txt {
max-width: 733px;
text-align: center;
margin: 10px auto 0
}

#top_contact .btn a {
font-size: 1.8rem;
padding: 15px 0 14px;
background: url(../img/common/ico_arrow_w.png) right 20px center no-repeat #000;
transition: all .1s ease;
max-width: 481px;
margin: 25px auto 0;
color: #fff
}

#top_contact .btn a:hover {
background: url(../img/common/ico_arrow_w.png) right 10px center no-repeat #000
}

#top_contact .btn img {
vertical-align: middle;
margin-top: -4px
}

footer .scrool_top {
margin-top: 100px
}

footer .scrool_top a {
display: block;
height: 50px;
background: #454445;
font-size: 0;
line-height: 0;
color: #454445;
position: relative;
-webkit-transition: all .1s ease;
transition: all .1s ease
}

footer .scrool_top a:after {
position: absolute;
content: '';
display: block;
top: 0;
bottom: -2px;
right: 0;
left: 0;
margin: auto;
width: 10px;
height: 10px;
border-top: 1px solid #fff;
border-right: 1px solid #fff;
-webkit-transform: rotate(-45deg);
transform: rotate(-45deg);
-ms-transform: rotate(-45deg);
transition: all .3s ease;
-webkit-transition: all .3s ease
}

footer .scrool_top a:hover:after {
bottom: 10px
}

footer .footer_in {
overflow: hidden;
max-width: 950px;
width: 96%;
margin: 0 auto;
padding: 50px 0
}

footer .footer_in .logo {
float: left;
margin-right: 100px
}

footer .footer_in .logo .lang ul {
/*overflow: hidden;*/
text-align: center;
letter-spacing: -.4em
}

footer .footer_in .logo .lang li {
display: inline-block;
position: relative;
letter-spacing: normal;
font-size: 1.6rem;
line-height: 1.3;
font-family: "Bank Gothic", Orbitron, "Lucida Grande", "Lucida Sans Unicode", Arial, Verdana, sans-serif;
font-weight: 100
}

footer .footer_in .logo .lang li img {
vertical-align: middle;
margin-top: -2px
}

footer .footer_in .logo .lang li+li {
padding-left: 30px
}

footer .footer_in .logo .lang li+li:before {
content: '/';
display: block;
position: absolute;
top: 0;
bottom: 0;
left: 15px;
margin: auto 0
}

footer .footer_in .logo .lang li a {
position: relative;
text-decoration: none
}

footer .footer_in .logo .lang li a:after {
content: '';
display: block;
width: 20px;
height: 2px;
background: #efae00;
position: absolute;
bottom: 0;
left: 0;
right: 0;
margin: 0 auto;
opacity: 0;
-webkit-transition: all .2s ease;
transition: all .2s ease
}

footer .footer_in .logo .lang li a:hover:after,
footer .footer_in .logo .lang li.active a:after {
opacity: 1
}

footer .footer_in .sitemp {
float: left;
overflow: hidden;
width: calc(100% - 354px)
}

footer .footer_in .sitemp a,
footer .footer_in .sitemp span {
text-decoration: none;
font-size: 1.4rem;
font-weight: 700;
color: #1e1e1e
}

footer .footer_in .sitemp a:hover {
text-decoration: underline
}

footer .footer_in .sitemp .col {
float: left
}

footer .footer_in .sitemp .col+.col {
margin-left: 10%
}

footer .footer_in .sitemp .row+.row {
padding-top: 10px
}

footer .footer_in .sitemp li {
line-height: 1.5
}

footer .footer_in .sitemp li a {
font-size: 1.2rem;
font-weight: 400;
letter-spacing: .1em
}

/*ツールチップ*/
footer .footer_in .logo .lang li:hover .tool {
opacity: 1;
}
footer .footer_in .logo .lang li.grayout a:after {
display: none;
}
footer .footer_in .logo .lang li.grayout a {
opacity: 0.5;
}


@media screen and (max-width:980px) {
footer .footer_in .sitemp .col {
width: 23%
}
}

footer .footer_in .copy {
font-size: 1.2rem;
clear: both;
text-align: center;
padding-top: 20px
}

@media screen and (min-width:769px) {
.pcNone {
display: none
}
}

@media screen and (max-width:768px) {
#top_main .info_box,
.sp_gnav {
-webkit-box-sizing: border-box
}
.sp_gnav .lang li,
.sp_gnav .row>a,
.sp_gnav .row>span {
line-height: 1.3;
font-family: "Bank Gothic", Orbitron, "Lucida Grande", "Lucida Sans Unicode", Arial, Verdana, sans-serif;
font-weight: 100
}
body {
padding-top: 50px
}
.spNone {
display: none
}
#header .sp_header {
overflow: hidden
}
#header .sp_header .line {
position: absolute;
width: 50px;
height: 450px;
right: 0;
top: 0;
background: #efae00
}
#header .sp_header_in {
position: fixed;
width: 100%;
background: #fff;
z-index: 999;
top: 0;
left: 0
}
#header .sp_header .logo {
float: left;
padding: 8px 0 0 7px
}
#header .sp_header .logo img {
width: 160px;
height: auto
}
#header .sp_header .menu {
float: right;
width: 50px;
background: #efae00;
position: relative
}
#header .sp_header .menu:after {
content: '';
display: block;
padding-top: calc(100% - 15px)
}
#header .sp_header .menu p {
margin-top: 15px;
position: relative;
z-index: 9999
}
#header .sp_header .menu span {
display: block;
width: 30px;
height: 3px;
background: #fff;
position: absolute;
margin: 0 auto;
left: 0;
right: 0;
-webkit-transition: all .3s ease;
transition: all .3s ease
}
#header .sp_header .menu span:nth-child(1) {
top: 0
}
#header .sp_header .menu span:nth-child(2) {
top: 8px
}
#header .sp_header .menu span:nth-child(3) {
top: 16px
}
.sp_gnav_wrap {
width: 100%;
height: 100vh;
top: 0;
position: fixed;
z-index: 9999;
overflow-y: scroll;
-webkit-overflow-scrolling: touch
}
#top_foot .box,
#top_service,
body.menuIn {
overflow: hidden
}
.sp_gnav_wrap .close p {
position: absolute;
top: 10px;
right: 10px;
-webkit-transform: rotate(45deg);
-ms-transform: rotate(45deg);
transform: rotate(45deg);
width: 50px;
height: 50px;
border-radius: 50%
}
.sp_gnav_wrap .close span {
content: '';
display: block;
width: 30px;
height: 3px;
background: #fff;
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
margin: auto;
-webkit-transition: all .1s ease;
transition: all .1s ease
}
.sp_gnav_wrap .close span+span {
-webkit-transform: rotate(90deg);
-ms-transform: rotate(90deg);
transform: rotate(90deg)
}
.sp_gnav {
box-sizing: border-box;
width: calc(100% - 30px);
background: url(../img/common/sp_menu_bg.png) left top no-repeat #454445;
background-size: 100% auto;
margin-left: 30px;
padding: 50px 0 100px 30px;
min-height: 100%
}
.sp_gnav,
.sp_gnav a {
color: #fff;
text-decoration: none
}
.sp_gnav .row>a,
.sp_gnav .row>span {
display: block;
font-size: 2rem;
border-bottom: solid 1px rgba(255, 255, 255, .25);
padding: 15px 0 13px;
position: relative
}
.sp_gnav .row>a>img,
.sp_gnav .row>span>img {
margin-top: 7px
}
.sp_gnav .row>span:after,
.sp_gnav .row>span:before {
content: '';
display: block;
width: 20px;
height: 1px;
background: #fff;
position: absolute;
right: 15px;
top: 0;
bottom: 0;
margin: auto 0;
-webkit-transition: all .1s ease;
transition: all .1s ease
}
.sp_gnav .row>span:after {
-webkit-transform: rotate(90deg);
-ms-transform: rotate(90deg);
transform: rotate(90deg)
}
.sp_gnav .row.active>span {
border-bottom: none
}
.sp_gnav .row.active>span:after {
-webkit-transform: rotate(0);
-ms-transform: rotate(0);
transform: rotate(0)
}
.sp_gnav .row ul {
display: none
}
.sp_gnav .row li a {
display: block;
font-size: 1.4rem;
background: rgba(0, 0, 0, .35);
padding: 12px 15px 10px 30px;
position: relative
}
.sp_gnav .row li+li a:before {
content: '';
position: absolute;
top: 0;
right: 0;
width: calc(100% - 30px);
border-top: solid 1px rgba(255, 255, 255, .25)
}
.sp_gnav .bottom ul {
margin-top: 20px
}
.sp_gnav .bottom ul li {
font-size: 1.4rem;
margin-top: 8px
}
.sp_gnav .lang ul {
overflow: hidden;
text-align: center;
letter-spacing: -.4em;
padding: 2px 5px 5px;
margin-top: 20px;
border: 1px solid #fff;
margin-right: 30px
}
.sp_gnav .lang li {
display: inline-block;
position: relative;
letter-spacing: normal;
font-size: 1.8rem
}
.sp_gnav .lang li+li {
padding-left: 30px;
opacity: 0.3;
}
.sp_gnav .lang li+li:before {
content: '/';
display: block;
position: absolute;
top: 0;
bottom: 0;
left: 15px;
margin: auto 0
}
.sp_gnav .lang li a {
position: relative;
text-decoration: none
}
.sp_gnav .lang li a img {
margin-top: 7px
}
.sp_gnav .lang li a:after {
content: '';
display: block;
width: 20px;
height: 2px;
background: #efae00;
position: absolute;
bottom: 0;
left: 0;
right: 0;
margin: 0 auto;
opacity: 0;
-webkit-transition: all .2s ease;
transition: all .2s ease
}
.sp_gnav .lang li a:hover:after,
.sp_gnav .lang li.active a:after {
opacity: 1
}
.sp_gnav_wrap {
-webkit-transition: all .3s ease;
transition: all .3s ease;
left: 100%
}
body.menuIn .sp_gnav_wrap {
left: 0
}
.sp_gnav_overlay {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100vh;
background: rgba(0, 0, 0, .8);
z-index: 9998;
display: none
}
#top_main {
padding-top: 5px
}
#top_main:before {
display: none
}
#top_main .main_tit {
bottom: -13%;
width: 82%
}
#top_main .main_tit img {
width: 100%;
max-width: 345px;
height: auto
}
#top_main .main_img {
width: calc(100% - 10px);
height: 190px;
margin: 0 0 0 auto
}
#top_main .info_box {
box-sizing: border-box;
width: 100%;
padding: 40px 5% 15px;
margin-top: 30px;
background: url(../img/top/main_bg_sp.png) left top no-repeat;
background-size: 100% 100%
}
#top_main .info_tit {
width: auto;
font-size: 1.6rem;
float: none
}
#top_main .info_tit span {
display: inline-block;
padding-right: 10px;
background: #454445;
position: relative;
z-index: 1
}
#top_main .info_tit:after {
width: 100%;
z-index: 0
}
#top_main .info_list {
padding: 0;
float: none;
width: 100%;
font-size: 1.1rem
}
#top_main .info_list li {
white-space: normal;
line-height: 1.25
}
#top_main .info_list li .tag {
padding: 2px 10px;
margin: 0 0 5px
}
#top_main .info_list li a {
display: inline-block
}
.top_tit {
padding-top: 30px
}
.top_tit:before {
content: '';
display: block;
width: 1px;
height: 30px
}
.top_tit .tit {
font-size: 3rem;
letter-spacing: .15em
}
.top_tit .tit img {
height: 17px;
width: auto
}
#top_about {
padding-top: 10px;
margin-top: 10px;
background: #fff
}
#top_about .box {
width: 96%;
margin-top: 10px
}
#top_about .box .col {
float: none;
width: 100%
}
#top_about .box .img {
width: 85%;
margin: 0 auto;
position: relative;
z-index: 1
}
#top_about .box .txt_box {
color: #454445;
width: 90%;
height: auto;
background: url(../img/top/about_bg.png) left top no-repeat #efae00;
background-size: cover;
display: block;
position: relative;
z-index: 0;
padding: 60px 10px 30px;
margin: 20px auto 0
}
#top_about .box .txt_box .tit {
font-size: 1.7rem
}
#top_about .box .txt_box .txt {
width: 90%;
margin: 10px auto 0;
font-size: 1.2rem;
text-align: left
}
#top_service {
margin: -70px 0 0;
padding: 90px 0 60px;
background: url(../img/top/about_bg_top.png) left top no-repeat, url(../img/top/about_bg_bottom.png) right bottom no-repeat, url(../img/top/service_bg.jpg) top center no-repeat #000;
background-size: 100% 50px, 100% 50px, 150% auto
}
#top_service .list {
margin: 10px auto
}
#top_service .list li:after {
width: 100%;
height: 210px;
top: 5px!important;
left: 0!important
}
#top_service .list li a {
display: block;
margin: 0 5px
}
#top_service .list li a>div {
display: block
}
#top_service .list li+li {
margin-top: 50px
}
#top_service .list li:nth-child(even) a {
direction: ltr
}
#top_service .list .img {
-webkit-box-sizing: border-box;
box-sizing: border-box;
padding: 5px;
width: 100%
}
#top_service .list .txtBox {
padding: 10px 25px 0
}
#top_service .list .tit {
font-size: 1.8rem
}
#top_service .list .tit:before {
width: 15px;
height: 5px;
left: -25px
}
#top_service .list .tit span {
font-size: 1.4rem;
letter-spacing: .05em;
margin-top: 7px
}
#top_service .list .tit span img {
height: 8.5px;
width: auto
}
#top_service .list li+li .tit span img {
height: 25px;
}
#top_service .list .txt {
margin-top: 5px;
font-size: 1.2rem;
padding-right: 0
}
#top_service .list .btn {
position: relative;
font-size: 1.6rem;
min-width: 0;
padding: 10px 0;
background-size: 15px auto;
margin-top: -5px;
bottom: -15px;
right: 0!important;
left: 0!important
}
#top_info .box {
width: 96%;
margin: 20px auto 0
}
#top_info .box .col {
float: none;
width: 96%;
margin: 0 auto
}
#top_info .box .col.ir {
margin: 30px auto 0
}
#top_info .box .tit {
font-size: 2.1rem;
padding-bottom: 10px;
border-bottom: solid 2px #efae00;
margin-bottom: 20px
}
#top_info .box .tit img {
height: 12px;
width: auto
}
#top_info .box .col.ir .tit {
border-bottom: solid 2px #454445
}
#top_info .box .list li {
height: auto!important;
}
#top_info .box .list li+li {
margin-top: 15px;
padding-top: 15px;
border-top: solid 1px #c8c8c8
}
#top_info .box .list li .meta {
font-size: 1.3rem;
letter-spacing: .05em;
margin-bottom: 7px
}
#top_info .box .list li .meta span {
margin-left: 5px
}
#top_info .box .list li .txt {
font-size: 1.3rem;
line-height: 1.6;
letter-spacing: .05em
}
#top_info .box .list li a{
height: auto!important;
}
#top_info .box .list li a .txt:after {
margin-left: 2px !important;
}
#top_info .box .btn a {
font-size: 1.6rem;
padding: 10px 0;
margin-top: 25px;
background-size: 15px auto
}
#top_foot .box {
margin-top: 45px
}
#top_foot .box .ban {
float: none;
width: 100%
}
#top_foot .box .ban img {
height: 16px;
width: auto
}
#top_foot .box .ban a {
font-size: 2.5rem;
letter-spacing: .1em;
padding: 25px 0;
text-align: center
}
#top_foot .box .ban.careers a {
margin-bottom: 1px
}
#top_foot .box .ban a:hover {
opacity: .8
}
#top_foot .box .ban a:after {
right: 12px;
width: 22px;
height: 13px;
background-size: 22px auto
}
#top_foot .box .ban a:hover:after {
right: 12px
}
#top_contact {
padding-top: 30px;
max-width: 96%;
margin: 0 auto
}
#top_contact .top_tit {
padding-top: 0
}
#top_contact .top_tit:before {
content: normal
}
#top_contact .txt {
font-size: 1.4rem;
width: 96%;
text-align: left
}
#top_contact .btn a {
font-size: 1.6rem;
text-align: center;
padding: 10px 0;
background-size: 15px auto;
max-width: 96%;
margin: 15px auto 0
}
#top_contact .btn img {
margin-top: -2px
}
footer .scrool_top {
margin-top: 30px
}
footer .footer_in {
padding: 25px 0 15px
}
footer .footer_in .logo {
float: none;
margin: 0 auto;
text-align: center
}
footer .footer_in .logo img {
width: 150px;
height: auto
}
footer .footer_in .logo .lang,
footer .footer_in .sitemp {
display: none
}
footer .footer_in .copy {
font-size: 1rem;
clear: both;
text-align: center;
padding-top: 15px
}
}

.info_box{
overflow: hidden;
}
.info_list {
position: relative;
/*overflow: hidden;*/
}
.info_list:after {
position: absolute;
content: "";
background: -moz-linear-gradient(left, rgba(0,36,115,0) 0%, rgba(0,36,115,1) 100%);
background: -webkit-linear-gradient(left, rgba(0,36,115,0) 0%,rgba(0,36,115,1) 100%);
background: linear-gradient(to right, rgba(0,36,115,0) 0%,rgba(0,36,115,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00454445', endColorstr='#454445',GradientType=1 );
width: 10em;
height: 200%;
right: 0;
top: -50%;
}
@media screen and (max-width:768px) {

#top_main .info_list {
height: 7em!important;
padding-top: 1em;
}
#top_main .info_list li a {
line-height: 1.5;
}
.info_list:after {
content: none;
}
#top_main .info_list li {
font-size: 13px;
}

}
@media screen and (max-width:504px) {

#top_main .info_list li {
font-size: 11px;
}

}
@media screen and (max-width:430px) {

#top_main .info_list {
padding-top: 0;
}

}

.accessory {
width: 1200px;
height: 540px;
margin: 0 auto;
text-align: center;
}

.accessory .accessoryTitle {
width: 1200px;
height: 141px;
margin: 0 auto;
padding: 40px 0 30px;
box-sizing: border-box;
}
@charset "UTF-8";

/*! normalize.css v3.0.2 | MIT License | git.io/normalize */

abbr,
acronym,
fieldset,
img,
input,
legend {
border: 0
}

a,
a:active,
a:hover,
input {
outline: 0
}

#header .header_in:after,
q:after,
q:before {
content: ''
}

html {
font-family: sans-serif;
-ms-text-size-adjust: 100%;
-webkit-text-size-adjust: 100%
}

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

audio,
canvas,
progress,
video {
display: inline-block;
vertical-align: baseline
}

audio:not([controls]) {
display: none;
height: 0
}

[hidden],
template {
display: none
}

a {
background-color: transparent
}

abbr[title] {
border-bottom: 1px dotted
}

b,
optgroup,
strong {
font-weight: 700
}

mark {
background: #ff0;
color: #000
}

small {
font-size: 80%
}

sub,
sup {
font-size: 75%;
line-height: 0;
position: relative;
vertical-align: baseline
}

sup {
top: -.5em
}

sub {
bottom: -.25em
}

svg:not(:root) {
overflow: hidden
}

figure {
margin: 1em 40px
}

hr {
-webkit-box-sizing: content-box;
box-sizing: content-box;
height: 0
}

pre,
textarea {
overflow: auto
}

code,
kbd,
pre,
samp {
font-family: monospace;
font-size: 1em
}

button,
input,
optgroup,
select,
textarea {
color: inherit;
font: inherit;
margin: 0
}

a,
body,
input {
color: #454445
}

button {
overflow: visible
}

button,
select {
text-transform: none
}

button,
html input[type=button],
input[type=reset],
input[type=submit] {
-webkit-appearance: button;
cursor: pointer
}

button[disabled],
html input[disabled] {
cursor: default
}

button::-moz-focus-inner,
input::-moz-focus-inner {
border: 0;
padding: 0
}

input {
line-height: normal
}

input[type=checkbox],
input[type=radio] {
-webkit-box-sizing: border-box;
box-sizing: border-box;
padding: 0
}

input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {
height: auto
}

input[type=search] {
-webkit-appearance: textfield;
-webkit-box-sizing: content-box;
box-sizing: content-box
}

input[type=search]::-webkit-search-cancel-button,
input[type=search]::-webkit-search-decoration {
-webkit-appearance: none
}

legend {
padding: 0
}

blockquote,
body,
dd,
div,
dl,
dt,
fieldset,
form,
h1,
h2,
h3,
h4,
h5,
h6,
input,
li,
ol,
p,
pre,
td,
textarea,
th,
ul {
margin: 0;
padding: 0
}

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

address,
caption,
cite,
code,
dfn,
th,
var {
font-style: normal
}

ol,
ul {
list-style: none
}

caption,
th {
text-align: left
}

h1,
h2,
h3,
h4,
h5,
h6 {
font-size: 100%;
text-align: left
}

a,
img {
vertical-align: top;
display: inline-block;
}

@font-face {
font-family: "Bank Gothic";
src: url(../font/bankgothicltbtlight.eot) format("eot"), url(../font/bankgothicltbtlight.woff) format("woff")
}

html {
font-size: 62.5%
}

body {
margin: 0;
width: 100%;
font-size: 1.6rem;
line-height: 1.75;
font-family: "Yu Gothic", YuGothic, "ヒラギノ角ゴ Pro W3", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "Lucida Grande", "Lucida Sans Unicode", Arial, Verdana, sans-serif;
/*word-break: break-all*/
word-break: normal;
}

#header .header_in .right,
#top_main .info_tit,
.top_tit .tit {
font-family: "Bank Gothic", Orbitron, "Lucida Grande", "Lucida Sans Unicode", Arial, Verdana, sans-serif;
font-weight: 100
}

a,
input {
text-decoration: none
}

a,
a:active,
a:hover,
a:link,
a:visited {
text-decoration: none
}

#header .header_in {
-webkit-box-sizing: border-box;
box-sizing: border-box;
max-width: 1366px;
padding-right: 43px;
margin: 0 auto;
position: relative;
overflow: visible
}

#header .header_in .line {
display: block;
width: 150px;
position: absolute;
height: 860px;
right: 15px;
top: 0;
background: #efae00;
z-index: -1
}

#header .header_in .gnav li > a:after,
#header .header_in .gnav li.active span:after,
#header .header_in .lang li a:after {
display: block;
width: 20px;
height: 2px;
background: #efae00;
right: 0;
bottom: 0
}

#header .header_in:after {
display: block;
clear: both
}

#header .header_in .logo {
float: left;
padding-top: 40px;
padding-left: 35px
}

#header .header_in .right {
float: right;
color: #1e1e1e
}

#header .header_in .right a {
text-decoration: none
}

#header .header_in .lang {
/*overflow: hidden;*/
padding: 15px 0 30px;
margin-right: 150px
}
#header .header_in .lang:after{
content: '';
display: block;
clear: both;
}

#header .header_in .lang ul {
/*overflow: hidden;*/
float: right
}

#header .header_in .lang li {
float: left;
padding-left: 34px;
position: relative;
font-size: 1.6rem;
line-height: 1.3
}

#header .header_in .lang li+li:before {
content: '/';
display: block;
position: absolute;
top: 0;
bottom: 0;
left: 19px;
margin: auto 0
}

#header .header_in .gnav li a:after,
#header .header_in .gnav li span:after,
#header .header_in .gnav ul:after,
#header .header_in .lang li a:after,
#top_main:before {
content: ''
}

#header .header_in .lang li a {
position: relative
}

#header .header_in .lang li a:after {
position: absolute;
left: 0;
margin: 0 auto;
opacity: 0;
-webkit-transition: all .2s ease;
transition: all .2s ease
}

#header .header_in .lang li a:hover:after,
#header .header_in .lang li.active a:after {
opacity: 1
}

#header .header_in .lang li img {
vertical-align: middle;
margin-top: -2px
}

/*ツールチップ*/
#header .header_in .lang li:hover .tool {
opacity: 1;
}
#header .header_in .lang li.grayout a:after {
display: none;
}
#header .header_in .lang li.grayout a {
opacity: 0.5;
}

.tool {
display: block;
font-size: 10px;
background-color: #454445;
color: #fff;
border-radius: 3px;
padding: 6px 10px;
margin-top: 5px;
line-height: 1;
position: absolute;
top:18px;
right: 0;
width: 35px;
opacity: 0;
transition-duration: 0.3s;
}

.tool:after {
content:'▲';
display: block;
position: absolute;
top: -7px;
right: 5px;
color: #000;
}

#header .header_in .gnav ul {
/*padding-bottom: 15px*/
}

#header .header_in .gnav ul:after {
display: block;
clear: both
}

#header .header_in .gnav li {
float: left;
margin-left: 15px;
font-size: 1.8rem
}

#header .header_in .gnav li img {
vertical-align: middle
}

#header .header_in .gnav li > a,
#header .header_in .gnav li > span {
position: relative
}

#header .header_in .gnav li > a:after,
#header .header_in .gnav li.active span:after {
position: absolute;
left: 0;
bottom: 10px;
margin: 0 auto;
opacity: 0;
-webkit-transition: all .2s ease;
transition: all .2s ease
}

#header .header_in .gnav li > a:hover:after,
#header .header_in .gnav li.active > a:after,
#header .header_in .gnav li > span:hover:after,
#header .header_in .gnav li.active span:after {
opacity: 1
}

#top_foot .box .ban a:hover,
#top_service .list li:hover .img,
footer .scrool_top a:hover {
opacity: .8
}

#header .header_in .gnav li{
position: relative;
}

#header .header_in .gnav li > a,
#header .header_in .gnav li > span{
cursor: pointer;
display: inline-block;
padding-bottom: 15px;
}

#header .header_in .gnav li .list_in{
display: none;
position: absolute;
z-index: 999;
font-size: 14px;
text-align: center;
line-height: 1.15;
width: 160px;
top: 20px;
padding-top: 20px;
left: calc(50% - 80px);/* 要素の幅/2（160/2 = 80）+ 親要素の幅/2（17/2 = 8.5） */
cursor: pointer;
}


/*#header .header_in .gnav li:hover .list_in{
display: block;
}*/
#header .header_in .gnav li .list_in p{
background: #f5f5f5;
font-family: "Yu Gothic", YuGothic, "ヒラギノ角ゴ Pro W3", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "Lucida Grande", "Lucida Sans Unicode", Arial, Verdana, sans-serif;
}
#header .header_in .gnav li .list_in p a{
display: flex;
justify-content: center;
align-items: center;
height: 52px;
margin: 0 5px;
letter-spacing: 0.08em;
font-weight: bold;
}
#header .header_in .gnav li .list_in p + p a{
border-top: 1px solid #e6e6e6;
}
#header .header_in .gnav li .list_in p a:hover{
background: #eee;
}

@media screen and (max-width:1000px) {
#header .header_in .lang {
padding-bottom: 10px
}
#header .header_in .logo {
padding-top: 20px
}
#header .header_in .logo img {
width: 250px;
height: auto
}
#header .header_in .gnav li {
font-size: 1.6rem;
margin-left: 20px
}
#header .header_in .gnav li > a{
display: inline-block;
width: 34.3px;
}
#header .header_in .gnav li.service > span{width: 75.3px;}
#header .header_in .gnav li.company > a{width: 87.5px;}
#header .header_in .gnav li.ir > span{width: 15px;}
#header .header_in .gnav li.careers > a{width: 81.5px;}
#header .header_in .gnav li.contact > a{width: 81.5px;}
#header .header_in .gnav li a img,
#header .header_in .gnav li span img{
width: 100%;
height: auto;
}
/*#header .header_in .gnav li img {
height: 8.5px;
width: auto;
max-width: 100%;
min-width: 100%;
}*/
}

@media screen and (max-width:820px) {
#header .header_in .logo {
padding-left: 15px
}
#header .header_in .logo img {
width: 180px
}
}

#header .header_in .gnav li.contact {
margin-left: 57px
}

#header .header_in .gnav li.contact a {
color: #fff
}

#header .header_in .gnav li.contact a:after {
background: #fff
}

#header .header_in .fix_header_wrap {
-webkit-transition: all ease .2s;
transition: all ease .2s
}

#header .header_in .fix_header_wrap.fixed .fix_header{
max-width: 1366px;
margin: 0 auto;
}

#header .header_in .fix_header_wrap.fixed {
position: fixed;
top: 0;
left: 0;
width: 100%;
background: #fff;
z-index: 999;
border-bottom: solid 1px #e6e6e6
}

#header .header_in .fix_header_wrap.fixed .logo {
padding: 7px 0 10px 35px
}

#header .header_in .fix_header_wrap.fixed .logo img {
width: 250px;
height: auto
}

#header .header_in .fix_header_wrap.fixed .lang {
display: none
}

#header .header_in .fix_header_wrap.fixed .gnav ul {
padding: 0
}

#header .header_in .fix_header_wrap.fixed .gnav li {
/*padding: 15px 0*/
}

#header .header_in .fix_header_wrap.fixed .gnav li > a,
#header .header_in .fix_header_wrap.fixed .gnav li > span{
padding: 15px 0;
}

#header .header_in .fix_header_wrap.fixed .gnav li > a:after,
#header .header_in .fix_header_wrap.fixed .gnav li span:after {
bottom: 15px;
}

#header .header_in .fix_header_wrap.fixed .gnav li .list_in{
top: 40px;
}

#header .header_in .fix_header_wrap.fixed .gnav {
margin-right: 15px
}

#header .header_in .fix_header_wrap.fixed .gnav li.contact {
width: 150px;
background: #efae00;
margin-left: 30px;
text-align: center
}

@media screen and (max-width:980px) {
#header .header_in .fix_header_wrap.fixed .logo {
padding-left: 10px
}
#header .header_in .fix_header_wrap.fixed .logo img {
width: 180px
}
#header .header_in .fix_header_wrap.fixed .gnav li.contact {
margin-left: 15px
}
}

#top_main {
padding-top: 10px;
position: relative;
overflow: hidden
}

#top_main:before {
display: block;
position: absolute;
width: 100%;
height: 150px;
bottom: 0;
background: left -127px no-repeat #efae00;
background-size: 60% 250px;
z-index: -1
}

#top_main .main {
position: relative;
max-width: 1366px;
margin: 0 auto
}

#top_main .main_tit {
position: absolute;
top: 350px;
z-index: 2
}

#top_main .main_img {
max-width: 1150px;
width: calc(100% - 172px - 43px);
height: 570px;
margin: 0 43px 0 auto;
background: url(../img/top/main_img.jpg) right center no-repeat;
background-size: cover;
position: relative;
z-index: 1
}

#top_main .main_video {
max-width: 5000px;
width: calc(100%);
height: calc(85%);
margin: 0 0 0 auto;
position: relative;
z-index: 1
}

@media screen and (max-width:900px) {
#top_main .main_tit {
top: auto;
bottom: 20%
}
#top_main .main_tit img {
width: 700px;
height: auto
}
#top_main .main_img {
width: calc(100% - 153px - 43px);
height: 380px;
margin: 0 43px 0 auto
}
}

#top_main .info_tit:after,
.top_tit:before {
top: 0;
right: 0;
content: ''
}

#top_main .info_box {
max-width: 1280px;
width: 96%;
margin: 0 auto;
color: #fff;
padding: 15px 0;
}

#top_main .info_box:after {
content: '';
display: block;
clear: both
}

#top_main .info_box a {
color: #fff;
text-decoration: none
}

#top_main .info_box a:hover {
text-decoration: underline
}

#top_main .info_tit {
width: 170px;
font-size: 1.8rem;
float: left;
position: relative
}

#top_main .info_tit:after {
display: block;
width: 20px;
height: 1px;
background: #fff;
position: absolute;
bottom: 0;
margin: auto 0
}

#top_main .info_tit img {
vertical-align: middle;
margin-top: -4px
}

#top_main .info_list {
-webkit-box-sizing: border-box;
box-sizing: border-box;
padding: 3px 0 0 12px;
float: right;
width: calc(100% - 170px);
font-size: 1.3rem;
letter-spacing: .1em
}

#top_main .info_list ul {
position: relative;
z-index: 0
}

#top_main .info_list li {
text-overflow: ellipsis;
white-space: nowrap;
display: none
}

#top_main .info_list li .tag {
display: inline-block;
background: #000;
color: #fff;
padding: 3px 14px 1px;
margin-right: 15px;
/*box-shadow: 0px 0px 3px 2px #051538;*/
border: solid 1px rgba(255,255,255,0.3);
}

#top_main .info_list li a {
display: inline-block;
padding-top: 2px
}

.top_tit {
position: relative;
padding-top: 80px;
line-height: 1.2
}

.top_tit:before {
display: block;
width: 1px;
height: 70px;
position: absolute;
background: #505050;
left: 0;
margin: 0 auto
}

.top_tit .tit {
font-size: 5.4rem;
letter-spacing: .2em;
text-align: center;
max-width: 1280px;
margin: 0 auto
}

.top_tit .tit img {
vertical-align: middle;
margin-top: -5px
}

#top_about {
padding-top: 10px;
margin-top: 40px;
background: #fff
}

#top_about .box {
max-width: 1050px;
width: 96%;
margin: 20px auto 0;
overflow: hidden
}

#top_about .box .col {
float: left;
width: 50%
}

#top_about .box .img img {
width: 95%;
height: 100%;
}

#top_about .box .txt_box {
margin-top: 30px;
text-align: center;
color: #454445;
max-width: 511px;
height: 511px;
background: url(../img/top/about_bg.png) left top no-repeat #efae00;
background-size: cover;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column
}

#top_about .box .txt_box .tit {
font-size: 2.4rem;
letter-spacing: .1em;
font-weight: 700
}

#top_about .box .txt_box .txt {
font-size: 1.6rem;
letter-spacing: .1em;
line-height: 1.5;
margin-top: 30px
}

@media screen and (max-width:930px) {
#top_about .box .txt_box {
height: 400px
}
#top_about .box .txt_box .tit {
font-size: 2rem
}
#top_about .box .txt_box .txt {
font-size: 1.3rem
}
}

#top_service {
margin: -140px 0 0;
padding: 180px 0 60px;
background: url(../img/top/about_bg_top.png) left top no-repeat, url(../img/top/about_bg_bottom.png) right bottom no-repeat, url(../img/top/service_bg.jpg) center center no-repeat;
background-size: 100% 200px, 100% 200px, cover
}

#top_service .top_tit:before {
background: #fff
}

#top_service .top_tit .tit {
color: #fff
}

#top_service .list {
max-width: 1080px;
width: 96%;
margin: 20px auto
}

#top_service .list li {
position: relative
}

#top_service .list li:after {
content: '';
display: block;
width: calc(50% - 20px);
height: 350px;
background: #efae00;
position: absolute;
top: 10px;
left: 20px;
z-index: 1
}

#top_service .list li a {
display: table;
background: #fff;
margin: 0 30px;
position: relative;
z-index: 2;
text-decoration: none
}

#top_service .list li a>div {
display: table-cell;
vertical-align: middle
}

#top_service .list li+li {
margin-top: 30px
}

#top_service .list li:nth-child(even):after {
left: auto;
right: 20px
}

#top_service .list li:nth-child(even) a {
direction: rtl
}

#top_service .list .img {
padding: 10px;
-webkit-transition: all .1s ease;
transition: all .1s ease
}

#top_service .list .txtBox {
padding: 60px 0 90px 55px;
direction: ltr;
vertical-align: top
}

#top_service .list .tit {
font-size: 2.4rem;
line-height: 1.2;
letter-spacing: .1em;
position: relative
}

#top_info .box .tit,
#top_service .list .btn,
#top_service .list .tit span {
line-height: 1.1;
font-family: "Bank Gothic", Orbitron, "Lucida Grande", "Lucida Sans Unicode", Arial, Verdana, sans-serif;
font-weight: 100
}

#top_service .list .tit:before {
content: '';
display: block;
width: 40px;
height: 7px;
background: #454445;
position: absolute;
top: 0;
bottom: 0;
margin: auto 0;
left: -55px
}

#top_service .list .tit span {
display: block;
font-size: 1.8rem;
margin-top: 10px
}

#top_service .list .tit span img{
max-width: 100%;
}

#top_service .list .txt {
margin-top: 10px;
font-size: 1.6rem;
letter-spacing: .1em;
padding-right: 40px
}

#top_service .list .btn {
position: absolute;
font-size: 1.8rem;
bottom: 30px;
min-width: 300px;
text-align: center;
padding: 15px 0 14px;
border: 1px solid #1e1e1e;
background: url(../img/common/ico_arrow.png) right 20px center no-repeat #fff;
-webkit-transition: all .1s ease;
transition: all .1s ease
}

#top_service .list li:nth-child(odd) .btn {
right: -30px
}

#top_service .list li:nth-child(even) .btn {
left: -30px
}

#top_service .list li:hover .btn {
background: url(../img/common/ico_arrow.png) right 10px center no-repeat #fff
}

#top_service .list li .btn img {
vertical-align: middle;
margin-top: -4px
}

@media screen and (max-width:900px) {
#top_service .list .img {
width: 50%
}
#top_service .list .img img {
width: 100%
}
}

#top_info .box {
max-width: 1050px;
width: 96%;
margin: 40px auto 0;
overflow: hidden
}

#top_info .box .col {
float: left;
width: calc(50% - 11px)
}

#top_info .box .col.ir {
margin-left: 22px
}

#top_info .box .tit {
font-size: 3.2rem;
letter-spacing: .1em;
text-align: center;
padding-bottom: 10px;
border-bottom: solid 4px #efae00;
margin-bottom: 30px
}

#top_info .box .tit img {
vertical-align: middle;
margin-top: -5px
}

#top_info .box .col.ir .tit {
border-bottom: solid 4px #454445
}

#top_info .box .list li a {
display: block;
text-decoration: none
}

#top_info .box .list li a:hover {
text-decoration: underline
}

#top_info .box .list li+li {
margin-top: 25px;
padding-top: 25px;
border-top: solid 1px #c8c8c8
}

#top_info .box .list li .meta {
font-size: 1.4rem;
letter-spacing: .1em;
margin-bottom: 7px
}

#top_info .box .list li .meta span {
display: inline-block;
font-size: 1.3rem;
line-height: 1.5;
letter-spacing: .1em;
/*border: 1px solid #c8c8c8;*/
min-width: 138px;
text-align: center;
-webkit-box-sizing: border-box;
box-sizing: border-box;
padding: 2px 5px 1px;
margin-left: 10px;
color: #fff;
}

#top_contact .btn a,
#top_info .box .btn a {
display: block;
border: 1px solid #1e1e1e;
-webkit-transition: all .1s ease;
text-align: center
}

#top_info .box .list li .txt {
font-size: 1.4rem;
line-height: 1.7;
letter-spacing: .1em;
}

#top_info .box .list li a.pdf{
padding-right: 35px;
background: url(../img/ir/news/icon_pdf.png) right 6px center no-repeat;
background-size: 23px;
}

#top_info .box .list li a.link_m{
padding-right: 30px;
background: url(../img/ir/news/icon_link.png) right 6px center no-repeat;
background-size: 23px;
}

/*#top_info .box .list li a.pdf .txt:after {
content: '';
display: inline-block;
background: url(../img/ir/news/icon_pdf.png) center no-repeat;
width: 20px;
height: 24px;
background-size: 20px auto;
margin: -3px 0 -5px 5px;
position: relative;
bottom: -2px;
}

#top_info .box .list li a.link_m .txt:after {
content: '';
display: inline-block;
background: url(../img/ir/news/icon_link.png) right center no-repeat;
width: 20px;
height: 24px;
background-size: 20px auto;
margin: -3px 0 -5px 5px;
position: relative;
bottom: -2px;
}*/

#top_contact .btn a,
#top_foot .box .ban a,
#top_info .box .btn a {
line-height: 1.1;
display: block;
font-family: "Bank Gothic", Orbitron, "Lucida Grande", "Lucida Sans Unicode", Arial, Verdana, sans-serif;
font-weight: 100;
text-decoration: none
}

#top_info .box .btn a {
width: calc(100% - 4px);
font-size: 1.8rem;
padding: 15px 0 14px;
background: url(../img/common/ico_arrow.png) right 20px center no-repeat #fff;
transition: all .1s ease;
margin-top: 25px
}

#top_info .box .btn a img {
vertical-align: middle;
margin-top: -5px
}

#top_info .box .btn a:hover {
background: url(../img/common/ico_arrow.png) right 10px center no-repeat #fff
}

#top_foot .box {
overflow: hidden;
margin-top: 120px
}

#top_foot .box .ban {
float: left;
width: 50%
}

#top_foot .box .ban a {
color: #fff;
font-size: 3.6rem;
padding: 40px 0 40px 66px;
-webkit-transition: all .4s ease;
transition: all .4s ease;
position: relative;
background-size: cover
}

#top_foot .box .ban a img {
vertical-align: middle;
margin-top: -3px
}

#top_foot .box .ban.careers a {
background: url(../img/top/foot_careers.jpg) center center no-repeat;
background-size: cover
}

#top_foot .box .ban.company a {
background: url(../img/top/foot_company.jpg) center center no-repeat;
background-size: cover
}

#top_foot .box .ban a:after {
position: absolute;
top: 0;
bottom: 0;
right: 45px;
margin: auto 0;
content: '';
display: block;
width: 43px;
height: 26px;
background: url(../img/top/foot_ico.png) right top no-repeat;
-webkit-transition: all .4s ease;
transition: all .4s ease
}

#top_foot .box .ban a:hover:after {
right: 30px
}

#top_contact {
padding-top: 75px;
max-width: 96%;
margin: 0 auto
}

#top_contact .top_tit {
padding-top: 0
}

#top_contact .top_tit:before {
content: normal
}

#top_contact .txt {
max-width: 733px;
text-align: center;
margin: 10px auto 0
}

#top_contact .btn a {
font-size: 1.8rem;
padding: 15px 0 14px;
background: url(../img/common/ico_arrow_w.png) right 20px center no-repeat #000;
transition: all .1s ease;
max-width: 481px;
margin: 25px auto 0;
color: #fff
}

#top_contact .btn a:hover {
background: url(../img/common/ico_arrow_w.png) right 10px center no-repeat #000
}

#top_contact .btn img {
vertical-align: middle;
margin-top: -4px
}

footer .scrool_top {
margin-top: 100px
}

footer .scrool_top a {
display: block;
height: 50px;
background: #454445;
font-size: 0;
line-height: 0;
color: #454445;
position: relative;
-webkit-transition: all .1s ease;
transition: all .1s ease
}

footer .scrool_top a:after {
position: absolute;
content: '';
display: block;
top: 0;
bottom: -2px;
right: 0;
left: 0;
margin: auto;
width: 10px;
height: 10px;
border-top: 1px solid #fff;
border-right: 1px solid #fff;
-webkit-transform: rotate(-45deg);
transform: rotate(-45deg);
-ms-transform: rotate(-45deg);
transition: all .3s ease;
-webkit-transition: all .3s ease
}

footer .scrool_top a:hover:after {
bottom: 10px
}

footer .footer_in {
overflow: hidden;
max-width: 950px;
width: 96%;
margin: 0 auto;
padding: 50px 0
}

footer .footer_in .logo {
float: left;
margin-right: 100px
}

footer .footer_in .logo .lang ul {
/*overflow: hidden;*/
text-align: center;
letter-spacing: -.4em
}

footer .footer_in .logo .lang li {
display: inline-block;
position: relative;
letter-spacing: normal;
font-size: 1.6rem;
line-height: 1.3;
font-family: "Bank Gothic", Orbitron, "Lucida Grande", "Lucida Sans Unicode", Arial, Verdana, sans-serif;
font-weight: 100
}

footer .footer_in .logo .lang li img {
vertical-align: middle;
margin-top: -2px
}

footer .footer_in .logo .lang li+li {
padding-left: 30px
}

footer .footer_in .logo .lang li+li:before {
content: '/';
display: block;
position: absolute;
top: 0;
bottom: 0;
left: 15px;
margin: auto 0
}

footer .footer_in .logo .lang li a {
position: relative;
text-decoration: none
}

footer .footer_in .logo .lang li a:after {
content: '';
display: block;
width: 20px;
height: 2px;
background: #efae00;
position: absolute;
bottom: 0;
left: 0;
right: 0;
margin: 0 auto;
opacity: 0;
-webkit-transition: all .2s ease;
transition: all .2s ease
}

footer .footer_in .logo .lang li a:hover:after,
footer .footer_in .logo .lang li.active a:after {
opacity: 1
}

footer .footer_in .sitemp {
float: left;
overflow: hidden;
width: calc(100% - 354px)
}

footer .footer_in .sitemp a,
footer .footer_in .sitemp span {
text-decoration: none;
font-size: 1.4rem;
font-weight: 700;
color: #1e1e1e
}

footer .footer_in .sitemp a:hover {
text-decoration: underline
}

footer .footer_in .sitemp .col {
float: left
}

footer .footer_in .sitemp .col+.col {
margin-left: 10%
}

footer .footer_in .sitemp .row+.row {
padding-top: 10px
}

footer .footer_in .sitemp li {
line-height: 1.5
}

footer .footer_in .sitemp li a {
font-size: 1.2rem;
font-weight: 400;
letter-spacing: .1em
}

/*ツールチップ*/
footer .footer_in .logo .lang li:hover .tool {
opacity: 1;
}
footer .footer_in .logo .lang li.grayout a:after {
display: none;
}
footer .footer_in .logo .lang li.grayout a {
opacity: 0.5;
}


@media screen and (max-width:980px) {
footer .footer_in .sitemp .col {
width: 23%
}
}

footer .footer_in .copy {
font-size: 1.2rem;
clear: both;
text-align: center;
padding-top: 20px
}

@media screen and (min-width:769px) {
.pcNone {
display: none
}
}

@media screen and (max-width:768px) {
#top_main .info_box,
.sp_gnav {
-webkit-box-sizing: border-box
}
.sp_gnav .lang li,
.sp_gnav .row>a,
.sp_gnav .row>span {
line-height: 1.3;
font-family: "Bank Gothic", Orbitron, "Lucida Grande", "Lucida Sans Unicode", Arial, Verdana, sans-serif;
font-weight: 100
}
body {
padding-top: 50px
}
.spNone {
display: none
}
#header .sp_header {
overflow: hidden
}
#header .sp_header .line {
position: absolute;
width: 50px;
height: 450px;
right: 0;
top: 0;
background: #efae00
}
#header .sp_header_in {
position: fixed;
width: 100%;
background: #fff;
z-index: 999;
top: 0;
left: 0
}
#header .sp_header .logo {
float: left;
padding: 8px 0 0 7px
}
#header .sp_header .logo img {
width: 160px;
height: auto
}
#header .sp_header .menu {
float: right;
width: 50px;
background: #efae00;
position: relative
}
#header .sp_header .menu:after {
content: '';
display: block;
padding-top: calc(100% - 15px)
}
#header .sp_header .menu p {
margin-top: 15px;
position: relative;
z-index: 9999
}
#header .sp_header .menu span {
display: block;
width: 30px;
height: 3px;
background: #fff;
position: absolute;
margin: 0 auto;
left: 0;
right: 0;
-webkit-transition: all .3s ease;
transition: all .3s ease
}
#header .sp_header .menu span:nth-child(1) {
top: 0
}
#header .sp_header .menu span:nth-child(2) {
top: 8px
}
#header .sp_header .menu span:nth-child(3) {
top: 16px
}
.sp_gnav_wrap {
width: 100%;
height: 100vh;
top: 0;
position: fixed;
z-index: 9999;
overflow-y: scroll;
-webkit-overflow-scrolling: touch
}
#top_foot .box,
#top_service,
body.menuIn {
overflow: hidden
}
.sp_gnav_wrap .close p {
position: absolute;
top: 10px;
right: 10px;
-webkit-transform: rotate(45deg);
-ms-transform: rotate(45deg);
transform: rotate(45deg);
width: 50px;
height: 50px;
border-radius: 50%
}
.sp_gnav_wrap .close span {
content: '';
display: block;
width: 30px;
height: 3px;
background: #fff;
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
margin: auto;
-webkit-transition: all .1s ease;
transition: all .1s ease
}
.sp_gnav_wrap .close span+span {
-webkit-transform: rotate(90deg);
-ms-transform: rotate(90deg);
transform: rotate(90deg)
}
.sp_gnav {
box-sizing: border-box;
width: calc(100% - 30px);
background: url(../img/common/sp_menu_bg.png) left top no-repeat #454445;
background-size: 100% auto;
margin-left: 30px;
padding: 50px 0 100px 30px;
min-height: 100%
}
.sp_gnav,
.sp_gnav a {
color: #fff;
text-decoration: none
}
.sp_gnav .row>a,
.sp_gnav .row>span {
display: block;
font-size: 2rem;
border-bottom: solid 1px rgba(255, 255, 255, .25);
padding: 15px 0 13px;
position: relative
}
.sp_gnav .row>a>img,
.sp_gnav .row>span>img {
margin-top: 7px
}
.sp_gnav .row>span:after,
.sp_gnav .row>span:before {
content: '';
display: block;
width: 20px;
height: 1px;
background: #fff;
position: absolute;
right: 15px;
top: 0;
bottom: 0;
margin: auto 0;
-webkit-transition: all .1s ease;
transition: all .1s ease
}
.sp_gnav .row>span:after {
-webkit-transform: rotate(90deg);
-ms-transform: rotate(90deg);
transform: rotate(90deg)
}
.sp_gnav .row.active>span {
border-bottom: none
}
.sp_gnav .row.active>span:after {
-webkit-transform: rotate(0);
-ms-transform: rotate(0);
transform: rotate(0)
}
.sp_gnav .row ul {
display: none
}
.sp_gnav .row li a {
display: block;
font-size: 1.4rem;
background: rgba(0, 0, 0, .35);
padding: 12px 15px 10px 30px;
position: relative
}
.sp_gnav .row li+li a:before {
content: '';
position: absolute;
top: 0;
right: 0;
width: calc(100% - 30px);
border-top: solid 1px rgba(255, 255, 255, .25)
}
.sp_gnav .bottom ul {
margin-top: 20px
}
.sp_gnav .bottom ul li {
font-size: 1.4rem;
margin-top: 8px
}
.sp_gnav .lang ul {
overflow: hidden;
text-align: center;
letter-spacing: -.4em;
padding: 2px 5px 5px;
margin-top: 20px;
border: 1px solid #fff;
margin-right: 30px
}
.sp_gnav .lang li {
display: inline-block;
position: relative;
letter-spacing: normal;
font-size: 1.8rem
}
.sp_gnav .lang li+li {
padding-left: 30px;
opacity: 0.3;
}
.sp_gnav .lang li+li:before {
content: '/';
display: block;
position: absolute;
top: 0;
bottom: 0;
left: 15px;
margin: auto 0
}
.sp_gnav .lang li a {
position: relative;
text-decoration: none
}
.sp_gnav .lang li a img {
margin-top: 7px
}
.sp_gnav .lang li a:after {
content: '';
display: block;
width: 20px;
height: 2px;
background: #efae00;
position: absolute;
bottom: 0;
left: 0;
right: 0;
margin: 0 auto;
opacity: 0;
-webkit-transition: all .2s ease;
transition: all .2s ease
}
.sp_gnav .lang li a:hover:after,
.sp_gnav .lang li.active a:after {
opacity: 1
}
.sp_gnav_wrap {
-webkit-transition: all .3s ease;
transition: all .3s ease;
left: 100%
}
body.menuIn .sp_gnav_wrap {
left: 0
}
.sp_gnav_overlay {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100vh;
background: rgba(0, 0, 0, .8);
z-index: 9998;
display: none
}
#top_main {
padding-top: 5px
}
#top_main:before {
display: none
}
#top_main .main_tit {
bottom: -13%;
width: 82%
}
#top_main .main_tit img {
width: 100%;
max-width: 345px;
height: auto
}
#top_main .main_img {
width: calc(100% - 10px);
height: 190px;
margin: 0 0 0 auto
}
#top_main .info_box {
box-sizing: border-box;
width: 100%;
padding: 40px 5% 15px;
margin-top: 30px;
background: url(../img/top/main_bg_sp.png) left top no-repeat;
background-size: 100% 100%
}
#top_main .info_tit {
width: auto;
font-size: 1.6rem;
float: none
}
#top_main .info_tit span {
display: inline-block;
padding-right: 10px;
background: #454445;
position: relative;
z-index: 1
}
#top_main .info_tit:after {
width: 100%;
z-index: 0
}
#top_main .info_list {
padding: 0;
float: none;
width: 100%;
font-size: 1.1rem
}
#top_main .info_list li {
white-space: normal;
line-height: 1.25
}
#top_main .info_list li .tag {
padding: 2px 10px;
margin: 0 0 5px
}
#top_main .info_list li a {
display: inline-block
}
.top_tit {
padding-top: 30px
}
.top_tit:before {
content: '';
display: block;
width: 1px;
height: 30px
}
.top_tit .tit {
font-size: 3rem;
letter-spacing: .15em
}
.top_tit .tit img {
height: 17px;
width: auto
}
#top_about {
padding-top: 10px;
margin-top: 10px;
background: #fff
}
#top_about .box {
width: 96%;
margin-top: 10px
}
#top_about .box .col {
float: none;
width: 100%
}
#top_about .box .img {
width: 85%;
margin: 0 auto;
position: relative;
z-index: 1
}
#top_about .box .txt_box {
color: #454445;
width: 90%;
height: auto;
background: url(../img/top/about_bg.png) left top no-repeat #efae00;
background-size: cover;
display: block;
position: relative;
z-index: 0;
padding: 60px 10px 30px;
margin: 20px auto 0
}
#top_about .box .txt_box .tit {
font-size: 1.7rem
}
#top_about .box .txt_box .txt {
width: 90%;
margin: 10px auto 0;
font-size: 1.2rem;
text-align: left
}
#top_service {
margin: -70px 0 0;
padding: 90px 0 60px;
background: url(../img/top/about_bg_top.png) left top no-repeat, url(../img/top/about_bg_bottom.png) right bottom no-repeat, url(../img/top/service_bg.jpg) top center no-repeat #000;
background-size: 100% 50px, 100% 50px, 150% auto
}
#top_service .list {
margin: 10px auto
}
#top_service .list li:after {
width: 100%;
height: 210px;
top: 5px!important;
left: 0!important
}
#top_service .list li a {
display: block;
margin: 0 5px
}
#top_service .list li a>div {
display: block
}
#top_service .list li+li {
margin-top: 50px
}
#top_service .list li:nth-child(even) a {
direction: ltr
}
#top_service .list .img {
-webkit-box-sizing: border-box;
box-sizing: border-box;
padding: 5px;
width: 100%
}
#top_service .list .txtBox {
padding: 10px 25px 0
}
#top_service .list .tit {
font-size: 1.8rem
}
#top_service .list .tit:before {
width: 15px;
height: 5px;
left: -25px
}
#top_service .list .tit span {
font-size: 1.4rem;
letter-spacing: .05em;
margin-top: 7px
}
#top_service .list .tit span img {
height: 8.5px;
width: auto
}
#top_service .list li+li .tit span img {
height: 25px;
}
#top_service .list .txt {
margin-top: 5px;
font-size: 1.2rem;
padding-right: 0
}
#top_service .list .btn {
position: relative;
font-size: 1.6rem;
min-width: 0;
padding: 10px 0;
background-size: 15px auto;
margin-top: -5px;
bottom: -15px;
right: 0!important;
left: 0!important
}
#top_info .box {
width: 96%;
margin: 20px auto 0
}
#top_info .box .col {
float: none;
width: 96%;
margin: 0 auto
}
#top_info .box .col.ir {
margin: 30px auto 0
}
#top_info .box .tit {
font-size: 2.1rem;
padding-bottom: 10px;
border-bottom: solid 2px #efae00;
margin-bottom: 20px
}
#top_info .box .tit img {
height: 12px;
width: auto
}
#top_info .box .col.ir .tit {
border-bottom: solid 2px #454445
}
#top_info .box .list li {
height: auto!important;
}
#top_info .box .list li+li {
margin-top: 15px;
padding-top: 15px;
border-top: solid 1px #c8c8c8
}
#top_info .box .list li .meta {
font-size: 1.3rem;
letter-spacing: .05em;
margin-bottom: 7px
}
#top_info .box .list li .meta span {
margin-left: 5px
}
#top_info .box .list li .txt {
font-size: 1.3rem;
line-height: 1.6;
letter-spacing: .05em
}
#top_info .box .list li a{
height: auto!important;
}
#top_info .box .list li a .txt:after {
margin-left: 2px !important;
}
#top_info .box .btn a {
font-size: 1.6rem;
padding: 10px 0;
margin-top: 25px;
background-size: 15px auto
}
#top_foot .box {
margin-top: 45px
}
#top_foot .box .ban {
float: none;
width: 100%
}
#top_foot .box .ban img {
height: 16px;
width: auto
}
#top_foot .box .ban a {
font-size: 2.5rem;
letter-spacing: .1em;
padding: 25px 0;
text-align: center
}
#top_foot .box .ban.careers a {
margin-bottom: 1px
}
#top_foot .box .ban a:hover {
opacity: .8
}
#top_foot .box .ban a:after {
right: 12px;
width: 22px;
height: 13px;
background-size: 22px auto
}
#top_foot .box .ban a:hover:after {
right: 12px
}
#top_contact {
padding-top: 30px;
max-width: 96%;
margin: 0 auto
}
#top_contact .top_tit {
padding-top: 0
}
#top_contact .top_tit:before {
content: normal
}
#top_contact .txt {
font-size: 1.4rem;
width: 96%;
text-align: left
}
#top_contact .btn a {
font-size: 1.6rem;
text-align: center;
padding: 10px 0;
background-size: 15px auto;
max-width: 96%;
margin: 15px auto 0
}
#top_contact .btn img {
margin-top: -2px
}
footer .scrool_top {
margin-top: 30px
}
footer .footer_in {
padding: 25px 0 15px
}
footer .footer_in .logo {
float: none;
margin: 0 auto;
text-align: center
}
footer .footer_in .logo img {
width: 150px;
height: auto
}
footer .footer_in .logo .lang,
footer .footer_in .sitemp {
display: none
}
footer .footer_in .copy {
font-size: 1rem;
clear: both;
text-align: center;
padding-top: 15px
}
}

.info_box{
overflow: hidden;
}
.info_list {
position: relative;
/*overflow: hidden;*/
}
.info_list:after {
position: absolute;
content: "";
background: -moz-linear-gradient(left, rgba(0,36,115,0) 0%, rgba(239, 174, 0,1) 100%);
background: -webkit-linear-gradient(left, rgba(0,36,115,0) 0%,rgba(239, 174, 0,1) 100%);
background: linear-gradient(to right, rgba(0,36,115,0) 0%,rgba(239, 174, 0,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00454445', endColorstr='#454445',GradientType=1 );
width: 10em;
height: 200%;
right: 0;
top: -50%;
}
@media screen and (max-width:768px) {

#top_main .info_list {
height: 7em!important;
padding-top: 1em;
}
#top_main .info_list li a {
line-height: 1.5;
}
.info_list:after {
content: none;
}
#top_main .info_list li {
font-size: 13px;
}

}
@media screen and (max-width:504px) {

#top_main .info_list li {
font-size: 11px;
}

}
@media screen and (max-width:430px) {

#top_main .info_list {
padding-top: 0;
}

}

.accessory {
width: 1200px;
height: 540px;
margin: 0 auto;
text-align: center;
}

.accessory .accessoryTitle {
width: 1200px;
height: 141px;
margin: 0 auto;
padding: 40px 0 30px;
box-sizing: border-box;
}


.artist h2,.message_board h2{
	height:80px;
	line-height:80px;
	font-size:26px;
	font-weight:500;
	color:#dadada;
	text-align:center;
}
.member{height:auto;overflow:hidden;}
.member li{width:220px;height:231px;text-align:center;float:left;margin-left: auto;
    margin-right: auto;margin-bottom:15px;}

.member li img{
	width:145px;
	height:145px;
	border:5px solid #fff;
	border-radius:50%;            /* W3C syntax */

    display: flex;
    flex-flow: row nowrap;
    justify-content: center;
	
	transition: border-radius 1s;
	-moz-transition: border-radius 1s;	/* Firefox 4 */
	-webkit-transition: border-radius 1s;	/* Safari 和 Chrome */
	-o-transition: border-radius 1s;	/* Opera */

	style.mozBorderRadius:50%;
	style.webkitBorderRadius:50%;
    
}
.member li img:hover
{
	style.mozBorderRadius:0;
	style.webkitBorderRadius:0;
    border-radius:0;
}

.member p span{font-size:16px;}

.top_message {
    max-width: 1050px;
    width: 96%;
    margin: 40px auto 0;
    overflow: hidden; 
    font-family: sans-serif;
}
.top_message > p {
    padding: 6px 0px;
}
.company_experience { 
    width: 100%;
    height: 100;
}
.cont_inner img {
    width: 100%;
    height: 100%;
}
.cont_inner_small img {
    width: 20%;
    height: 20%;
}