@charset "utf-8";
@import url(style_common.css);

@import url('https://fonts.googleapis.com/css2?family=M+PLUS+1p:wght@300;400;500;700&display=swap');

/* SP-First CSS */
/* ----------------------------------------------------------------------------------------------
A4 SYSTEM プリント箇所指定
↓最後尾に記述
---------------------------------------------------------------------------------------------- */

@media print {

    /* no-print */
    header,
    footer,
    #access,
    #pagetop,
    #pagetop img,
    .vertical_nav {
        display: none !important;
    }

    /*A4横*/
    main.w-all,
    section.onepage-print {
        margin: 0 !important;
        padding: 0 !important;
    }

    .onepage-print .a4page {
        width: 297mm;
        height: 200mm;
        page-break-after: always;
        font-size: 0 !important;
        line-height: 1 !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    .onepage-print .a4page img {
        width: 297mm;
        height: auto;
        margin: 0;
        padding: 0;
    }

    /*最後のページは改ページを入れない*/
    .onepage-print .a4page.lastpage {
        page-break-after: auto;
    }

    /*safari用サイズ調整ハック*/
    _::-webkit-full-page-media,
    _:future,
    :root .onepage-print .a4page {
        width: 267mm;
        height: 170mm;
    }

    _::-webkit-full-page-media,
    _:future,
    :root .onepage-print .a4page img {
        width: 267mm;
    }
}

/* A4縦 */
/*  @page { size: A4; } */
/* A4横 */
@page {
    size: A4 landscape;
}

/* マージン設定 */
@page {
    margin: 0;
}

/* --------------------------------------------------------
font
-------------------------------------------------------- */

/* type */
body,
input,
input[type="text"],
input[type="password"],
input[type="email"],
input[type="tel"],
input[type="number"],
input[type=submit],
input[type=reset],
input[type=button],
textarea,
select,
label,
/* 
.sec_form form dt,
.sec_form form dd,
.sec_form .note,
.sec_form h2,
.sec_form p,
table.kakunin th,
table.kakunin td,
 */
figcaption {
    font-family: 'M PLUS 1p', "ヒラギノ角ゴシック", "Hiragino Sans",
        "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "游ゴシック", "Yu Gothic", "游ゴシック体", "YuGothic", "Meiryo UI", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
    font-feature-settings: "palt"1;
    -webkit-font-smoothing: antialiased;
    font-weight: 500;
}

/* size */
/* commonでは全て下記サイズ
	font-size: 1.6rem;
	line-height: 1.5;
*/

/* weight */
.fb {
    font-weight: 700;
}

/* link */
a {
    cursor: pointer;
}

a:link,
a:visited,
.btn a:hover,
a:active,
a:focus {
    text-decoration: none;
}

a:hover,
li a:hover {
    text-decoration: none;
}

li.stay a {
    text-decoration: underline;
}

/*画像リンク透過*/
a:hover,
a:hover img,
input[type=submit]:hover,
input[type=button]:hover,
input[type=reset]:hover,
button:hover,
.ico-btn:hover,
.social_nav a:hover {
    opacity: 0.80;
    filter: opacity(80%);
}


/* --------------------------------------------------------
カラー
-------------------------------------------------------- */

html {
    background-color: #fff;
}

/* font-color */
body,
h1,
h2 {
    color: #000;
}

.c01 {
    color: #e50053;
}

/* link-highlight_SP */
a {
    color: #000;
}

/* link-color */
.btn,
a,
a:focus,
input[type=submit],
input[type=button],
input[type=reset],
button,
.ico-btn {
    -webkit-tap-highlight-color: rgba(255, 255, 255, 0.3);
}

/* contents */
section {
    background-color: #fff;
}

section:nth-child(even) {
    background-color: #fff;
}

.btn,
input[type=submit] {
    background-color: #000;
}

.btn,
.btn a {
    color: #fff;
}

/* breadcrumb */
#breadcrumb {
    background-color: #ededed;
}

/* --------------------------------------------------------
レイアウト
-------------------------------------------------------- */

html {
    overflow: auto;
}

body {
    overflow: hidden;
}

main.w-all {
    width: 100%;
    padding: 0 2rem;
}

section {
    padding: 0;
}

/* --------------------------------------------------------
header
-------------------------------------------------------- */

header h1 {
    text-align: right;
}

header h1 a img {
    margin: 3rem 2rem;
    width: 10rem;
}

#nav-drawer {
    position: absolute;
    right: 2rem;
    top: 9rem;
    z-index: 100;
}

#nav-drawer.fixed {
    text-align: right;
    position: fixed;
    right: 2rem;
    top: 2rem;
    width: 100%;
    z-index: 100;
}

.ico-btn img {
    width: 2.5rem;
    height: 2.5rem;
}

.ico-close {
    position: fixed;
    top: 2rem;
    right: 2rem;
    z-index: 1000;
    width: 2.5rem;
    height: 2.5rem;
}

/* index_page */
#index_page header h1 {
    text-align: left;
}

#index_page header h1 a img {
    margin: 3rem 2rem;
    width: 12rem;
}

#index_page header ul.social_nav {
    position: absolute;
    top: 1rem;
    right: .75rem;
}

#index_page header ul.social_nav {
    position: absolute;
    top: 4.25rem;
    right: 1.5rem;
}

#index_page header ul.social_nav a {
    padding: .5rem;
}

#index_page header ul.social_nav a img {
    width: auto;
    height: 4rem;
}

/* --------------------------------------------------------
nav
-------------------------------------------------------- */

/*SNSs*/
ul.social_nav li {
    display: inline-block;
    vertical-align: bottom;
    vertical-align: -webkit-baseline-middle;
}

ul.social_nav li a {
    padding: 1.25rem;
    display: block;
}

ul.social_nav li a img {
    width: auto;
    height: 3rem;
}

#slide_nav ul.social_nav {
    text-align: center;
    margin-top: 2rem;
    border-top: 1px solid #000;
    background-color: #FFF;
    padding-top: 1rem;
}

/*vertical_nav*/
ul.vertical_nav {
    display: none;
}

/* --------------------------------------------------------
footer
-------------------------------------------------------- */

footer {
    font-size: 1.3rem;
}

footer #logo {
    margin: 6rem auto;
    text-align: center;
}

footer a:hover {
    text-decoration: underline;
}

footer #logo img {
    width: 8rem;
    height: auto;
}

/* copy */
footer p {
    text-align: center;
    padding: 1.5rem;
    font-size: 1.15rem;
}

/* SNSs */
footer ul.social_nav {
    text-align: center;
    margin-top: -1rem;
}

/* pagetop */
#pagetop {
    border-radius: 0;
    padding-top: 1rem;
    background-color: rgba(0, 0, 0, 0.4);
}

/* --------------------------------------------------------
access
-------------------------------------------------------- */

#access h2 {
    text-align: center;
    margin-bottom: 1.5rem;
    font-size: 2.2rem;
    letter-spacing: 2px;
}

#access #info_box {
    background: url(../img/bg_black.png) top left repeat-y;
    -webkit-background-size: 100% auto;
    background-size: 100% auto;
    padding: 2.4rem 2rem;
    color: #FFF;
}

/* map */
#map {
    width: 100vw;
    position: relative;
    font-size: 0;
}

#map .btn {
    position: absolute;
    bottom: 3rem;
    right: 6rem;
    padding: 1rem 2rem;
    width: auto;
    margin: inherit;
    border-radius: 0;
}

#map .btn:hover {
    opacity: 1;
    filter: opacity(100%);
    background-color: #7b7b7b;
}

/* googlemap白黒に */
.googlemaps iframe,
.googlemaps object,
.googlemaps embed {
    -webkit-filter: grayscale(100%);
    -moz-filter: grayscale(100%);
    -ms-filter: grayscale(100%);
    -o-filter: grayscale(100%);
    filter: grayscale(100%);
    -webkit-transition: all 0.7s ease;
    -moz-transition: all 0.7s ease;
    -o-transition: all 0.7s ease;
    transition: all 0.7s ease;
}

.googlemaps iframe:hover,
.googlemaps object:hover,
.googlemaps embed:hover {
    -webkit-filter: grayscale(0%);
    -moz-filter: grayscale(0%);
    -ms-filter: grayscale(0%);
    -o-filter: grayscale(0%);
    filter: grayscale(0%);
}

/* --------------------------------------------------------
MV
-------------------------------------------------------- */

section.mv {
    margin-top: 3rem;
    position: relative;
    overflow: hidden;
    /* ↑右寄せankerlinkのfloat解除 */
}

section.mv h2 {
    display: block;
    padding-right: 4rem;
}

/* top_page */
#top_page section.mv h2 {
    display: block;
    margin-right: -2rem;
}

#top_page section.mv p {
    position: relative;
    z-index: 10;
    left: 50%;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    width: 80%;
    bottom: 4rem;
    margin-bottom: -4rem;
}

/* --------------------------------------------------------
main
-------------------------------------------------------- */

.banner_line a,
.box_line,
.linkbox .banner a {
    display: block;
    border: 1px solid #000;
}

.banner_line a:hover,
.linkbox .banner a:hover {
    border: 1px solid rgba(0, 0, 0, 0.3);
    background-color: #fbfbfb;
}

p.txtbox_black {
    position: relative;
    z-index: 10;
    color: #FFF;
    background-color: rgba(0, 0, 0, 0.6);
    padding: 1.5rem;
    width: 92%;
    margin-left: 8%;
    bottom: 4rem;
    margin-bottom: -4rem;
    right: 0;
}

section .banner {
    display: block;
    margin-right: -2.1rem;
    margin-bottom: 2rem;
}

section .banner:last-child {
    margin-bottom: 0;
}

.ankerlink {
    display: block;
    margin-top: 3rem;
    float: right;
}

.ankerlink p {
    text-align: left;
    margin-bottom: 2.5rem;
}

.ankerlink p::before {
    background: url(../img/ico_arrlow_black.svg) 0 0 no-repeat;
    -webkit-background-size: 2rem 1.7rem;
    background-size: 2rem 1.7rem;
    content: "";
    display: inline-block;
    width: 2rem;
    height: 1.7rem;
    position: relative;
    top: .5rem;
    left: -1rem;
}

.ankerlink p a {
    vertical-align: top;
}

/* index_page */
section.weblinkbox .banner {
    margin-bottom: 3rem;
}

.weblinkbox div.banner:nth-of-type(1) a {
    display: block;
    background: url(../img/bg_blue.png) top left repeat-y;
    -webkit-background-size: 100% auto;
    background-size: 100% auto;
}

.weblinkbox div.banner:nth-of-type(2) a {
    display: block;
    background: url(../img/bg_red.png) top left repeat-y;
    -webkit-background-size: 100% auto;
    background-size: 100% auto;
}

.weblinkbox div.banner:nth-of-type(1) a:hover,
.weblinkbox div.banner:nth-of-type(2) a:hover {
    background-color: rgba(255, 255, 255, 0.25);
    background-blend-mode: lighten;
}

.weblinkbox div.banner:nth-of-type(1) figure {
    display: block;
    width: 45%;
    height: auto;
    padding: 2rem;
}

.weblinkbox div.banner:nth-of-type(2) figure {
    display: block;
    width: 60%;
    height: auto;
    padding: 2rem;
}

.weblinkbox div.banner p {
    display: inline-block;
    color: #FFF;
    font-size: 1.4rem;
    padding: 0 2rem 2rem;
}

.weblinkbox div.banner p span {
    display: block;
    text-align: center;
    color: #172a88;
    font-size: 1.3rem;
    padding: 1rem;
    background-color: #FFF;
    width: 65%;
    margin-top: 2rem;
    margin-left: 35%;
}

.weblinkbox div.banner:nth-of-type(3) p {
    color: #000;
    padding: 0 8rem 0 .5rem;
}

.weblinkbox div.banner:nth-of-type(3) a:hover p {
    opacity: 0.6;
    filter: alpha(opacity=60);
    -ms-filter: "alpha( opacity=60 )";
}

.weblinkbox div.banner:nth-of-type(3) figure {
    margin-top: -3rem;
}

/* top_page */
#top_page .social_banner li,
#top_page .social_banner li a {
    text-align: center;
}

#top_page .social_banner li a img {
    width: 60%;
    height: auto;
    margin: 0 auto 2rem;
}

#top_page .social_banner li:last-child a img {
    margin-bottom: 0;
}

#top_page section.new h2 {
    font-size: 1.8rem;
    display: block;
    text-align: left;
    margin: 4rem -2rem 1rem 0;
    background: url(../img/line01.svg) bottom right no-repeat;
    -webkit-background-size: 75% auto;
    background-size: 75% auto;
    padding: 0 0 2rem 30%;
}

/* haribako_about_page */
.linkbox .banner a {
    padding: 1.5rem;
}

.linkbox .banner h3 {
    width: 40%;
}

.linkbox .banner p {
    width: 80%;
    margin-left: 20%;
}

.img_sub figure {
    display: block;
    margin-left: -2rem;
    padding-right: 4rem;
}

.img_sub p.banner_line {
    position: relative;
    z-index: 10;
    bottom: 8rem;
    margin-bottom: -6rem;
    right: 0;
    width: 50%;
    margin-left: 50%;
}

.flowbox {
    background: url(../img/flow_order_line.svg) top left repeat-y;
    -webkit-background-size: 100% auto;
    background-size: 100% auto;
    margin-left: -2rem;
}

.img_sub.end::before {
    position: relative;
    z-index: 10;
    display: block;
    content: '';
    background: url(../img/flow_order_arrow.svg) top left no-repeat;
    -webkit-background-size: 100% auto;
    background-size: 100% auto;
    height: 8rem;
    margin-left: -2rem;
}

.flowbox h3,
.flowbox ul {
    display: block;
    width: 75%;
    margin-left: 25%;
    margin-top: 2rem;
}

.flowbox h3 {
    margin-left: calc(25% - 1rem);
    ;
}

.flowbox ul li {
    margin-bottom: 1rem;
}

section.order .flowbox ul li:last-of-type {
    margin-top: 3rem;
}

.flowbox ul li::before {
    position: relative;
    display: inline-block;
    left: -1rem;
    content: '■';
}

.flowbox dl {
    margin-top: 3rem;
}

.flowbox dl dt {
    width: 60%;
    margin-top: 1rem;
}

.flowbox dl dd {
    width: 75%;
    margin-left: 25%;
    margin-top: 3rem;
    font-size: 1.7rem;
}

.flowbox dl dd::after {
    position: relative;
    z-index: 10;
    display: block;
    content: '';
    background: url(../img/ico_arrlow_flow.svg) top left no-repeat;
    -webkit-background-size: 2.3rem 2.45rem;
    background-size: 2.3rem 2.45rem;
    width: 2.3rem;
    height: 2.45rem;
    margin-top: 2rem;
    margin-left: -2rem;
}

.flowbox dl dd:last-of-type::after {
    display: none;
}

.flowbox dl dd a {
    display: block;
    width: 70%;
    margin-left: 30%;
    margin-top: 2rem;
    margin-bottom: 2rem;
}

section.cost h2 {
    position: relative;
    z-index: 10;
    left: 50%;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    width: 50%;
}

/* 画像切替 */
section.cost button {
    padding: 0;
}

section.cost .img_close {
    display: block;
}

section.cost .img_open {
    display: none;
}

section.cost .open .img_close {
    display: none;
}

section.cost .open .img_open {
    display: block;
}

section.cost .imgbox img {
    width: 100%;
}

section.cost .txtbox {
    margin-top: 2rem;
}

section.cost .txtbox h3 {
    margin-bottom: 3rem;
    font-size: 3rem;
    font-weight: 700;
    line-height: 1;
}

section.cost .txtbox p {
    margin-bottom: 3rem;
    font-size: 2.2rem;
    font-weight: 700;
}

section.cost .txtbox p small {
    font-size: 1.6rem;
    font-weight: 500;
}

section.cost .txtbox p span {
    font-size: 1.8rem;
    font-weight: 500;
}

section.cost ul.specinfo li,
section.cost ul.specinfo li:nth-of-type(even) {
    margin-bottom: 0;
    margin-left: 1rem;
}

section.cost ul.specinfo li::before {
    position: relative;
    display: inline-block;
    left: -1rem;
    content: '■';
}

/* oem_page */
#oem_page .ankerlink p:first-of-type::before {
    background: url(../img/ico_arrlow_blue.svg) 0 0 no-repeat;
}

#oem_page .ankerlink p:nth-of-type(2)::before {
    background: url(../img/ico_arrlow_red.svg) 0 0 no-repeat;
    -webkit-background-size: 2rem 3.5rem;
    background-size: 2rem 3.5rem;
    width: 2rem;
    height: 3.5rem;
}

#oem_page .flowbox {
    background: url(../img/flow_oem_line.svg) top left repeat-y;
}

#oem_page .img_sub.end::before {
    background: url(../img/flow_oem_arrow.svg) top left no-repeat;
}

#oem_page .oem_off dd span {
    display: block;
    font-size: 1.4rem;
    margin-top: 1.5rem;
}

/* haribako_specs_page */
.specs_list h2 {
    text-align: center;
    font-size: 1.8rem;
    font-weight: 700;
    border: 2px solid #000;
    padding: 1.5rem;
    width: 80%;
    margin: 0 10% 0;
    margin-bottom: 2rem;
}

.specs_list p {
    font-size: 1.2rem;
    margin-bottom: 5rem;
}

.specs_list ul {
    margin-bottom: 3rem;
    /* 高さ違うものも揃える */
    display: -webkit-box;
    display: -moz-box;
    display: -ms-box;
    display: -webkit-flexbox;
    display: -moz-flexbox;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: flex;
    -webkit-box-lines: multiple;
    -moz-box-lines: multiple;
    -webkit-flex-wrap: wrap;
    -moz-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}

.specs_list li {
    display: inline-block;
    width: calc(50% - 1.5rem);
    margin-right: 3rem;
    margin-bottom: 3rem;
}

.specs_list li:nth-of-type(even) {
    margin-right: 0;
}

.specs_list li figcaption {
    display: block;
    text-align: center;
    font-size: 1.4rem;
    margin-top: .5rem;
}

.specs_list #spec06 p {
    margin-top: 5rem;
    margin-bottom: 0;
    padding: 0 2rem;
}

/* haribako_specs_page A4 */
section.onepage-print {
    margin-top: 4rem;
}

/* contact_page */
/* 
#contact_page section.formbox {
	margin-top: 4rem;
}
*/

/* thanks_page */
#contact_page .sec_form {
    text-align: center;
    padding: 6rem 0;
}

#contact_page .sec_form h2 {
    font-size: 2rem;
    margin-bottom: 4rem;
}


/* margin */
section,
#top_page .social_banner,
section.figurebox figure:first-of-type,
section.order .img_sub.start,
section.cost h2,
section.cost ul li {
    margin-bottom: 5rem;
}

section.cost ul li:nth-of-type(even) {
    margin-bottom: 8rem;
}

/* --------------------------------------------------------
form
catalog_page,
contact_page,
quote_page
-------------------------------------------------------- */

section.formbox {
    margin-bottom: 8rem;
}

section.formbox .submit_btn {
    margin-top: 4rem;
}

/* title */
section.formbox h2 {
    position: relative;
    z-index: 10;
    left: 50%;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    width: 50%;
    padding: 0 2rem;
    margin-top: 4rem;
    text-align: center;
}

/* catalog_page */
section.formbox .pdflink {
    display: block;
    text-align: center;
    padding: 6rem 0;
}

section.formbox .pdflink p:first-of-type {
    margin-bottom: 2rem;
}

section.formbox .pdflink a {
    font-weight: 700;
}

section.formbox h3 {
    display: block;
    text-align: center;
    font-size: 1.8rem;
    margin-bottom: 4rem;
}

/* quote_page */
section .form_sec {
    margin-top: 6rem;
}

section .form_title {
    margin-left: -2rem;
    margin-bottom: 6rem;
}

section .form_title figure {
    width: 50%;
    height: auto;
}

section .form_title figcaption {
    padding: 1.5rem 2rem 0;
    font-size: 1.8rem;
}

section .form_title p {
    padding: 1.5rem 2rem 0;
}

.sec_form form label {
    display: block;
    padding: 1rem 0;
    margin-bottom: .5rem;
}

/* quote_page_form_sec01 */
.form_sec01 .radiobox_img {
    display: block;
    width: 50%;
    margin-left: 50%;
    text-align: right;
    height: auto;
    padding: 2rem 0 2rem 2rem;
}

.form_sec01 .form_wdh dt {
    display: inline-block;
    width: 40%;
}

.form_sec01 .form_wdh dd {
    display: inline-block;
    width: 60%;
}

.form_sec01 .form_wdh dd input {
    display: inline-block;
    vertical-align: middle;
    width: 75%;
    margin-right: 1.5rem;
}

/* quote_page_form_sec04 */
.form_sec04 dl {
    padding-top: 3rem;
}

/* quote_page_form_sec10 */
.form_sec10 li {
    text-align: center;
}

.form_sec10 li.banner_line a {
    display: block;
    width: 90%;
    border: 2px solid #000;
    padding: 1rem;
    margin: 0 auto 1.5rem;
}

.form_sec10 li:nth-of-type(4) {
    margin-bottom: 6rem;
}

.form_sec10 li:nth-of-type(5) {
    margin-bottom: 6rem;
}

/* 確認ページ */
.page_conf section.formbox h2 {
    font-size: 2rem;
    width: 100%;
    margin-bottom: 4rem;
}

.kakunin p {
    margin-bottom: 4rem;
    text-align: center;
}

table.kakunin th,
table.kakunin td {
    border: none;
    min-height: 4.5rem;
}

table.kakunin th {
    border-radius: 6px;
}

table.kakunin td {
    padding: 2rem 1rem;
}

/* ----------------------------------------------------------------------------------------------
PC START
---------------------------------------------------------------------------------------------- */
/* --------------------------------------------------------
base layout
-------------------------------------------------------- */

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

    /* for all desktop PC ※縦メニュー位置都合でPC用は幅1024pxのみ */
    #wrapper {
        margin: 0 auto;
        width: 1024px;
        min-height: 100%;
    }

    #header-in,
    #breadcrumb ol,
    #info_box .link_tel,
    #info_box .contact_nav,
    #footer-in,
    footer p {
        margin: 0 auto;
        width: 1024px;
    }

    main.w-all {
        width: 1024px;
        height: 100%;
        min-height: 100%;
        float: none;
        margin: 0;
    }

    #header-in {
        position: relative;
    }

}

/* --------------------------------------------------------
design details
-------------------------------------------------------- */

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

    /* for PC 共通↓ */
    section,
    section.onepage-print {
        margin: 0px -500%;
        padding: 3rem 500%;
        display: block;
    }

    /* --------------------------------------------------------
page_a4
-------------------------------------------------------- */

    #page_a4 header {
        margin-bottom: 25rem;
    }

    #page_a4 .onepage-print {
        margin-bottom: 8rem;
    }


    /* --------------------------------------------------------
header
-------------------------------------------------------- */

    header h1 a img {
        margin: 6rem 2rem 3rem;
        width: 13.5rem;
    }

    #nav-drawer.fixed {
        display: block;
        margin: 0 auto;
        width: 1024px;
        right: 0;
        left: 0;
        padding: 2rem;
    }

    /* index_page */
    #index_page header h1 a img {
        margin: 6rem 2rem 3rem;
        width: 22rem;
    }

    #index_page header ul.social_nav {
        position: absolute;
        top: 7.5rem;
        right: 1rem;
    }

    #index_page header ul.social_nav a {
        padding: 1rem;
    }

    #index_page header ul.social_nav a img {
        width: auto;
        height: 8rem;
    }

    /* --------------------------------------------------------
nav
-------------------------------------------------------- */

    #nav-drawer {
        top: 15rem;
    }

    /*side_nav*/
    #side_nav {
        top: 7.6rem;
    }

    #side_nav ul.social_nav li a {
        margin-bottom: 2rem;
    }

    /*vertical_nav*/
    ul.vertical_nav {
        display: block;
        position: absolute;
        z-index: 99;
        margin-top: -6rem;
        margin-left: 4rem;
    }

    ul.vertical_nav li {
        display: inline-block;
        padding-left: 1.5rem;
    }

    ul.vertical_nav li:last-of-type {
        padding-left: 6rem;
    }

    ul.vertical_nav li img {
        width: 6.2rem;
        height: auto;
    }

    ul.vertical_nav li a {
        display: block;
        border: 2px solid transparent;
    }

    ul.vertical_nav li a:hover,
    ul.vertical_nav li.stay a {
        border: 2px solid #000;
        background-color: rgba(255, 255, 255, 0.5)
    }

    ul.vertical_nav li a:hover,
    ul.vertical_nav li a:hover img {
        opacity: 1;
        filter: opacity(100%);
    }

    /*icon120%*/
    #nav-open,
    .ico-close,
    .ico-btn img {
        width: 2.88rem;
        height: 2.88rem;
    }

    ul.social_nav li a img {
        width: auto;
        height: 2.88rem;
    }

    /* --------------------------------------------------------
footer
-------------------------------------------------------- */

    /* --------------------------------------------------------
access
-------------------------------------------------------- */

    #access h2 {
        font-size: 3rem;
        margin-bottom: 4rem;
    }

    #access #info_box {
        background: url(../img/bg_black_l.png) top left repeat-y;
        background-size: 100% auto;
        padding: 6rem 2rem;
    }

    address {
        max-width: 60%;
        margin: 0 auto;
        text-align: center;
    }

    #access p {
        display: inline-block;
        text-align: left;
        font-size: 2.2rem;
    }

    /* --------------------------------------------------------
MV
-------------------------------------------------------- */

    section.mv h2 {
        padding-right: 0;
    }

    /* top_page */
    #top_page section.mv p {
        width: 50%;
        bottom: 10rem;
        margin-bottom: -10rem;
    }

    #top_page section.mv {
        margin-bottom: 1rem;
    }

    /* --------------------------------------------------------
main
-------------------------------------------------------- */

    section p {
        display: inline-block;
        text-align: left;
        font-size: 1.8rem;
    }


    section .banner {
        margin-right: 0;
        text-align: right;
    }

    p.txtbox_black {
        padding: 3rem;
        width: 80%;
        margin-left: 20%;
        bottom: 10rem;
        margin-bottom: -10rem;
        right: 0;
    }

    section .banner {
        margin-right: 0;
        margin-bottom: 3rem;
    }

    .ankerlink {
        margin-top: 0;
    }

    .ankerlink p {
        vertical-align: text-top;
        margin-left: 5rem;
    }

    /* index_page */
    .weblinkbox div.banner:nth-of-type(1) figure {
        display: inline-block;
        vertical-align: middle;
        width: 38%;
        height: auto;
        padding: 5rem;
    }

    .weblinkbox div.banner:nth-of-type(2) figure {
        display: inline-block;
        vertical-align: middle;
        width: 38%;
        height: auto;
        padding: 5rem;
    }

    .weblinkbox div.banner:nth-of-type(1),
    .weblinkbox div.banner:nth-of-type(2) {
        text-align: center;
    }

    .weblinkbox div.banner p {
        display: inline-block;
        vertical-align: middle;
        width: 62%;
        font-size: 2rem;
        line-height: 1.8;
        padding: 5rem;
    }

    .weblinkbox div.banner p span {
        font-size: 1.6rem;
        padding: 1rem;
        background-color: #FFF;
        width: 70%;
        margin-top: 3.5rem;
        margin-left: 30%;
    }

    .weblinkbox div.banner:nth-of-type(3) {
        position: relative;
        margin-top: 7rem;
    }

    .weblinkbox div.banner:nth-of-type(3) p {
        position: absolute;
        bottom: 2.5rem;
        left: 0;
        width: 100%;
        margin: 0;
    }

    .weblinkbox div.banner:nth-of-type(3) p img {
        width: 65%;
        padding-bottom: .5rem;
    }

    .weblinkbox div.banner:nth-of-type(3) figure {
        text-align: right;
        margin-top: -3rem;
    }

    .weblinkbox div.banner:nth-of-type(3) figure img {
        width: 100%;
        height: auto;
    }

    .weblinkbox div.banner:nth-of-type(3) a:hover {
        display: block;
        width: 100%;
    }

    /* top_page */
    #top_page .social_banner {
        text-align: right;
    }

    #top_page .social_banner li {
        display: inline-block;
        width: calc(33% - 3rem);
        margin-left: 3rem;
    }

    #top_page .social_banner li a img {
        width: 100%;
        height: auto;
        margin: 0 auto 2rem;
    }

    #top_page section.new h2 {
        font-size: 2.2rem;
        margin: 0 0 1rem 0;
        padding: 0 0 7rem 27%;
    }

    /* haribako_about_page */
    .linkbox .banner a {
        padding: 3rem 3rem 0;
    }

    .linkbox .banner h3 {
        display: inline-block;
        width: 34%;
        text-align: left;
        margin-right: 7%;
        padding-bottom: 3rem;
    }

    .linkbox .banner p {
        display: inline-block;
        width: 58%;
        margin-left: 0;
        text-align: right;
        vertical-align: bottom;
    }

    .figurebox figure {
        display: block;
        text-align: center;
    }

    #haribako_about_page .figurebox figure {
        padding: 0 13rem;
    }

    #haribako_about_page .img_sub.start {
        position: relative;
    }

    #haribako_about_page .img_sub.start figure {
        display: inline-block;
        margin-left: -2rem;
        padding-right: 1rem;
    }

    #haribako_about_page .img_sub.start p.banner_line {
        position: absolute;
        bottom: inherit;
        top: 7.2rem;
        margin-bottom: 0;
        width: 33%;
        margin-left: 67%;
    }

    #haribako_about_page .img_sub.start p.move_txt {
        position: absolute;
        bottom: 6rem;
        right: 0;
        width: 65%;
        margin-left: 35%;
    }

    .flowbox {
        background: url(../img/flow_order_line.svg) top left repeat-y;
        -webkit-background-size: 50rem auto;
        background-size: 50rem auto;
        margin-left: -2rem;
    }

    .img_sub.end::before {
        background: url(../img/flow_order_arrow.svg) top left no-repeat;
        -webkit-background-size: 50rem auto;
        background-size: 50rem auto;
        height: 11rem;
        margin-left: -2rem;
    }

    .flowbox h3,
    .flowbox ul li {
        font-size: 1.8rem;
    }

    .flowbox h3 {
        display: inline-block;
        vertical-align: top;
        margin-top: 3rem;
        width: 18%;
        margin-left: 20%;
    }

    .flowbox ul {
        display: inline-block;
        vertical-align: top;
        margin-top: 3rem;
        width: 58%;
        margin-left: 0;
    }

    .flowbox dl dt {
        display: inline-block;
        vertical-align: middle;
        width: 27%;
        margin-top: 3rem;
    }

    .flowbox dl dd {
        display: inline-block;
        vertical-align: middle;
        font-size: 1.8rem;
        width: 72%;
        margin-left: 0;
        padding-left: 3.5rem;
        margin-top: 0;
    }

    .flowbox dl dd:last-of-type {
        padding-top: 2.5rem;
    }

    .flowbox dl dt::after {
        position: relative;
        z-index: 10;
        display: block;
        content: '';
        background: url(../img/ico_arrlow_flow.svg) top left no-repeat;
        -webkit-background-size: 2.3rem 2.45rem;
        background-size: 2.3rem 2.45rem;
        width: 2.3rem;
        height: 2.45rem;
        margin-top: 2rem;
        margin-left: 18.5rem;
    }

    .flowbox dl dt:last-of-type::after {
        display: none;
    }

    .flowbox dl dd::after {
        display: none;
    }

    #haribako_about_page .flowbox dl div {
        position: relative;
        border: 2px solid #000;
        margin-left: 4rem;
    }

    #haribako_about_page .flowbox dl div dt {
        margin-left: -4rem;
        width: calc(23.5% + 4rem);
    }

    #haribako_about_page .flowbox dl div dd a {
        display: block;
        position: absolute;
        right: 2rem;
        bottom: -1rem;
        text-align: right;
        width: 28rem;
        margin: 0;
    }

    #haribako_about_page .flowbox dl div dd a:hover {
        background-color: #fff;
        opacity: 1;
        filter: opacity(100%);
    }

    #haribako_about_page .flowbox dl div dt:nth-of-type(2),
    #haribako_about_page .flowbox dl div dd:nth-of-type(2) {
        padding-bottom: 2rem;
    }

    #haribako_about_page .flowbox dl div dd:nth-of-type(2) {
        padding-top: 4rem;
    }

    #haribako_about_page .flowbox dl div dt:nth-of-type(2)::after {
        position: absolute;
        z-index: 10;
        display: block;
        content: '';
        background: url(../img/ico_arrlow_flow.svg) top left no-repeat;
        -webkit-background-size: 2.3rem 2.45rem;
        background-size: 2.3rem 2.45rem;
        width: 2.3rem;
        height: 2.45rem;
        margin-top: 2rem;
        margin-left: 18.5rem;
    }

    section.cost h2 {
        width: 20%;
        margin-bottom: 12rem;
    }

    section.cost ul li {
        margin-bottom: 10rem;
    }

    section.cost .imgbox {
        display: inline-block;
        vertical-align: top;
        width: 30%;
        text-align: right;
    }

    section.cost .txtbox {
        display: inline-block;
        vertical-align: top;
        width: calc(69% - 3rem);
        padding-left: 3rem;
        position: relative;
        margin: 0;
    }

    section.cost .txtbox h3 {
        font-size: 3.6rem;
        margin-bottom: 5rem;
    }

    section.cost .txtbox p {
        position: absolute;
        right: 0;
        top: -2rem;
        text-align: right;
    }

    section.cost .txtbox p small {
        font-size: 1.4rem;
        font-weight: 500;
    }

    /* oem_page */
    #oem_page .flowbox {
        background: url(../img/flow_oem_line.svg) top left repeat-y;
        -webkit-background-size: 51rem auto;
        background-size: 51rem auto;
        margin-left: -2rem;
    }

    #oem_page .img_sub.end::before {
        background: url(../img/flow_oem_arrow.svg) top left no-repeat;
        -webkit-background-size: 51rem auto;
        background-size: 51rem auto;
        height: 11rem;
        margin-left: -2rem;
    }

    #oem_page .flowbox h3 {
        display: block;
        margin-top: -12rem;
        width: 44%;
        margin-left: 55%;
    }

    #oem_page .flowbox ul {
        display: block;
        margin-top: 2rem;
        width: 44%;
        margin-left: 55%;
        padding-left: .5rem;
    }

    #oem_page .oem_off dd span {
        font-size: 1.6rem;
    }

    /* haribako_specs_page */
    #haribako_specs_page .ankerlink {
        margin-top: -21rem;
    }

    #haribako_specs_page .ankerlink p {
        display: block;
    }

    .specs_list h2 {
        font-size: 2rem;
        padding: 3.25rem;
        width: 60%;
        margin: 0 auto;
        margin-bottom: 2rem;
    }

    .specs_list p {
        display: block;
        font-size: 1.4rem;
        text-align: right;
        margin-bottom: 7rem;
    }

    .specs_list ul {
        margin-bottom: 12rem;
    }

    .specs_list li {
        display: inline-block;
        width: calc(25% - 2.25rem);
        margin-right: 3rem;
        margin-bottom: 3rem;
    }

    .specs_list li:nth-of-type(even) {
        margin-right: 3rem;
    }

    .specs_list li:nth-of-type(4n) {
        margin-right: 0;
    }

    .specs_list #spec06 p {
        width: 70%;
        max-width: 70rem;
        margin: 0 auto;
        margin-top: 7rem;
        margin-bottom: 0;
        padding: 0;
    }

    /* margin */
    section,
    #top_page .social_banner,
    section.figurebox figure:first-of-type,
    section.order .img_sub.start {
        margin-bottom: 5rem;
    }

    section.cost ul li:nth-of-type(even) {
        margin-bottom: 8rem;
    }

    /* --------------------------------------------------------
form
catalog_page,
contact_page,
quote_page
-------------------------------------------------------- */

    input[type="text"],
    input[type="password"],
    input[type="email"],
    input[type="tel"],
    input[type="number"],
    input[type="file"],
    textarea,
    select {
        padding: 1.25rem;
        width: 100%;
    }

    .btn,
    input.btn {
        width: 50%;
        margin: 0 auto 3rem;
        padding: 2rem;
        font-size: 2rem;
        line-height: 1;
    }

    section.formbox .submit_btn {
        margin-top: 0;
    }

    .form_sec .w100 dt,
    .form_sec .w100 dd {
        width: 100%;
    }

    /* title */
    section.formbox h2 {
        width: 25%;
    }

    /* catalog_page */
    section.formbox .pdflink p {
        width: 100%;
        text-align: center;
        margin-bottom: 2rem;
    }


    section.formbox .pdflink {
        padding: 7rem 0;
    }

    section.formbox h3 {
        font-size: 2rem;
    }

    section.sec_contents,
    section.sec_form {
        margin: 0px -500%;
        padding: 8rem 500%;
        display: block;
    }

    .formbox h2 img {
        margin-bottom: 5rem;
    }

    .sec_form form {
        width: 90%;
        max-width: 880px;
        margin: 0 auto;
    }

    .sec_form form dl {
        display: inline-block;
    }

    .sec_form form dt {
        display: inline-block;
        width: 25%;
        vertical-align: top;
        padding-top: 1.5rem;
        margin-bottom: 3rem;
    }

    .sec_form form dd {
        display: inline-block;
        width: 75%;
        margin-bottom: 3rem;
    }

    /* contact_page */
    #contact_page .sec_form {
        text-align: center;
        padding: 0 0 6rem;
        margin: 0 auto;
    }

    /* quote_page */

    #quote_page .ankerlink {
        margin-top: -15rem;
    }

    #quote_page .ankerlink p {
        display: block;
    }

    #quote_page section .form_title {
        display: inline-block;
        vertical-align: top;
        width: 27%;
    }

    #quote_page .sec_form form dd:after {
        display: none;
    }

    #quote_page section .form_sec {
        margin-top: 2rem;
    }

    #quote_page .btn,
    #quote_page input.btn {
        margin-top: 3rem;
    }

    section .form_innner {
        display: inline-block;
        vertical-align: top;
        width: calc(72% - 4rem);
        margin-left: 4rem;
    }

    section .form_title figure {
        width: 100%;
        height: auto;
    }

    section .form_title figcaption {
        padding: 1.5rem 1.5rem 0;
        font-size: 2rem;
    }

    section .form_title p {
        padding: 2.5rem 1.5rem 0;
        font-size: 1.6rem;
    }

    section .form_sec01 .form_innner {
        margin-top: 9.5rem;
    }

    section .form_sec02 .form_innner {
        margin-top: 13rem;
    }

    section .form_sec03 .form_innner {
        margin-top: 10.5rem;
    }

    section .form_sec04 .form_innner {
        margin-top: 8rem;
    }

    section .form_sec05 .form_innner {
        margin-top: 7rem;
    }

    section .form_sec05_tmp .form_innner {
        margin-top: 6.5rem;
    }

    section .form_sec06 .form_innner {
        margin-top: 9.5rem;
    }

    section .form_sec07 .form_innner {
        margin-top: 7.25rem;
    }

    section .form_sec08 .form_innner {
        margin-top: 5.5rem;
    }

    section .form_sec09 .form_innner {
        margin-top: 7rem;
    }

    section .form_sec10 .form_innner {
        margin-top: 10rem;
    }

    /* quote_page_form_sec01 */
    .form_sec01 .radiobox_img {
        width: 22%;
        margin-left: 74%;
        margin-top: -20%;
        text-align: left;
    }

    .sec_form form .form_sec01 label {
        margin-bottom: 7rem;

    }

    .sec_form form .form_sec01 label:last-of-type {
        margin-bottom: 3rem;
    }

    .form_sec01 .form_wdh dt {
        width: 20%;
        margin-left: 20%;
    }

    .form_sec01 .form_wdh dd {
        text-align: right;
    }

    /* quote_page_form_sec04 */
    .form_sec04 .w100 dt::after {
        display: block;
        content: '';
        margin-top: -1rem;
        border-bottom: 2px solid #000;
        width: 65%;
        margin-left: 15%;
    }

    /* quote_page_form_sec06 */
    .form_sec06 .notice_txt {
        display: block;
        padding-top: 2rem;
    }

    /* quote_page_form_sec10 */
    .form_sec10 {
        margin-bottom: 6rem;
    }

    .form_sec10 li figure,
    .form_sec10 li h3 {
        display: inline-block;
        vertical-align: middle;
        margin-bottom: 0;
    }

    .form_sec10 li h3 {
        padding-left: 1rem;
    }

    .form_sec10 li:nth-of-type(1) {
        margin-bottom: 6rem;
    }

    .form_sec10 li.banner_line a {
        display: block;
        width: 90%;
        border: 2px solid #000;
        padding: 3rem;
        margin: 0 auto 3rem;
        font-size: 2rem;
    }

    /* 確認ページ */

    .page_conf ul.vertical_nav {
        display: none;
    }

    .page_conf section.formbox h2 {
        font-size: 2rem;
        width: 100%;
    }

    .kakunin p {
        font-size: 1.6rem;
        display: block;
        margin-bottom: 6rem;
        text-align: center;
    }


    .kakunin table th,
    .kakunin table td {
        width: 100%;
    }

    .kakunin .btn01 input.btn,
    .kakunin .btn02 input.btn {
        width: 100%;
    }


    /* thanks_page */
    #contact_page.thanks_page .sec_form {
        text-align: center;
        padding: 12rem 0;
        margin: 0 auto;
    }

    #contact_page.thanks_page .sec_form h2 {
        font-size: 3rem;
        margin-bottom: 6rem;
    }

    #contact_page.thanks_page .sec_form p {
        text-align: center;
    }

    /* --------------------------------------------------------
table
-------------------------------------------------------- */

    table th {
        width: 30%;
    }

    table td {
        width: 70%;
    }


    /* ----------------------------------------------------------------------------------------------
PC END
---------------------------------------------------------------------------------------------- */
}


/* ----------------------------------------------------------------------------------------------
for iPad&tablet 縦 START
---------------------------------------------------------------------------------------------- */
@media screen and (max-width: 991px) and (min-width: 768px) {

    #wrapper,
    #header-in,
    #breadcrumb ol,
    #info_box .link_tel,
    #info_box .contact_nav,
    #footer-in,
    footer p,
    main.w-all {
        width: 730px;
        margin: 0 auto;
        display: block;
    }

    #nav-drawer.fixed {
        display: block;
        margin: 0 auto;
        width: 730px;
        right: 0;
        left: 0;
        padding: 2rem;
    }

    section .banner {
        margin-right: -4.1rem;
        margin-bottom: 2rem;
    }

    section.mv h2 {
        padding-right: 6rem;
    }

    /*vertical_nav*/
    ul.vertical_nav {
        margin-left: 1rem;
    }

    /* index_page */
    .weblinkbox div.banner:nth-of-type(3) p {
        bottom: 2rem;
        line-height: 1.3;
    }

    .weblinkbox div.banner:nth-of-type(3) p img {
        width: 80%;
        margin-bottom: 0;
    }

    /* top_page */
    #top_page section.mv h2 {
        display: block;
        margin-right: -4rem;
    }

    #top_page section.new h2 {
        margin: 0 -4rem 1rem 0;
        padding: 0 0 5rem 29%;
    }

    /* haribako_about_page */
    #haribako_about_page .figurebox figure {
        padding: 0 6rem;
    }

    #haribako_about_page .img_sub.start figure {
        margin-left: -4rem;
    }

    #haribako_about_page .img_sub.start figure img {
        max-width: 73%;
    }

    #haribako_about_page .img_sub.start p.banner_line {
        width: 32%;
        top: 5.3rem;
    }

    #haribako_about_page .img_sub.start p.move_txt {
        bottom: inherit;
        top: 28rem;
    }

    #haribako_about_page .img_sub.start {
        margin-bottom: 14rem;
    }

    .flowbox {
        margin-left: -4rem;
    }

    .flowbox dl dt::after,
    #haribako_about_page .flowbox dl div dt:nth-of-type(2)::after {
        margin-left: 17rem;
    }

    #haribako_about_page .flowbox dl div dt {
        width: calc(27% + 1.5rem);
    }

    #haribako_about_page .flowbox dl div dd a {
        width: 18rem;
        bottom: -.75rem;
    }

    .img_sub.end::before {
        margin-left: -4rem;
    }

    section.cost h2 {
        width: 35%;
        margin-bottom: 12rem;
    }

    section.cost .imgbox {
        width: 25%;
    }

    section.cost .txtbox {
        width: calc(77% - 3rem);
    }

    /* oem_page */
    #oem_page .flowbox h3 {
        display: block;
        margin-top: 3rem;
        width: 34%;
        margin-left: 65%;
    }

    #oem_page .flowbox ul {
        display: block;
        margin-top: 2rem;
        width: 34%;
        margin-left: 65%;
        padding-left: .5rem;
    }

    /* haribako_specs_page */
    #haribako_specs_page .ankerlink {
        margin-top: 3rem;
    }

    #haribako_specs_page .ankerlink p {
        display: block;
    }

    /* form catalog_page,contact_page,quote_page */

    /* catalog_page */
    section.formbox .pdflink p br.sp_only {
        display: block;
    }

    /* quote_page */
    #quote_page .ankerlink {
        margin-top: 3rem;
    }

    #quote_page section.formbox {
        margin: 0px auto;
        padding: 0 0 8rem;
    }

    #quote_page .sec_form form {
        width: 100%;
        max-width: 100%;
        margin: 0 auto;
    }

    #quote_page section.formbox h2 {
        width: 50%;
    }

    #quote_page section .form_title {
        margin-left: -4rem;
        width: 25%;
    }

    #quote_page section .form_innner {
        width: 74.5%;
    }

    .sec_form form .form_sec05 dt,
    .sec_form form .form_sec05_tmp dt,
    .sec_form form .form_sec07 dt,
    .sec_form form .form_sec08 dt,
    .sec_form form .form_sec09 dt {
        width: 29%;
    }

    .sec_form form .form_sec05 dd,
    .sec_form form .form_sec05_tmp dd,
    .sec_form form .form_sec07 dd,
    .sec_form form .form_sec08 dd,
    .sec_form form .form_sec09 dd {
        width: 70%;
    }

    section .form_sec01 .form_innner {
        margin-top: 7rem;
    }

    section .form_sec02 .form_innner {
        margin-top: 9.5rem;
    }

    section .form_sec03 .form_innner {
        margin-top: 7.5rem;
    }

    section .form_sec04 .form_innner {
        margin-top: 6rem;
    }

    section .form_sec05 .form_innner {
        margin-top: 4.5rem;
    }

    section .form_sec05_tmp .form_innner {
        margin-top: 6.5rem;
    }

    section .form_sec06 .form_innner {
        margin-top: 6.5rem;
    }

    section .form_sec07 .form_innner {
        margin-top: 5rem;
    }

    section .form_sec08 .form_innner {
        margin-top: 3.5rem;
    }

    section .form_sec09 .form_innner {
        margin-top: 4.5rem;
    }

    section .form_sec10 .form_innner {
        margin-top: 5rem;
    }

    /* ----------------------------------------------------------------------------------------------
for iPad&tablet 縦 END
---------------------------------------------------------------------------------------------- */
}





/* ----------------------------------------------------------------------------------------------
For Win css_browser_selector.js
---------------------------------------------------------------------------------------------- */

/* webフォントのアンチエイリアスを綺麗に */
.win h1,
.win h2,
.win h3,
.win p,
.win li,
.win dd,
.win dt,
.win figcaption,
.win label {
    font-weight: 500;
    transform: rotate(.03deg);
}

/* ----------------------------------------------------------------------------------------------
For IE
---------------------------------------------------------------------------------------------- */

@media all and (-ms-high-contrast:none) {

    input[type="checkbox"]:checked + span::before {
        background-color: #fbfbfb;
        background-image: url("../img/ico_check_for_ie.png");
        background-repeat: no-repeat;
        background-position: center;
        background-size: 2.4rem 2.4rem;
    }

    input[type="radio"]:checked + span::before {
        background-color: #fbfbfb;
        background-image: url("../img/ico_radio_for_ie.png");
        background-repeat: no-repeat;
        background-position: center;
        background-size: 2.4rem 2.4rem;
    }

    select::-ms-expand {
        display: none;
    }

    textarea {
        overflow: auto;
    }

    .flowbox {
        background: url(../img/flow_order_line.png) top left repeat-y;
        -webkit-background-size: 50rem auto;
        background-size: 50rem auto;
        margin-left: -2rem;
    }

    .img_sub.end::before {
        background: url(../img/flow_order_arrow.png) top left no-repeat;
        -webkit-background-size: 50rem auto;
        background-size: 50rem auto;
        height: 11rem;
        margin-left: -2rem;
    }

    #oem_page .flowbox {
        background: url(../img/flow_oem_line.png) top left repeat-y;
        -webkit-background-size: 51rem auto;
        background-size: 51rem auto;
        margin-left: -2rem;
    }

    #oem_page .img_sub.end::before {
        background: url(../img/flow_oem_arrow.png) top left no-repeat;
        -webkit-background-size: 51rem auto;
        background-size: 51rem auto;
        height: 11rem;
        margin-left: -2rem;
    }

    /* ----------------------------------------------------------------------------------------------
For IE END
---------------------------------------------------------------------------------------------- */
}

/* ----------------------------------------------------------------------------------------------
For Edge
---------------------------------------------------------------------------------------------- */

@supports (-ms-ime-align: auto) {

    /* ----------------------------------------------------------------------------------------------
For Edge END
---------------------------------------------------------------------------------------------- */
}

/* ----------------------------------------------------------------------------------------------
追加調整
---------------------------------------------------------------------------------------------- */

/* iPhone5 @media */
@media screen and (max-width: 374px) {}

/* ----------------------------------------------------------------------------------------------
 END
---------------------------------------------------------------------------------------------- */