@charset "utf-8";
@font-face {
    font-family: 'Noto Sans Japanese';
    font-style: normal;
    font-weight: 400;
    src: local('Noto Sans CJK JP Regular'),
    url('fonts/NotoSansCJKjp-Regular.woff2') format('woff2'),
    url('fonts/NotoSansCJKjp-Regular.woff') format('woff'),
    url('fonts/NotoSansCJKjp-Regular.ttf') format('truetype'),
    url('fonts/NotoSansCJKjp-Regular.eot') format('embedded-opentype');
}
@font-face {
    font-family: 'Noto Sans Japanese';
    font-style: normal;
    font-weight: 700;
    src: local('Noto Sans CJK JP Bold'),
    url('fonts/NotoSansCJKjp-Bold.woff2') format('woff2'),
    url('fonts/NotoSansCJKjp-Bold.woff') format('woff'),
    url('fonts/NotoSansCJKjp-Bold.ttf') format('truetype'),
    url('fonts/NotoSansCJKjp-Bold.eot') format('embedded-opentype');
}
@font-face {
    font-family: 'Noto Sans Japanese';
    font-style: normal;
    font-weight: 900;
    src: local('Noto Sans CJK JP Black'),
    url('fonts/NotoSansCJKjp-Black.woff2') format('woff2'),
    url('fonts/NotoSansCJKjp-Black.woff') format('woff'),
    url('fonts/NotoSansCJKjp-Black.ttf') format('truetype'),
    url('fonts/NotoSansCJKjp-Black.eot') format('embedded-opentype');
}


/*reset*/
/*******************************************************************/
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,select,textarea,p,blockquote,th,td,a,main,article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section,img { margin: 0; padding: 0; -webkit-box-sizing: border-box; box-sizing: border-box;}
main,article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section { display: block;}
address,caption,cite,code,dfn,em,strong,th,var { font-style: normal;}
table { border-collapse: collapse; border-spacing: 0;}
object,embed { vertical-align: top;}
hr,legend { display: none;}
h1,h2,h3,h4,h5,h6 { font-size: 100%; font-weight: 900; line-height: 1.2;}
img { width: auto; max-width: 100%; height: auto; border: 0; vertical-align: middle;}
li { list-style: none;}
a { color: #231815; -webkit-transition: all 0.2s ease-out; transition: all 0.2s ease-out; text-decoration: none;}
a:hover { color: #3350EB;}
a img { -webkit-transition: all 0.2s ease-out; transition: all 0.2s ease-out;}
a img:hover { filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=90); opacity: 0.9; -webkit-transform: scale(1.05); transform: scale(1.05);}


/*LAYOUT*/
/*******************************************************************/
body { -webkit-text-size-adjust: 100%; -webkit-overflow-scrolling: touch; font-family: 'Noto Sans Japanese', sans-serif; font-size: 15px; letter-spacing: 0.05em; font-weight: 400; word-break: break-all; color: #231815;}
#container { width: 100%;}
.in { position: relative; width: 1140px; margin: 0 auto; padding: 0 20px;}


/*HEADER*/
/*******************************************************************/
#header { position: relative; height: 163px; padding-top: 5px; background: url(../images/common/bg.png) 0 0 repeat-x; z-index: 100;}
#headtitle { display: -webkit-flex; display: flex; -webkit-justify-content: space-between; justify-content: space-between; -webkit-align-items: center; align-items: center; height: 91px; background: url(../images/common/header.png) center top no-repeat;}
#logo div, #info h1, #info div { height: 45px; line-height: 45px;}
#logo { padding: 0 0 6px 28px;}
#copy { padding-left: 10px; font-size: 18px; font-weight: 900; color: #FFF;}
#copy span { display: inline-block; padding-left: 5px; font-size: 22px;}
#info { padding-right: 60px; text-align: right; letter-spacing: 0;}
#info h1 { font-size: 20px;}
#tel { font-size: 16px; font-weight: 700;}
#nav > ul { float: right; display: table; table-layout: fixed; padding: 0 20px; background: url(../images/common/navl.svg) 0 0 no-repeat, url(../images/common/navr.svg) right 0 no-repeat;}
#nav > ul > li { position: relative; display: table-cell; vertical-align: middle;}
#nav > ul > li > a { display: block; padding: 20px 30px; height: 67px; vertical-align: middle; background: url(../images/common/navl.svg) right 0 no-repeat, url(../images/common/navr.svg) 0 0 no-repeat, #3350EB; color: #FFF; -webkit-transition: all 0s; transition: all 0s;}
#nav > ul > li > a:hover, #nav > ul > li > a.on { background-color: #FFF; color: #3350EB;}
#nav li ul { display: none; position: absolute; left: 19px; width: 200px; border-bottom: 1px solid #3350EB;}
#nav li ul li a { display: block; padding: 10px; background: #FFF; border: 1px solid #3350EB; border-bottom: none; color: #3350EB;}
#nav li ul li a:hover, #nav li ul li a.on { background: #99A7F4; color: #FFF;}
#open { display: none;}


/*CONTENTS*/
/*******************************************************************/
#main { position: relative; z-index: 0;}
#main article { position: relative;z-index: 10;}
#main section { width: 1140px; margin: 0 auto; padding: 60px 20px;}
#main section::after { content: ''; display: block; clear: both;}
#main section a { color: #3350EA;}


/*top*/
.bgline { background: url(../images/common/mark.svg) right center no-repeat; background-size: auto 101%;}
#news dt { clear: left; float: left; padding: 10px 0; width: 100px;}
#news dd { padding: 10px 0 10px 90px; border-bottom: 1px dashed #a5a5a6;}


/*page*/
#main header.title { position: relative; height: 450px; margin-bottom: 30px; background-position: center center; background-repeat: no-repeat;}
#main header.title h1 { width: 1140px; margin: 0 auto; padding: 170px 20px 20px; font-size: 50px; letter-spacing: 0.4em; color: #FFF; text-shadow: 0 0 10px rgba(0,0,0,1);}
#main header.title h2 { width: 1000px; margin: 0 auto; padding-left: 40px; background: url(../images/common/mark.svg) 0 center no-repeat; background-size: auto 100%; font-size: 40px; font-weight: 700; letter-spacing: 0.1em; color: #FFF; text-shadow: 0 0 10px rgba(0,0,0,1);}
#main header.title nav { position: absolute; bottom: 20px; left: 0; width: 100%;}
#main header.title nav ul { width: 1100px; margin: 0 auto;}
#main header.title nav li { display: inline-block; margin: 0 10px;}
#main header.title nav li a { display: block; padding: 10px; background: rgba(0,0,0,.8); border: 3px solid #FFF; font-weight: 700; color: #FFF;}
#main header.title nav li a:hover, #main header.title nav li a.on { background: #3350EA;}
.business header { background-image: url(../images/business/title.jpg);}
.products header { background-image: url(../images/products/title.jpg);}
.facilities header { background-image: url(../images/facilities/title.jpg);}
.company header { background-image: url(../images/company/title.jpg);}
.contact header { background-image: url(../images/contact/title.jpg);}
.quality header { background-image: url(../images/quality/title.jpg);}
.privacy header { background-image: url(../images/privacy/title.jpg);}
#main header.st { position: relative; display: table; height: 84px; margin-bottom: 30px; background: url(../images/common/st.png) right top no-repeat;}
#main header.st h2, #main header.st h3 { display: table-cell; margin-bottom: 30px; padding: 0 80px 0 40px; background: url(../images/common/mark.svg) 0 0 no-repeat; font-size: 26px; color: #3350EA;}
#main header.st span { display: table-cell; width: 200px; padding-right: 50px; text-align: right; vertical-align: top; font-size: 18px; color: #FFF;}
#main header.st::before { content: ''; display: block; position: absolute; bottom: 0; left: -1000px; width: 1000px; height: 27px; background: #798dbf;}
#main .sub { position: relative; margin-bottom: 15px; padding: 0 0 10px 15px; border-bottom: 2px solid #3350EA; font-size: 20px;}
#main .sub::before { content: ''; display: block; position: absolute; bottom: 0; left: -12px; width: 21px; height: 40px; background: url(../images/common/mark.svg) 0 0 no-repeat;}
#main h5 { margin-bottom: 10px; color: #3350EA;}
#main .catch { margin-bottom: 30px; font-size: 22px; font-weight: 900; color: #3350EA;}
#main p { margin-bottom: 30px; line-height: 1.8;}
#main p:last-child { margin-bottom: 0;}
#main figure { margin-bottom: 15px; overflow: hidden;}
#main figure img { border-radius: 2px;}
#main ul, #main ol { margin: 0 0 30px 30px;}
#main ul li { padding-bottom: 10px; list-style: disc;}
#main ol li { padding-bottom: 10px; list-style: decimal;}
#main table { width: 100%; margin-bottom: 30px;}
#main th, #main td { padding: 10px 0; vertical-align: top; border-bottom: 1px dashed #999;}
#main th { width: 180px; padding-right: 20px; text-align: left;}
#main .list th { width: auto; padding: 10px; background: #EEE;}
#main .narrow td { padding: 5px 0; font-size: 14px;}
input[type="text"], input[type="tel"], input[type="email"], selsect, textarea { width: 40%; margin: 5px; padding: 5px; border: 1px solid #AAA; -webkit-appearance: none; appearance: none;}
.long { width: 70%!important;}
.short { width: 25%!important;}
.vshort { width: 10%!important;}
textarea { width: 80%; height: 180px; line-height: 1.5;}
.min { font-size: 12px; color: #808080;}
.required { color: #E60012;}
.fr { float: right; padding-left: 30px;}
.fl { float: left; padding-right: 30px;}
.right { text-align: right!important;}
.left { text-align: left!important;}
.center { text-align: center;}
.mb30 { margin-bottom: 30px!important;}
.mb60 { margin-bottom: 60px!important;}

.row { -webkit-display: flex; display: flex; -webkit-flex-wrap: wrap; flex-wrap: wrap; -webkit-justify-content: space-between; justify-content: space-between;}
.align_content_center { -webkit-align-content: center; align-content: center;}
.align_items_center { -webkit-align-items: center; align-items: center;}
.row_two > .content { -webkit-flex-basis: 48%; flex-basis: 48%; max-width: 48%;}
.row_three > .content { -webkit-flex-basis: 320px; flex-basis: 320px; max-width: 320px;}
.row_three::after { content: ''; display: block; width: 31.3%;}
.row_four > .content { -webkit-flex-basis: 23%; flex-basis: 23%; max-width: 23%;}
.row_ratio2_1 > .content { -webkit-flex-basis: 68%; flex-basis: 68%; max-width: 68%;}
.row_ratio2_1 > .content:last-child { -webkit-flex-basis: 28%; flex-basis: 28%; max-width: 28%;}

.btn { text-align: center;}
.btn a, .btn input { display: inline-block; padding: 10px 30px; background: #3350EA; border: none; border-radius: 2px; font-size: 16px; font-weight: 700; color: #FFF!important;}
.more a { display: block; padding: 5px 10px; text-align: center; background: #3350EA; border-radius: 2px; color: #FFF!important;}
.more a:hover { background: #99A7F4;}
.more a::before { content: ''; display: inline-block; width: 10px; height: 12px; margin-right: 5px; background: url(../images/common/arrw.svg) 0 0 no-repeat;}

.box { padding: 60px; border: 10px solid #99A7F4;}


/*FOOTER*/
/*******************************************************************/
#footer { position: relative; background: #262626; border-top: 1px solid #777680; color: #FFF;}
#footer #pagetop { display: none; position: fixed; right: 20px; bottom: 20px; z-index: 100;}
#footer .in { display: -webkit-flex; display: flex; -webkit-justify-content: space-between; justify-content: space-between; -webkit-align-items: center; align-items: center; padding: 30px 0; font-size: 13px;}
#footer .in > dl dt { padding-bottom: 10px; font-size: 16px; font-weight: 700;}
#footer a { color: #FFF;}
#footer nav { display: table;}
#footer nav dl { display: table-cell; padding: 0 30px; vertical-align: top; border-left: 1px dashed #666;}
#footer nav dt { padding-bottom: 5px;}
#footer nav dt a { display: inline-block; padding-left: 15px; background: url(../images/common/arr.svg) 0 center no-repeat; font-weight: 700;}
#footer nav dd { padding-left: 15px;}
#footer nav dd a { display: inline-block; padding-left: 10px; background: url(../images/common/dot.svg) 0 center no-repeat;}
#footer address { padding: 10px; text-align: center; background: #191919; font-size: 12px;}


@media print {
#container { width: 1060px;}
}