/*!
Theme Name: secondfactory
Theme URI: http://underscores.me/
Author: Underscores.me
Author URI: http://underscores.me/
Description: Description
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: secondfactory
Tags: custom-background, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned with others.

secondfactory is based on Underscores https://underscores.me/, (C) 2012-2017 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.

Normalizing styles have been helped along thanks to the fine work of
Nicolas Gallagher and Jonathan Neal https://necolas.github.io/normalize.css/
*/



@charset "utf-8";



/*! normalize.css v2.1.3 | MIT License | git.io/normalize */article,aside,details,figcaption,figure,footer,header,hgroup,main,nav,section,summary{display:block}audio,canvas,video{display:inline-block}audio:not([controls]){display:none;height:0}[hidden],template{display:none}html{font-family:sans-serif;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}body{margin:0}a{background:transparent}a:focus{outline:thin dotted}a:active,a:hover{outline:0}h1{font-size:2em;margin:.67em 0}abbr[title]{border-bottom:1px dotted}b,strong{font-weight:700}dfn{font-style:italic}hr{-moz-box-sizing:content-box;box-sizing:content-box;height:0}mark{background:#ff0;color:#000}code,kbd,pre,samp{font-family:monospace,serif;font-size:1em}pre{white-space:pre-wrap}q{quotes:"\201C" "\201D" "\2018" "\2019"}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sup{top:-.5em}sub{bottom:-.1em}img{border:0}svg:not(:root){overflow:hidden}figure{margin:0}fieldset{border:1px solid silver;margin:0 2px;padding:.35em .625em .75em}legend{border:0;padding:0}button,input,select,textarea{font-family:inherit;font-size:100%;margin:0}button,input{line-height:normal}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}input[type=checkbox],input[type=radio]{box-sizing:border-box;padding:0}input[type=search]{-webkit-appearance:textfield;-moz-box-sizing:content-box;-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}button::-moz-focus-inner,input::-moz-focus-inner{border:0;padding:0}textarea{overflow:auto;vertical-align:top}table{border-collapse:collapse;border-spacing:0}


























/* Elements
 * ====================================================================== */
/* Break Points
 * ====================================================================== */
/* Font Size
 * ====================================================================== */
/* Reset
 * ====================================================================== */
/* Customize */
div,
dl,
dt,
dd,
ul,
ol,
li,
h1,
h2,
h3,
h4,
h5,
h6,
pre,
code,
form,
fieldset,
legend,
input,
textarea,
p,
blockquote,
th,
td {
    margin: 0;
    padding: 0;
}

ul,
ol {
    list-style: none;
}

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

img {
    vertical-align: bottom;
}

/* Font
 * ====================================================================== */
@font-face {
    font-family: "nobel-light";
    src: url("font/nobel-light.eot") format('eot'), url("font/nobel-light.woff") format('woff');
}

@font-face {
    font-family: "nobel-regular";
    src: url("font/nobel-regular.eot") format('eot'), url("font/nobel-regular.woff") format('woff');
}

@font-face {
    font-family: "monoton-num";
    src: url("font/monoton-num.eot") format('eot'), url("font/monoton-num.woff") format('woff');
}

/* Common
 * ====================================================================== */
body {
    font-size: 13px;
    font-family: 'Lucida Grande', 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', Meiryo, 'メイリオ', sans-serif;
    background-repeat: repeat;
}

.main {
    color: #2e2e2e;
}

a {
    color: #000;
    text-decoration: none;
    border-bottom: 1px dotted #2e2e2e;
}

a:hover {
    color: #666;
}

.gnav a,
.snav a,
.common-header a,
.common-footer a {
    color: inherit;
    text-decoration: none;
    border-bottom: none;
}

.gnav a:hover,
.snav a:hover,
.common-header a:hover,
.common-footer a:hover {
    color: inherit;
}

@media screen and (max-width: 767px) {
    html {
        position: relative;
        min-height: 100%;
    }

    body {
        margin-bottom: 190px;
    }
}

@media screen and (min-width: 768px) {
    html {
        position: relative;
        min-height: 100%;
    }

    body {
        margin-bottom: 605px;
    }

    .br-sp {
        display: none;
    }
}

/* Elements
 * ====================================================================== */
.blue-box {
    color: #2b468d;
}

.icon-external-link {
    display: inline-block;
    width: 12px;
    height: 11px;
    margin: 0 5px;
    background: transparent url("common/img/icon-external-link.png") 0 0 no-repeat;
}

.icon-download-link {
    display: inline-block;
    width: 13px;
    height: 17px;
    margin: 0 5px;
    background: transparent url("common/img/icon-download-link.png") 0 0 no-repeat;
}

.roundbtn {
    border-radius: 6px;
    font-size: 139%;
    background-color: #d6d153;
    color: #fff;
    text-decoration: none;
    border-bottom: 0;
}

.roundbtn:hover {
    color: #eee;
}

@media screen and (max-width: 767px) {
    .roundbtn {
        display: block;
        padding: 6px 0;
        text-align: center;
    }
}

@media screen and (min-width: 768px) {
    .roundbtn {
        display: inline-block;
        padding: 6px 24px;
    }
}

.roundbtn-b {
    border-radius: 6px;
    font-size: 139%;
    background-color: #2b468d;
    color: #fff;
    text-decoration: none;
    border-bottom: 0;
}

.roundbtn-b:hover {
    color: #eee;
}

@media screen and (max-width: 767px) {
    .roundbtn-b {
        display: block;
        padding: 6px 0;
        text-align: center;
    }
}

@media screen and (min-width: 768px) {
    .roundbtn-b {
        display: inline-block;
        padding: 6px 24px;
    }
}

@media screen and (max-width: 767px) {
    .nav-ctrl {
        display: none;
    }
}

@media screen and (min-width: 768px) {
    .nav-ctrl {
        margin-top: 10px;
    }

    .nav-ctrl a {
        border-bottom: none;
    }

    .nav-ctrl ul {
        display: table;
        width: 100%;
    }

    .nav-ctrl li {
        display: table-cell;
        width: 33.33%;
        text-align: center;
        vertical-align: middle;
    }

    .nav-ctrl li:first-child {
        text-align: left;
    }

    .nav-ctrl li:last-child {
        text-align: right;
    }

    .nav-ctrl .nav-ctrl-item {
        display: inline-block;
        text-indent: 200%;
        white-space: nowrap;
        overflow: hidden;
    }

    .nav-ctrl .nav-ctrl-item.nav-ctrl-back {
        width: 90px;
        height: 37px;
        text-align: left;
        background: transparent url("common/img/ctrl_back.png") 50% 50% no-repeat;
    }

    .nav-ctrl .nav-ctrl-item.nav-ctrl-list {
        width: 91px;
        height: 37px;
        text-align: center;
        background: transparent url("common/img/ctrl_list.png") 50% 50% no-repeat;
    }

    .nav-ctrl .nav-ctrl-item.nav-ctrl-next {
        width: 90px;
        height: 37px;
        text-align: right;
        background: transparent url("common/img/ctrl_next.png") 50% 50% no-repeat;
    }

    .nav-ctrl.nav-ctrl-top {
        max-width: 1014px;
        margin: 10px auto;
    }

    .nav-ctrl.nav-ctrl-bottom {
        max-width: 1014px;
        margin: 10px auto;
    }
}

/* Page Header
 * ====================================================================== */
.grouplogo-wrapper {
    width: 100%;
    max-width: 1020px;
    margin: 0 auto;
}

.grouplogo {
    margin: 0 10px 0 auto;
    width: 122px;
    background-color: #e8e8e8;
    padding: 8px 20px 10px;
}

@media screen and (max-width: 767px) {
    .common-header {
        height: 35px;
    }

    .grouplogo-wrapper {
        display: none;
    }
}

@media screen and (min-width: 768px) {
    .common-header {
        border-top: 6px solid #e8e8e8;
    }
}

/* Site Logo
 * ====================================================================== */
.sitelogo a {
    display: block;
}

@media screen and (max-width: 767px) {
    .sitelogo {
        width: 166px;
        height: 22px;
        margin: 15px auto 0 15px;
    }

    .sitelogo a {
        width: 166px;
        height: 22px;
        background: url("common/img/logo_horizon.png");
        background-size: 166px 22px;
    }
}

@media screen and (min-width: 768px) {
    .sitelogo {
        width: 88px;
        height: 65px;
        margin: 17px auto 14px;
    }

    .sitelogo a {
        width: 88px;
        height: 65px;
        background: url("common/img/logo.png");
        background-size: 88px 65px;
    }
}

/* Menu
 * ====================================================================== */
@media screen and (max-width: 767px) {
    .togglebtn {
        display: block;
        position: absolute;
        cursor: pointer;
        right: 15px;
        top: 15px;
    }

    .gnav {
        z-index: 9999;
        display: none;
        position: absolute;
        width: 100%;
    }

    .gnav .menu-item {
        position: relative;
    }

    .gnav .menu-item .top-link {
        text-transform: uppercase;
        font-family: "nobel-light";
        display: block;
        border-top: 1px solid #365196;
        border-bottom: 1px solid #243e81;
        padding: 15px;
        background-color: #2b468d;
        color: #fff;
        text-decoration: none;
        font-weight: normal;
        font-size: 100%;
    }

    .gnav .menu-item .top-link:hover {
        background-color: #405ca7;
    }

    .gnav .submenu-togglearrow {
        display: block;
        position: absolute;
        width: 9px;
        height: 6px;
        top: 20px;
        right: 24px;
        background: transparent url("common/img/snav-openarrow.png") no-repeat 0 0;
        background-size: 9px 12px;
    }

    .gnav .submenu-togglearrow-reverse {
        background-position: 0 -6px;
    }

    .gnav .top-social {
        border-top: 1px solid #365196;
        border-bottom: 1px solid #243e81;
        padding: 0;
        background-color: #2b468d;
    }

    .gnav .top-social a {
        display: inline-block;
        padding: 9px 15px;
    }

    .gnav .top-social a:first-child {
        padding-right: 10px;
    }

    .gnav .top-social a:last-child {
        padding-left: 10px;
    }

    .gnav .submenu {
        display: none;
    }

    .gnav .submenu-item {
        list-style-type: none;
    }

    .gnav .submenu-item > a {
        display: block;
        border-top: 1px solid #365196;
        border-bottom: 1px solid #243e81;
        padding: 15px 15px 15px 30px;
        background-color: #2b468d;
        color: #fff;
        text-decoration: none;
        font-weight: normal;
        font-size: 93%;
    }

    .gnav .submenu-item > a img {
        display: none;
    }

    .gnav .submenu-item > a:hover {
        background-color: #405ca7;
    }
}

@media screen and (min-width: 768px) {
    .togglebtn {
        display: none;
    }

    .gnav {
        position: relative;
        border-top: 1px solid #e8e8e8;
        border-bottom: 1px solid #e8e8e8;
    }

    .gnav .top-menu {
        display: table;
        margin: 10px auto;
        width: 100%;
        max-width: 1020px;
    }

    .gnav .menu-item {
        display: table-cell;
        width: 12.5%;
        height: 30px;
        text-align: center;
        vertical-align: middle;
        list-style-type: none;
    }

    .gnav .menu-item > a {
        color: #333;
        text-decoration: none;
        text-transform: uppercase;
        font-family: "nobel-regular";
        font-weight: normal;
    }

    .gnav .menu-item > a:hover {
        color: #f72bf5;
    }

    .gnav .top-home {
        display: none;
    }

    .gnav .top-social {
        display: table-cell;
        height: 30px;
        text-align: right;
    }

    .gnav .top-social > a:last-child {
        margin-right: 10px;
    }

    .gnav .submenu {
        display: none;
    }

    .gnav .gnav-arrow {
        position: absolute;
        display: none;
        background: transparent url("common/img/gnav-arrow.png") no-repeat 0 0;
        width: 13px;
        height: 8px;
        bottom: -1px;
    }

    .gnav .submenu-openbtn {
        display: none;
    }

    .snav {
        width: 100%;
        height: 55px;
        background-color: #2b468d;
        display: none;
        position: relative;
    }

    .snav .submenu {
        display: table;
        margin: 0 auto;
    }

    .snav .submenu-item {
        display: table-cell;
        list-style-type: none;
        height: 55px;
        width: 180px;
        text-align: center;
        vertical-align: middle;
    }

    .snav .submenu-item > a {
        color: #fff;
        text-decoration: none;
        padding: 10px 20px;
        display: block;
    }

    .snav .submenu-item > a img {
        margin-right: 8px;
    }

    .snav .submenu-item > a:hover {
        color: #7993d7;
    }

    .snav .snav-arrow {
        position: absolute;
        display: none;
        background: transparent url("common/img/snav-arrow.png") no-repeat 0 0;
        width: 13px;
        height: 8px;
        bottom: -1px;
    }

    .snav #sub-news a > img {
        position: relative;
        top: -1px;
    }

    body.win .snav #sub-news a > img {
        position: relative;
        top: -4px;
    }
}

/* Page Title
 * ====================================================================== */
.page-header {
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.1);
    color: #2b468d;
    text-align: center;
    background: transparent url("common/img/polygon.png") repeat 0 0;
}

.page-header .page-title {
    font-family: "nobel-light";
    font-weight: normal;
    text-transform: uppercase;
    line-height: 1;
    margin: 0;
}

.page-header .page-title-jp {
    font-weight: normal;
    margin: 0;
}

.page-blue-title {
    font-weight: normal;
    text-align: center;
    color: #fff;
    background-color: #2b468d;
}

@media screen and (max-width: 767px) {
    .page-header {
        height: 86px;
        background-size: 150px 150px;
    }

    .page-header .page-title {
        padding-top: 25px;
        font-size: 216%;
    }

    .page-header .page-title-jp {
        font-size: 77%;
    }

    .page-blue-title {
        padding: 12px;
    }
}

@media screen and (min-width: 768px) {
    .page-header {
        height: 200px;
    }

    .page-header .page-title {
        padding-top: 55px;
        font-size: 447%;
    }

    .page-header .page-title-jp {
        font-size: 116%;
    }

    .page-blue-title {
        padding: 5px 0;
        font-size: 177%;
    }
}

/* Footer
 * ====================================================================== */
.pagetop {
    max-width: 982px;
    padding: 0 10px;
    margin: 60px auto 0 auto;
    text-align: right;
}

.pagetop a {
    border-bottom: none;
}

@media screen and (max-width: 767px) {
    .pagetop {
        text-align: center;
    }
}

.common-footer {
    background-color: #000;
    padding: 10px 0;
}

.common-footer .top-menu {
    display: table;
}

.common-footer .top-menu .menu-item {
    padding: 0 15px;
    display: table-cell;
    list-style-type: none;
    text-transform: uppercase;
    font-family: "nobel-regular";
    font-weight: normal;
    font-size: 93%;
    border-right: 1px dotted #d2d2d2;
}

.common-footer .top-menu .menu-item > a {
    color: #d2d2d2;
    text-decoration: none;
}

.common-footer .top-menu .menu-item > a:hover {
    color: #c2c2c2;
}

.common-footer .top-menu .menu-item:first-child {
    border-left: 1px dotted #d2d2d2;
}

.common-footer .menu-detail {
    margin: 35px 0 20px;
    display: table;
    width: 100%;
    color: #d2d2d2;
}

.common-footer .menu-detail > div {
    display: table-cell;
    width: 20%;
}

.common-footer .menu-detail > div:first-child {
    width: 40%;
}

.common-footer .menu-detail h2 {
    list-style-type: none;
    text-transform: uppercase;
    font-weight: normal;
    font-size: 116%;
    margin-bottom: 10px;
}

.common-footer .menu-detail h2 a {
    color: #d2d2d2;
    text-decoration: none;
}

.common-footer .menu-detail .submenu {
    margin-bottom: 25px;
}

.common-footer .menu-detail .submenu-item {
    font-size: 85%;
    line-height: 1.75;
}

.common-footer .menu-detail .submenu-item a {
    color: #d2d2d2;
    text-decoration: underline;
}

.common-footer .company-info {
    position: relative;
}

.common-footer .company-info:after {
    display: block;
    clear: both;
    height: 0;
    visibility: hidden;
    content: ".";
}

.common-footer address {
    color: #999;
    font-style: normal;
}

.common-footer .copyright {
    color: #999;
    font-size: 77%;
    font-family: Arial, Helvetica, sans-serif;
}

@media screen and (max-width: 767px) {
    .common-footer {
        height: 160px;
        position: absolute;
        bottom: 0;
        width: 100%;
    }

    .common-footer .top-wrapper {
        display: none;
    }

    .common-footer .menu-detail {
        display: none;
    }

    .common-footer .copyright {
        width: 100%;
        text-align: center;
    }

    .common-footer .badges {
        width: 148px;
        margin: 0 auto;
    }

    .common-footer .badges li:nth-child(2) {
        display: none;
    }

    .common-footer address {
        text-align: center;
        max-width: 300px;
        margin: 15px auto;
    }

    .common-footer address .company-name {
        font-size: 100%;
        font-weight: normal;
    }

    .common-footer address .company-address {
        font-size: 77%;
    }

    .common-footer .copyright {
        font-size: 9px;
    }
}

@media screen and (min-width: 768px) {
    .common-footer {
        height: 560px;
        position: absolute;
        bottom: 0;
        width: 100%;
    }

    .common-footer .inner {
        height: 100%;
        max-width: 1024px;
        margin: 0 auto;
    }

    .common-footer .footer-main {
        position: relative;
        height: 100%;
        margin: 0 10px;
    }

    .common-footer .top-wrapper {
        position: relative;
    }

    .common-footer .top-wrapper:after {
        display: block;
        clear: both;
        height: 0;
        visibility: hidden;
        content: ".";
    }

    .common-footer .social-menu {
        width: 60px;
        position: absolute;
        top: -8px;
        right: 0;
    }

    .common-footer .social-menu li {
        width: 30px;
        float: left;
    }

    .common-footer .badges {
        float: right;
        width: 360px;
    }

    .common-footer .badges li:nth-child(1) {
        float: left;
    }

    .common-footer .badges li:nth-child(2) {
        float: right;
    }

    .common-footer address {
        float: left;
    }

    .common-footer address .company-name {
        font-size: 108%;
        font-weight: normal;
    }

    .common-footer address .company-address {
        font-size: 85%;
    }

    .common-footer .copyright {
        position: absolute;
        bottom: 0;
        right: 0;
        width: 100%;
        text-align: right;
    }
}

/* Top
* ====================================================================== */
.body-top .content .copy {
    text-align: center;
    color: #2b468d;
}

.body-top .content:nth-child(2n+1) {
    background-color: #f6f6f6;
}

@media screen and (max-width: 767px) {
    .body-top .mainvisual {
        height: 181px;
        border-top: 1px solid #e8e8e8;
        border-bottom: 1px solid #e8e8e8;
        overflow: hidden;
    }

    .body-top .mainvisual img {
        display: block;
        margin: 0 auto;
        width: 330px;
        height: 181px;
    }

    .body-top .content {
        padding-top: 20px;
    }

    .body-top .content .inner {
        margin: 12px;
    }

    .body-top .content .title {
        margin: 0 auto 30px;
    }

    .body-top .content figure {
        margin: 12px 0;
        padding: 0 12px;
        text-align: center;
    }

    .body-top .content figure img {
        max-width: 100%;
    }

    .body-top .content .copy {
        font-size: 116%;
        margin: 20px 0;
    }

    .body-top .content .lead {
        font-size: 93%;
        line-height: 1.75;
        margin: 20px 0;
    }

    .body-top .content .roundbtn {
        padding: 4px 0;
        max-width: 200px;
        font-size: 100%;
        margin-left: auto;
        margin-right: auto;
    }

    .body-top .what {
        padding-bottom: 20px;
    }

    .body-top .what .title {
        width: 114px;
        height: 30px;
        background: transparent url("img/what-title.png") no-repeat 0 0;
        text-indent: 100%;
        white-space: nowrap;
        overflow: hidden;
        background-size: 114px 30px;
    }

    .body-top .how .title {
        width: 97.5px;
        height: 30px;
        background: transparent url("img/how-title.png") no-repeat 0 0;
        text-indent: 100%;
        white-space: nowrap;
        overflow: hidden;
        background-size: 97.5px 30px;
    }

    .body-top .how .copy2 {
        margin-top: 40px;
    }

    .body-top .how .copy3 {
        margin-top: 40px;
    }

    .body-top .who {
        padding-bottom: 20px;
    }

    .body-top .who .title {
        width: 99px;
        height: 30px;
        background: transparent url("img/who-title.png") no-repeat 0 0;
        text-indent: 100%;
        white-space: nowrap;
        overflow: hidden;
        background-size: 99px 30px;
    }

    .body-top .who .copy2 {
        margin-top: 40px;
    }

    .body-top .who .lead2 {
        margin-bottom: 10px;
    }

    .body-top .who .notes2 {
        font-size: 85%;
    }
}

@media screen and (min-width: 768px) and (max-width: 999px) {
    .body-top .content .column .lead {
        padding-left: 20px;
    }
}

@media screen and (min-width: 1000px) {
    .body-top .content .column .graph-wrapper {
        width: 535px;
    }
}

@media screen and (min-width: 768px) {
    .body-top .mainvisual {
        height: 362px;
        border-bottom: 1px solid #e8e8e8;
        background: transparent url("img/mainvisual-bg.png") no-repeat 50% 0;
    }

    .body-top .mainvisual img {
        display: block;
        margin: 0 auto;
    }

    .body-top .content {
        padding-top: 75px;
    }

    .body-top .content .inner {
        max-width: 1014px;
        margin: 0 auto;
        padding: 0 50px;
    }

    .body-top .content .title {
        margin: 0 auto 75px;
    }

    .body-top .content .copy {
        font-size: 170%;
    }

    .body-top .content .lead {
        font-size: 124%;
        line-height: 2;
    }

    .body-top .content .roundbtn {
        display: block;
        width: 305px;
        text-align: center;
        margin: 75px auto 0;
    }

    .body-top .content .column {
        display: table;
        width: 100%;
    }

    .body-top .content .column .graph-wrapper {
        display: table-cell;
        vertical-align: middle;
    }

    .body-top .content .column .graph {
        margin: 0 auto;
    }

    .body-top .content .column .lead {
        display: table-cell;
        vertical-align: top;
    }

    .body-top .content:nth-child(2n+1) {
        background-color: #f6f6f6;
    }

    .body-top .what {
        padding-bottom: 75px;
    }

    .body-top .what .title {
        width: 228px;
        height: 60px;
        background: transparent url("img/what-title.png") no-repeat 0 0;
        text-indent: 100%;
        white-space: nowrap;
        overflow: hidden;
        background-size: 228px 60px;
    }

    .body-top .what .graph {
        margin: 75px auto;
    }

    .body-top .what .graph1 {
        width: 560px;
    }

    .body-top .what .graph2 {
        width: 667px;
    }

    .body-top .what .lead {
        margin-bottom: 75px;
    }

    .body-top .how .title {
        width: 195px;
        height: 60px;
        background: transparent url("img/how-title.png") no-repeat 0 0;
        text-indent: 100%;
        white-space: nowrap;
        overflow: hidden;
        background-size: 195px 60px;
    }

    .body-top .how .copy {
        margin-bottom: 75px;
    }

    .body-top .how .graph1 {
        width: 398px;
    }

    .body-top .how .graph2 {
        width: 358px;
    }

    .body-top .how .graph3 {
        width: 335px;
    }

    .body-top .how .copy3 {
        margin-top: 95px;
    }

    .body-top .how .roundbtn {
        margin-bottom: 95px;
    }

    .body-top .who {
        padding-bottom: 75px;
    }

    .body-top .who .title {
        width: 198px;
        height: 60px;
        background: transparent url("img/who-title.png") no-repeat 0 0;
        text-indent: 100%;
        white-space: nowrap;
        overflow: hidden;
        background-size: 198px 60px;
    }

    .body-top .who .graph {
        margin: 75px auto;
    }

    .body-top .who .graph1 {
        width: 370px;
    }

    .body-top .who .graph2 {
        width: 513px;
    }

    .body-top .who .lead1 {
        margin-bottom: 75px;
    }

    .body-top .who .lead2 {
        margin-bottom: 10px;
    }

    .body-top .who .notes1 {
        font-size: 100%;
        margin-top: 15px;
        margin-bottom: 75px;
    }

    .body-top .who .notes2 {
        font-size: 85%;
        margin-bottom: 75px;
    }
}

/* Contact
 * ====================================================================== */
.body-contact .main h2 {
    color: #2b468d;
}

.body-contact .main address {
    font-style: normal;
}

@media screen and (max-width: 767px) {
    .body-contact .main {
        margin-top: 20px;
    }

    .body-contact .main h1 {
        font-size: 108%;
        font-weight: bold;
        text-align: left;
        padding: 0 12px 5px 12px;
        border-bottom: 2px solid #e8e8e8;
    }

    .body-contact .main h2 {
        font-size: 93%;
        font-weight: bold;
        margin-top: 20px;
        padding: 0 12px;
    }

    .body-contact .main p {
        margin: 10px 0 30px 0;
        padding: 0 12px;
        line-height: 1.5;
    }
}

@media screen and (min-width: 768px) {
    .body-contact .main {
        width: 760px;
        margin: 80px auto;
    }

    .body-contact .main h1 {
        font-size: 139%;
        font-weight: bold;
        text-align: left;
        padding: 0 0 5px 0;
        border-bottom: 3px solid #e8e8e8;
    }

    .body-contact .main h2 {
        font-size: 108%;
        font-weight: bold;
        margin-top: 20px;
    }

    .body-contact .main p {
        margin: 10px 0 30px 0;
        line-height: 1.5;
    }
}

/* Company
 * ====================================================================== */
.body-company_top .main {
    max-width: 1014px;
    margin: 80px auto 20px auto;
}

.body-company_top .mainvisual img {
    width: 100%;
}

.body-company_top .data dl {
    display: table;
    margin: 20px auto;
    padding-bottom: 20px;
    border-bottom: 1px solid #e8e8e8;
    width: 100%;
    max-width: 760px;
}

.body-company_top .data dl:first-child {
    padding-top: 20px;
    border-top: 3px solid #e8e8e8;
}

.body-company_top .data dt,
.body-company_top dd {
    display: table-cell;
    vertical-align: middle;
}

.body-company_top .data dt {
    width: 135px;
    text-align: right;
}

.body-company_top .data dt strong {
    display: block;
    font-size: 139%;
    font-weight: normal;
    color: #2e2e2e;
}

.body-company_top .data dt span {
    display: block;
    font-family: "nobel-light";
    font-size: 93%;
    color: #bababa;
}

.body-company_top .data dd {
    padding-left: 40px;
    color: #2e2e2e;
}

.body-company_access .data dt {
    color: #2e2e2e;
}

.body-company_access .data dd {
    color: #2e2e2e;
}

.body-company_privacy .main h2 {
    color: #2b468d;
}

@media screen and (max-width: 767px) {
    .body-company_top .main {
        margin-top: 50px;
    }

    .body-company_top .data dl {
        margin: 20px auto;
        padding-bottom: 20px;
    }

    .body-company_top .data dl:first-child {
        padding-top: 20px;
        border-top: 3px solid #e8e8e8;
    }

    .body-company_top .data dt {
        width: 90px;
        text-align: right;
    }

    .body-company_top .data dt strong {
        font-size: 100%;
    }

    .body-company_top .data dt span {
        font-size: 77%;
    }

    .body-company_top .data dd {
        padding-left: 10px;
        font-size: 85%;
    }

    .body-company_top .mspartner {
        margin-top: 10px;
        max-width: 100%;
    }

    .body-company_access .main {
        margin: 50px auto;
    }

    .body-company_access .maps .map img {
        width: 100%;
    }

    .body-company_access .maps ul {
        margin-top: 5px;
    }

    .body-company_access .maps ul li {
        float: left;
    }

    .body-company_access .maps ul .image {
        width: 32%;
    }

    .body-company_access .maps ul .spacer {
        width: 2%;
        visibility: hidden;
    }

    .body-company_access .maps ul img {
        display: block;
        width: 100%;
        max-width: 100%;
    }

    .body-company_access .maps ul:after {
        display: block;
        clear: both;
        height: 0;
        visibility: hidden;
        content: ".";
    }

    .body-company_access .data {
        margin: 80px auto;
    }

    .body-company_access .data dl {
        margin-bottom: 30px;
    }

    .body-company_access .data dt {
        font-size: 108%;
        font-weight: normal;
        text-align: center;
        padding: 0 0 5px 0;
        border-bottom: 1px solid #e8e8e8;
    }

    .body-company_access .data dd {
        text-align: center;
        font-size: 100%;
        padding: 10px 0 0 10px;
    }

    .body-company_policy .main {
        margin-top: 20px;
    }

    .body-company_policy .main h1 {
        font-size: 108%;
        font-weight: bold;
        text-align: left;
        padding: 0 12px 5px 12px;
        border-bottom: 2px solid #e8e8e8;
    }

    .body-company_policy .main h2 {
        font-size: 93%;
        font-weight: bold;
        text-align: left;
        padding: 0 12px 5px 12px;
        border-bottom: 1px solid #e8e8e8;
        margin-top: 20px;
    }

    .body-company_policy .main p {
        margin: 10px 0 30px 0;
        padding: 0 12px;
        line-height: 1.5;
    }

    .body-company_privacy .main {
        margin-top: 20px;
    }

    .body-company_privacy .main h1 {
        font-size: 108%;
        font-weight: bold;
        text-align: left;
        padding: 0 12px 5px 12px;
        border-bottom: 2px solid #e8e8e8;
    }

    .body-company_privacy .main h2 {
        font-size: 93%;
        font-weight: bold;
        color: #2b468d;
        margin-top: 20px;
        padding: 0 12px;
    }

    .body-company_privacy .main p {
        margin: 10px 0 30px 0;
        padding: 0 12px;
        line-height: 1.5;
    }
}

@media screen and (min-width: 768px) {
    .body-company .company-subtitle {
        display: none;
    }

    .body-company_top .mspartner {
        margin-top: 20px;
    }

    .body-company_top .small {
        font-size: 75%;
    }

    .body-company_access .main {
        width: 760px;
        margin: 80px auto;
    }

    .body-company_access .maps {
        position: relative;
    }

    .body-company_access .maps ul {
        position: absolute;
        top: 0;
        right: 0;
        width: 191px;
        height: 589px;
    }

    .body-company_access .maps ul .image {
        margin-bottom: 8px;
    }

    .body-company_access .maps ul .spacer {
        display: none;
    }

    .body-company_access .maps ul li:last-child {
        margin-bottom: 0;
    }

    .body-company_access .maps ul img {
        display: block;
    }

    .body-company_access .data {
        margin: 80px auto;
    }

    .body-company_access .data dl {
        margin-bottom: 30px;
    }

    .body-company_access .data dt {
        font-size: 139%;
        font-weight: normal;
        padding: 0 0 5px 10px;
        border-bottom: 1px solid #e8e8e8;
    }

    .body-company_access .data dd {
        font-size: 100%;
        padding: 10px 0 0 10px;
    }

    .body-company_policy .main {
        width: 760px;
        margin: 80px auto;
    }

    .body-company_policy .main h1 {
        font-size: 139%;
        font-weight: bold;
        text-align: left;
        padding: 0 0 5px 0;
        border-bottom: 3px solid #e8e8e8;
    }

    .body-company_policy .main h2 {
        font-size: 108%;
        font-weight: bold;
        text-align: left;
        padding: 0 0 5px 0;
        border-bottom: 1px solid #e8e8e8;
        margin-top: 20px;
    }

    .body-company_policy .main p {
        margin: 10px 0 30px 0;
        line-height: 1.5;
    }

    .body-company_privacy .main {
        width: 760px;
        margin: 80px auto;
    }

    .body-company_privacy .main h1 {
        font-size: 139%;
        font-weight: bold;
        text-align: left;
        padding: 0 0 5px 0;
        border-bottom: 3px solid #e8e8e8;
    }

    .body-company_privacy .main h2 {
        font-size: 108%;
        font-weight: bold;
        margin-top: 20px;
    }

    .body-company_privacy .main p {
        margin: 10px 0 30px 0;
        line-height: 1.5;
    }

    .body-company_privacy .main .sign {
        text-align: right;
    }
}

/* Recruit
 * ====================================================================== */
.body-recruit_top .main .mainvisual img {
    width: 100%;
}

.body-recruit_top .main .content {
    text-align: center;
}

.body-recruit_top .main .content h1 {
    margin-bottom: 40px;
}

.body-recruit_top .main .content h1 img {
    max-width: 100%;
}

.body-recruit_top .main .content p {
    line-height: 2;
    margin-bottom: 20px;
}

.body-recruit_top .main .content .copy {
    color: #2b468d;
    margin: 60px auto 130px auto;
}

.body-recruit_top .main .content strong {
    font-weight: normal;
    background-color: #fff000;
}

.body-recruit_top .main .guidebtn {
    background-color: #1ea5e9;
    color: #fff;
    text-align: center;
    text-decoration: none;
    font-weight: normal;
    border-radius: 6px;
}

.body-recruit_member .skillset {
    display: none;
    padding-bottom: 4px;
    margin-bottom: 60px;
}

.body-recruit_member .skill {
    cursor: pointer;
}

.body-recruit_member .skill img {
    position: relative;
    top: 3px;
    margin-right: 5px;
}

.body-recruit_member .skill-select {
    color: #f72bf5;
}

.body-recruit_member .persons {
    margin: 0 auto;
}

.body-recruit_member .persons:after {
    display: block;
    clear: both;
    height: 0;
    visibility: hidden;
    content: ".";
}

.body-recruit_member .person {
    position: relative;
}

.body-recruit_member .person .overlay {
    display: none;
    z-index: 100;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(255, 255, 255, 0.8);
}

@media screen and (max-width: 767px) {
    .body-recruit_member .skillset {
        width: 140px;
        margin-left: auto;
        margin-right: auto;
    }

    .body-recruit_member .skill {
        font-size: 93%;
        font-weight: bold;
        margin-bottom: 5px;
    }

    .body-recruit_member .outline {
        margin: 12px;
    }

    .body-recruit_member .persons {
        width: 216px;
    }

    .body-recruit_member .person {
        width: 93px;
        float: left;
        margin-right: 30px;
        margin-bottom: 10px;
    }

    .body-recruit_member .person .plate {
        margin: 5px 0;
    }

    .body-recruit_member .person .plate h1 {
        font-size: 93%;
        padding-bottom: 2px;
        margin-bottom: 5px;
        border-bottom: 1px dotted #333;
    }

    .body-recruit_member .person .plate span {
        margin-right: 5px;
        color: #2b468d;
        font-size: 124%;
        font-family: 'monoton-num';
        font-weight: lighter;
    }

    .body-recruit_member .person .plate p {
        font-size: 77%;
    }

    .body-recruit_member .person:nth-child(2n) {
        margin-right: 0;
    }

    .body-recruit_member .person:nth-child(2n+1) {
        clear: both;
    }

    .body-recruit_member .person-img {
        position: relative;
        width: 93px;
        height: 93px;
    }

    .body-recruit_member .person-img img {
        position: absolute;
    }

    .body-recruit_member .person-img .photo {
        top: 2px;
        left: 3px;
        width: 85px;
        height: 85px;
    }

    .body-recruit_member .person-img .circle {
        top: 0;
        left: 0;
        width: 93px;
        height: 93px;
    }
}

@media screen and (min-width: 768px) {
    .body-recruit_member .skillset ul {
        margin: 0 auto;
        text-align: center;
    }

    .body-recruit_member .skill {
        display: inline-block;
        margin-right: 30px;
        font-size: 108%;
        font-weight: bold;
    }

    .body-recruit_member .skill:after {
        content: '/';
        color: #333;
        margin-left: 20px;
        width: 20px;
    }

    .body-recruit_member .skill:last-child:after {
        display: none;
    }

    .body-recruit_member .person {
        width: 186px;
        float: left;
        margin-right: 64px;
        margin-bottom: 10px;
    }

    .body-recruit_member .person .plate {
        margin: 5px 10px;
    }

    .body-recruit_member .person .plate h1 {
        font-size: 108%;
        padding-bottom: 2px;
        margin-bottom: 5px;
        border-bottom: 1px dotted #333;
    }

    .body-recruit_member .person .plate span {
        margin-right: 5px;
        color: #2b468d;
        font-size: 185%;
        font-family: 'monoton-num';
        font-weight: lighter;
    }

    .body-recruit_member .person .plate p {
        font-size: 93%;
    }

    .body-recruit_member .person-img {
        position: relative;
        width: 186px;
        height: 186px;
    }

    .body-recruit_member .person-img img {
        position: absolute;
    }

    .body-recruit_member .person-img .photo {
        top: 4px;
        left: 6px;
    }

    .body-recruit_member .person-img .circle {
        top: 0;
        left: 0;
    }
}

@media screen and (min-width: 768px) and (max-width: 935px) {
    .body-recruit_member .persons {
        width: 686px;
    }

    .body-recruit_member .person:nth-child(3n) {
        margin-right: 0;
    }

    .body-recruit_member .person:nth-child(3n+1) {
        clear: both;
    }
}

@media screen and (min-width: 936px) {
    .body-recruit_member .persons {
        width: 936px;
    }

    .body-recruit_member .person:nth-child(4n) {
        margin-right: 0;
    }

    .body-recruit_member .person:nth-child(4n+1) {
        clear: both;
    }
}

.body-recruit_entry .main h2 {
    color: #2b468d;
}

.body-recruit_entry .main .graybox {
    background-color: #eeeff2;
}

.body-recruit_guide .jobs .job_ui {
    border-left: 3px solid #4ccbd3;
}

.body-recruit_guide .jobs .job_ui h1 {
    color: #4ccbd3;
}

.body-recruit_guide .jobs .job_app {
    border-left: 3px solid #6dc03e;
}

.body-recruit_guide .jobs .job_app h1 {
    color: #6dc03e;
}

.body-recruit_guide .jobs .job_cloud {
    border-left: 3px solid #deb3ff;
}

.body-recruit_guide .jobs .job_cloud h1 {
    color: #deb3ff;
}

.body-recruit_guide .jobs .job_manager {
    border-left: 3px solid #ff6b57;
}

.body-recruit_guide .jobs .job_manager h1 {
    color: #ff6b57;
}

.body-recruit_guide .jobs .job_planner {
    border-left: 3px solid #3296d3;
}

.body-recruit_guide .jobs .job_planner h1 {
    color: #3296d3;
}

.body-recruit_guide .jobs .job_assistant {
    border-left: 3px solid #4ccbd3;
}

.body-recruit_guide .jobs .job_assistant h1 {
    color: #4ccbd3;
}

.body-recruit_guide .jobs .job_intern {
    border-left: 3px solid #d6d153;
}

.body-recruit_guide .jobs .job_intern h1 {
    color: #d6d153;
}

.body-recruit_guide .jobs .skill {
    background-color: #eeeff2;
}

.body-recruit_guide .summary {
    background-color: #eeeff2;
}

.body-recruit_member_detail .cover {
    margin: 0 auto;
    position: relative;
    overflow: hidden;
}

.body-recruit_member_detail .cover img {
    position: absolute;
    width: 100%;
    height: 100%;
}

.body-recruit_member_detail .cover-scroll {
    display: none;
    margin: 0 auto;
    height: 20px;
    background-color: #e8e8e8;
}

.body-recruit_member_detail .cover-scroll-knob {
    cursor: pointer;
    background: #1ea5e9 url("common/img/horizon-scroll-knob.png") no-repeat 50% 50%;
    width: 30px;
    height: 100%;
}

.body-recruit_member_detail .cover-loading {
    background-color: #eee;
}

.body-recruit_member_detail .main .content h2 {
    background-repeat: no-repeat;
}

.body-recruit_member_detail .main .content:nth-child(1) h2 {
    color: #4ccbd3;
    background-image: url("recruit/member/icon_q1.png");
}

.body-recruit_member_detail .main .content:nth-child(2) h2 {
    color: #6dc03e;
    background-image: url("recruit/member/icon_q2.png");
}

.body-recruit_member_detail .main .content:nth-child(3) h2 {
    color: #deb3ff;
    background-image: url("recruit/member/icon_q3.png");
}

.body-recruit_member_detail .main .content:nth-child(4) h2 {
    color: #e7c718;
    background-image: url("recruit/member/icon_q4.png");
}

@media screen and (max-width: 767px) {
    .body-recruit_top .main {
        background: transparent url("recruit/img/bg_circles.png") no-repeat 50% -30px;
        background-size: 780px 204px;
    }

    .body-recruit_top .main .mainvisual {
        position: relative;
        min-height: 95px;
        margin: 25px 0 35px;
        overflow: hidden;
    }

    .body-recruit_top .main .mainvisual img {
        position: absolute;
        top: 0;
        left: 0;
        width: 800px;
        height: 95px;
    }

    .body-recruit_top .main .content h1 {
        margin: 0 12px 30px 12px;
    }

    .body-recruit_top .main .content h1 img {
        max-width: 100%;
    }

    .body-recruit_top .main .content p {
        padding: 0 12px;
        font-size: 93%;
    }

    .body-recruit_top .main .guidebtn {
        display: block;
        font-size: 124%;
        padding: 8px 0;
        margin: 0 12px;
    }

    .body-recruit_entry .main {
        margin-top: 20px;
    }

    .body-recruit_entry .main h1 {
        font-size: 108%;
        font-weight: bold;
        text-align: left;
        padding: 0 12px 5px 12px;
        border-bottom: 2px solid #e8e8e8;
    }

    .body-recruit_entry .main h2 {
        font-size: 93%;
        font-weight: bold;
        color: #2b468d;
        margin-top: 20px;
        padding: 0 12px;
    }

    .body-recruit_entry .main p {
        margin: 10px 0 30px 0;
        padding: 0 12px;
        line-height: 1.5;
    }

    .body-recruit_entry .graybox {
        margin: 5px 0 20px 0;
        padding: 8px 12px;
    }

    .body-recruit_guide .outline {
        margin-bottom: 50px;
        font-size: 93%;
        line-height: 1.5;
        padding: 12px;
    }

    .body-recruit_guide .outline .link {
        margin-top: 20px;
    }

    .body-recruit_guide .outline a {
        color: #2e2e2e;
    }

    .body-recruit_guide .jobs > h1 {
        font-size: 108%;
        font-weight: bold;
        text-align: left;
        padding: 0 12px 5px 12px;
        border-bottom: 2px solid #e8e8e8;
    }

    .body-recruit_guide .jobs .job {
        margin: 30px 12px 10px 12px;
        padding-left: 10px;
    }

    .body-recruit_guide .jobs .job h1 {
        font-size: 100%;
        font-weight: bold;
    }

    .body-recruit_guide .jobs .job p {
        margin-top: 6px;
        font-size: 93%;
        line-height: 1.5;
    }

    .body-recruit_guide .jobs .skill {
        padding: 12px;
    }

    .body-recruit_guide .jobs .skill h2 {
        margin-bottom: 10px;
    }

    .body-recruit_guide .jobs .skill .list {
        font-size: 93%;
    }

    .body-recruit_guide .jobs .skill .notes {
        font-size: 77%;
    }

    .body-recruit_guide .summary {
        margin-top: 50px;
        padding: 20px 0;
    }

    .body-recruit_guide .summary h1 {
        font-size: 108%;
        font-weight: bold;
        text-align: center;
        margin-bottom: 5px;
    }

    .body-recruit_guide .summary dl {
        border-top: 1px solid #c7c7c7;
        width: 100%;
        margin: 0 auto;
        display: table;
        font-size: 93%;
    }

    .body-recruit_guide .summary dl dt {
        display: table-cell;
        width: 100px;
        padding: 10px 0;
        text-align: right;
        vertical-align: middle;
    }

    .body-recruit_guide .summary dl dd {
        display: table-cell;
        padding: 10px 0 10px 20px;
        vertical-align: middle;
    }

    .body-recruit_guide .summary dl:last-child {
        border-bottom: 1px solid #c7c7c7;
    }

    .body-recruit_member_detail .staff_num {
        margin-left: 10px;
        color: #2b468d;
    }

    .body-recruit_member_detail .staff_num .num {
        font-family: 'monoton-num';
        font-size: 185%;
        margin-right: 10px;
    }

    .body-recruit_member_detail .staff_num .staff {
        font-size: 170%;
    }

    .body-recruit_member_detail .profile {
        margin: 12px;
        text-align: center;
    }

    .body-recruit_member_detail .profile .name {
        font-size: 154%;
        font-weight: normal;
    }

    .body-recruit_member_detail .profile .name_eng {
        font-size: 93%;
        font-weight: normal;
        margin-bottom: 10px;
    }

    .body-recruit_member_detail .profile .division {
        border-top: 3px solid #e2e2e2;
        padding: 5px 0;
    }

    .body-recruit_member_detail .profile .biography {
        border-top: 1px solid #e2e2e2;
        border-bottom: 1px solid #e2e2e2;
        padding: 5px 0;
    }

    .body-recruit_member_detail .profile .join {
        border-bottom: 3px solid #e2e2e2;
        padding: 5px 0;
    }

    .body-recruit_member_detail .contents {
        margin: 12px;
    }

    .body-recruit_member_detail .content {
        margin-top: 20px;
    }

    .body-recruit_member_detail .content h2 {
        margin-bottom: 15px;
        box-sizing: border-box;
        min-height: 29px;
        padding: 6px 0 0 30px;
        background-size: 23px 29px;
    }
}

@media screen and (min-width: 768px) {
    .body-recruit .recruit-subtitle {
        display: none;
    }

    .body-recruit_top .main {
        background: transparent url("recruit/img/bg_circles.png") no-repeat 50% 0;
    }

    .body-recruit_top .main .mainvisual img {
        margin: 80px 0 120px 0;
    }

    .body-recruit_top .main .content p {
        font-size: 116%;
    }

    .body-recruit_top .main .content .copy {
        font-size: 154%;
    }

    .body-recruit_top .main .guidebtn {
        display: inline-block;
        font-size: 170%;
        padding: 4px 0;
        width: 370px;
        margin: 0 auto;
        border-bottom: none;
    }

    .body-recruit_member .outline {
        max-width: 920px;
        margin: 80px auto 80px;
        font-size: 116%;
        color: #2e2e2e;
        line-height: 1.5;
    }

    .body-recruit_entry .main {
        width: 760px;
        margin: 80px auto;
    }

    .body-recruit_entry .main h1 {
        font-size: 139%;
        font-weight: bold;
        text-align: left;
        padding: 0 0 5px 0;
        border-bottom: 3px solid #e8e8e8;
    }

    .body-recruit_entry .main h2 {
        font-size: 108%;
        font-weight: bold;
        margin-top: 20px;
    }

    .body-recruit_entry .main p {
        margin: 10px 0 30px 0;
        line-height: 1.5;
    }

    .body-recruit_entry .main li {
        margin-left: 25px;
    }

    .body-recruit_entry .main ol p {
        margin-left: 25px;
    }

    .body-recruit_entry .main .sign {
        text-align: right;
    }

    .body-recruit_entry .graybox {
        margin: 5px 5px 15px;
        border-radius: 8px;
        padding: 8px 12px;
    }

    .body-recruit_guide .main {
        margin: 80px auto;
    }

    .body-recruit_guide .outline {
        margin-bottom: 50px;
        font-size: 108%;
        line-height: 1.5;
    }

    .body-recruit_guide .outline .link {
        margin-top: 20px;
    }

    .body-recruit_guide .outline a {
        color: #2e2e2e;
    }

    .body-recruit_guide .jobs {
        width: 760px;
        margin: 0 auto;
    }

    .body-recruit_guide .jobs > h1 {
        font-size: 139%;
        font-weight: bold;
        text-align: left;
        padding: 0 0 5px 0;
        border-bottom: 3px solid #e8e8e8;
    }

    .body-recruit_guide .jobs .job {
        margin-top: 55px;
        padding-left: 12px;
    }

    .body-recruit_guide .jobs .job h1 {
        font-size: 131%;
        font-weight: bold;
    }

    .body-recruit_guide .jobs .job p {
        margin-top: 6px;
        font-size: 108%;
        line-height: 1.5;
    }

    .body-recruit_guide .jobs .skill {
        margin-top: 20px;
        padding: 16px;
        border-radius: 6px;
    }

    .body-recruit_guide .jobs .skill h2 {
        margin-bottom: 10px;
    }

    .body-recruit_guide .jobs .skill .list {
        margin-left: 15px;
    }

    .body-recruit_guide .jobs .skill .notes {
        margin-top: 5px;
        margin-left: 15px;
        font-size: 93%;
    }

    .body-recruit_guide .summary {
        padding-top: 50px;
        padding-bottom: 70px;
        margin-top: 60px;
    }

    .body-recruit_guide .summary h1 {
        font-size: 185%;
        font-weight: bold;
        text-align: center;
        margin-bottom: 5px;
    }

    .body-recruit_guide .summary dl {
        border-top: 1px solid #c7c7c7;
        width: 760px;
        margin: 0 auto;
        background-color: #fff;
        display: table;
    }

    .body-recruit_guide .summary dl dt {
        display: table-cell;
        width: 185px;
        padding: 15px 0;
        text-align: right;
        vertical-align: middle;
    }

    .body-recruit_guide .summary dl dd {
        display: table-cell;
        padding: 15px 0 15px 30px;
        vertical-align: middle;
    }

    .body-recruit_guide .summary dl:last-child {
        border-bottom: 1px solid #c7c7c7;
    }

    .body-recruit_member_detail .main {
        max-width: 1014px;
        margin: 80px auto;
    }

    .body-recruit_member_detail .staff_num {
        color: #2b468d;
    }

    .body-recruit_member_detail .staff_num .num {
        font-family: 'monoton-num';
        font-size: 339%;
        margin-right: 10px;
    }

    .body-recruit_member_detail .staff_num .staff {
        font-size: 170%;
    }

    .body-recruit_member_detail .profile {
        width: 600px;
        margin: 40px auto 0;
        text-align: center;
    }

    .body-recruit_member_detail .profile .name {
        font-size: 216%;
        font-weight: normal;
    }

    .body-recruit_member_detail .profile .name_eng {
        font-size: 108%;
        font-weight: normal;
        margin-bottom: 25px;
    }

    .body-recruit_member_detail .profile .division {
        border-top: 3px solid #e2e2e2;
        padding: 10px 0;
    }

    .body-recruit_member_detail .profile .biography {
        border-top: 1px solid #e2e2e2;
        border-bottom: 1px solid #e2e2e2;
        padding: 10px 0;
    }

    .body-recruit_member_detail .profile .join {
        border-bottom: 3px solid #e2e2e2;
        padding: 10px 0;
    }

    .body-recruit_member_detail .contents {
        margin: 50px 50px;
    }

    .body-recruit_member_detail .contents:after {
        display: block;
        clear: both;
        height: 0;
        visibility: hidden;
        content: ".";
    }

    .body-recruit_member_detail .content {
        width: 50%;
        float: left;
        box-sizing: border-box;
        margin-top: 30px;
    }

    .body-recruit_member_detail .content h2 {
        box-sizing: border-box;
        min-height: 58px;
        padding: 10px 0 0 60px;
        font-size: 131%;
        margin-bottom: 20px;
    }

    .body-recruit_member_detail .content p {
        font-size: 108%;
        line-height: 2;
    }

    .body-recruit_member_detail .content:nth-child(2n+1) {
        clear: left;
        padding-right: 25px;
    }

    .body-recruit_member_detail .content:nth-child(2n) {
        padding-left: 25px;
    }
}

/* Showcase
 * ====================================================================== */
.body-showcase-top .list {
    min-height: 400px;
}

.body-showcase-top .examples {
    background-color: #eeeff2;
    border-radius: 6px;
}

.body-showcase-top .others h2 {
    color: #2b468d;
}

.body-showcase-top .showcase-list article {
    width: 280px;
    text-align: center;
}

.body-showcase-top .showcase-list article img {
    display: block;
    width: 280px;
    margin-bottom: 10px;
}

.body-showcase-top .showcase-list article a {
    color: #2e2e2e;
}

.body-showcase-top .showcase-list article a:hover {
    color: #666;
}

.body-showcase-top .examples h3 {
    color: #2b468d;
}

.body-showcase-detail .cover {
    max-width: 700px;
    margin: 0 auto;
    position: relative;
    overflow: hidden;
}

.body-showcase-detail .cover img {
    position: absolute;
    width: 100%;
    height: 100%;
}

.body-showcase-detail .content a {
    font-weight: bold;
}

.body-showcase-detail .cover-scroll {
    display: none;
    max-width: 700px;
    margin: 0 auto;
    height: 20px;
    background-color: #e8e8e8;
}

.body-showcase-detail .cover-scroll-knob {
    cursor: pointer;
    background: #1ea5e9 url("common/img/horizon-scroll-knob.png") no-repeat 50% 50%;
    background-color: #1ea5e9;
    width: 30px;
    height: 100%;
}

.body-showcase-detail .cover-loading {
    background-color: #eee;
}

.body-showcase-detail .main .category_types li {
    display: inline-block;
    margin-right: 15px;
    font-weight: bold;
}

.body-showcase-detail .main .category_types li:before {
    position: relative;
    margin-right: 5px;
}

.body-showcase-detail .main .category_types .category1:before {
    content: url("showcase/img/icon_category1.png");
}

.body-showcase-detail .main .category_types .category2:before {
    content: url("showcase/img/icon_category2.png");
}

.body-showcase-detail .main .category_types .category3:before {
    content: url("showcase/img/icon_category3.png");
}

.body-showcase-detail .main .category_types .category4:before {
    content: url("showcase/img/icon_category4.png");
}

.body-showcase-detail .main .category_types .type1:before {
    content: url("showcase/img/icon_type1.png");
}

.body-showcase-detail .main .category_types .type2:before {
    content: url("showcase/img/icon_type2.png");
}

.body-showcase-detail .main .category_types .type3:before {
    content: url("showcase/img/icon_type3.png");
}

.body-showcase-detail .main .category_types .type4:before {
    content: url("showcase/img/icon_type4.png");
}

.body-showcase-detail .main .category_types .type5:before {
    content: url("showcase/img/icon_type5.png");
}

.body-showcase-detail .main .category_types .type6:before {
    content: url("showcase/img/icon_type6.png");
}

.body-showcase-detail .main .content h2:before {
    position: relative;
    top: 6px;
    margin-right: 10px;
}

.body-showcase-detail .main .content_problem h2 {
    color: #4ccbd3;
}

.body-showcase-detail .main .content_problem h2:before {
    content: url("showcase/detail/img/icon_problem.png");
}

.body-showcase-detail .main .content_approach h2 {
    color: #6dc03e;
}

.body-showcase-detail .main .content_approach h2:before {
    content: url("showcase/detail/img/icon_approach.png");
}

.body-showcase-detail .main .content_result h2 {
    color: #dfb5ff;
}

.body-showcase-detail .main .content_result h2:before {
    content: url("showcase/detail/img/icon_result.png");
}

.body-showcase-detail .main .content_links h2 {
    color: #e7c718;
}

.body-showcase-detail .main .content_links h2:before {
    content: url("showcase/detail/img/icon_links.png");
}

.body-showcase-detail .main .content_links .note {
    font-size: 90%;
}

.body-showcase-detail .main .content_links li {
    margin-bottom: 10px;
}

@media screen and (max-width: 767px) {
    .body-showcase-top .main {
        margin-top: 25px;
    }

    .body-showcase-top .outline {
        padding: 0 12px;
    }

    .body-showcase-top .others {
        padding: 0 12px;
        margin-bottom: 20px;
    }

    .body-showcase-top .others h2 {
        margin-bottom: 10px;
        font-size: 108%;
    }

    .body-showcase-top .others p {
        font-size: 93%;
        line-height: 1.5;
    }

    .body-showcase-top .showcase-list {
        margin: 30px auto;
        width: 280px;
    }

    .body-showcase-top .showcase-list article {
        margin-bottom: 20px;
    }

    .body-showcase-top .examples {
        margin: 12px;
        padding: 25px 12px 12px 12px;
    }

    .body-showcase-top .examples h2 {
        margin-bottom: 20px;
        font-size: 100%;
        font-weight: bold;
    }

    .body-showcase-top .examples h3 {
        font-size: 100%;
        font-weight: bold;
        color: #2b468d;
    }

    .body-showcase-top .examples ul {
        font-size: 93%;
        margin: 10px 0 20px;
    }

    .body-showcase-detail .main {
        margin: 25px auto;
    }

    .body-showcase-detail .main .title {
        font-size: 108%;
        margin: 20px 12px 10px 12px;
    }

    .body-showcase-detail .main .category_types {
        margin: auto 12px 20px 12px;
    }

    .body-showcase-detail .main .category_types li {
        font-size: 85%;
    }

    .body-showcase-detail .main .category_types li:before {
        top: 8px;
    }

    .body-showcase-detail .main .outline {
        font-size: 93%;
        margin: 20px 12px;
    }

    .body-showcase-detail .main .contents {
        border-top: 1px solid #e8e8e8;
    }

    .body-showcase-detail .main .content {
        clear: left;
        margin: 20px 12px;
    }

    .body-showcase-detail .main .content h2 {
        font-size: 108%;
        margin-bottom: 15px;
        padding-left: 5px;
    }

    .body-showcase-detail .main .content p {
        font-size: 93%;
        line-height: 1.5;
    }

    .body-showcase-detail .main .content img {
        max-width: 100%;
        margin-bottom: 12px;
    }
}

@media screen and (min-width: 768px) and (max-width: 1013px) {
    .body-showcase-top .showcase-list {
        width: 647px;
    }

    .body-showcase-top .showcase-list article:nth-child(2n) {
        margin-right: 0;
    }

    .body-showcase-top .showcase-list article:nth-child(2n+1) {
        clear: left;
    }
}

@media screen and (min-width: 1014px) {
    .body-showcase-top .showcase-list article:nth-child(3n) {
        margin-right: 0;
    }

    .body-showcase-top .showcase-list article:nth-child(3n+1) {
        clear: left;
    }
}

@media screen and (min-width: 768px) {
    .body-showcase-top .main {
        max-width: 1014px;
        margin: 80px auto 50px;
    }

    .body-showcase-top .outline {
        font-size: 108%;
        line-height: 2;
    }

    .body-showcase-top .showcase-list {
        margin: 90px auto 110px auto;
    }

    .body-showcase-top .showcase-list article {
        float: left;
        margin: 55px 87px 0 0;
    }

    .body-showcase-top .showcase-list:after {
        display: block;
        clear: both;
        height: 0;
        visibility: hidden;
        content: ".";
    }

    .body-showcase-top .others {
        margin-bottom: 30px;
    }

    .body-showcase-top .others h2 {
        margin-bottom: 20px;
        font-size: 139%;
    }

    .body-showcase-top .others p {
        font-size: 116%;
        line-height: 2;
    }

    .body-showcase-top .examples {
        padding: 20px 40px;
    }

    .body-showcase-top .examples .embedded {
        float: left;
        width: 45%;
    }

    .body-showcase-top .examples .pc {
        float: right;
        width: 45%;
    }

    .body-showcase-top .examples h2 {
        margin-bottom: 40px;
        font-size: 116%;
        font-weight: bold;
    }

    .body-showcase-top .examples h3 {
        font-size: 108%;
        font-weight: bold;
        color: #2b468d;
    }

    .body-showcase-top .examples ul {
        margin: 10px 0 20px;
    }

    .body-showcase-top .examples:after {
        display: block;
        clear: both;
        height: 0;
        visibility: hidden;
        content: ".";
    }

    .body-showcase-detail .showcase-subtitle {
        display: none;
    }

    .body-showcase-detail .main {
        width: 700px;
        margin: 80px auto;
    }

    .body-showcase-detail .main .title {
        font-size: 139%;
        margin-bottom: 20px;
    }

    .body-showcase-detail .main .category_types {
        margin-bottom: 15px;
    }

    .body-showcase-detail .main .category_types li {
        font-size: 100%;
    }

    .body-showcase-detail .main .category_types li:before {
        top: 6px;
    }

    .body-showcase-detail .main .outline {
        font-size: 108%;
        margin: 50px 0;
        padding-bottom: 50px;
        border-bottom: 1px solid #e8e8e8;
    }

    .body-showcase-detail .main .content {
        clear: left;
        margin-top: 30px;
    }

    .body-showcase-detail .main .content h2 {
        font-size: 139%;
        margin-bottom: 15px;
        padding-left: 5px;
    }

    .body-showcase-detail .main .content p {
        font-size: 108%;
        line-height: 1.5;
    }

    .body-showcase-detail .main .content img {
        float: left;
        max-width: 320px;
        margin: 0 30px 30px 0;
    }
}

/* Showcase
 * ====================================================================== */
.body-showcase-publish .main {
    max-width: 1014px;
    margin: 0 auto;
    padding: 0 5px;
}

.body-showcase-publish .outline {
    margin-bottom: 80px;
    font-size: 116%;
    line-height: 2;
    letter-spacing: 0.1em;
}

.body-showcase-publish .content {
    margin-top: 90px;
}

.body-showcase-publish .showcase-title {
    display: none;
}

.body-showcase-publish .publish-list {
    overflow: hidden;
    display: block;
    width: 100%;
}

.body-showcase-publish .publish-list:after {
    content: "";
    clear: both;
    display: block;
}

.body-showcase-publish .publish-list-item {
    float: left;
    display: table;
    width: 33.333333%;
    height: 330px;
    margin: 0 auto;
    padding: 20px 0px;
    text-align: center;
}

.body-showcase-publish .publish-list-item-inner {
    display: table-cell;
    width: 100%;
    margin: 0 auto;
    text-align: center;
    vertical-align: top;
}

.body-showcase-publish .publish-list-item-inner .text {
    display: block;
    width: 65%;
    margin: 0 auto;
    text-align: left;
}

.body-showcase-publish .publish-list-item-inner .text a {
    display: inline;
    word-break: break-all;
    text-decoration: none;
    padding-bottom: 2px;
    color: #000;
    font-size: 108%;
    line-height: 1.6;
    border-bottom: 1px dotted #000;
}

.body-showcase-publish .publish-list-item-inner .thum {
    width: 200px;
    height: 250px;
    margin: 0 auto 12px auto;
}

.body-showcase-publish .publish-list-item-inner .thum img {
    display: block;
    margin: 0 auto;
}

.body-showcase-publish-detail .main {
    max-width: 1014px;
    margin: 0 auto;
}

.body-showcase-publish-detail article {
    max-width: 700px;
    margin: 0 auto;
    padding-top: 70px;
}

.body-showcase-publish-detail section {
    border-top: 1px solid #e8e8e8;
}

.body-showcase-publish-detail h1 {
    display: block;
    width: 100%;
    margin-bottom: 50px;
    font-weight: bold;
    font-size: 154%;
    line-height: 1.6;
}

.body-showcase-publish-detail h1 .small {
    display: block;
    font-size: 77%;
    line-height: 1;
}

.body-showcase-publish-detail .detail-container {
    overflow: hidden;
    display: table;
    width: 100%;
}

.body-showcase-publish-detail .detail-container .book {
    display: table-cell;
    width: 32%;
    text-align: left;
    vertical-align: top;
}

.body-showcase-publish-detail .detail-container .info {
    display: table-cell;
    width: 68%;
    vertical-align: top;
}

.body-showcase-publish-detail .detail-container .info h2 {
    font-weight: normal;
    line-height: 1.6;
}

.body-showcase-publish-detail .detail-container .info dl {
    line-height: 1.6;
}

.body-showcase-publish-detail .detail-container .info dl:after {
    content: "";
    display: block;
    clear: both;
}

.body-showcase-publish-detail .detail-container .info dt {
    float: left;
    clear: left;
}

.body-showcase-publish-detail .detail-container .info dd {
    float: left;
}

.body-showcase-publish-detail .roundbtn {
    margin: 30px auto 30px 2px;
}

.body-showcase-publish-detail .outline {
    display: block;
    width: 100%;
    line-height: 1.6;
}

.body-showcase-publish-detail .sub-headline {
    margin-bottom: 24px;
    font-weight: bold;
    color: #2b468d;
}

.body-showcase-publish-detail .text {
    line-height: 1.6;
}

.body-showcase-publish-detail .text .small {
    font-size: 80%;
}

.body-showcase-publish-detail .text a {
    font-weight: bold;
}

.body-showcase-publish-detail .list {
    line-height: 1.6;
}

.body-showcase-publish-detail .list:after {
    content: "";
    display: block;
    clear: both;
}

.body-showcase-publish-detail .list dt {
    float: left;
    clear: left;
}

.body-showcase-publish-detail .list dd {
    float: left;
}

.body-showcase-publish-detail .list3 {
    list-style-type: decimal;
    margin-left: 30px;
}

.body-showcase-publish-detail .thum-container {
    width: 100%;
    margin: 32px auto;
}

.body-showcase-publish-detail .thum-container img {
    display: block;
    margin: 0 auto 5px auto;
    max-width: 100%;
}

.body-showcase-publish-detail .thum-container figcaption {
    text-align: center;
    line-height: 1.6;
}

.body-showcase-publish-detail .banner {
    margin: 10px 0;
}

.body-showcase-publish-detail .banner img {
    max-width: 100%;
}

@media screen and (max-width: 767px) {
    .body-showcase-publish .main {
        padding: 0;
    }

    .body-showcase-publish .outline {
        margin-bottom: 20px;
        line-height: 1.6;
    }

    .body-showcase-publish .content {
        margin: 20px;
    }

    .body-showcase-publish .showcase-title {
        display: block;
    }

    .body-showcase-publish .publish-list-item {
        width: 50%;
        height: auto;
    }

    .body-showcase-publish .publish-list-item-inner {
        display: block;
        width: 100%;
    }

    .body-showcase-publish .publish-list-item-inner .text {
        width: 80%;
    }

    .body-showcase-publish .publish-list-item-inner .thum {
        width: 50%;
        height: auto;
    }

    .body-showcase-publish .publish-list-item-inner .thum img {
        width: 100%;
        height: auto;
    }

    .body-showcase-publish-detail .showcase-title {
        margin-bottom: 20px;
    }

    .body-showcase-publish-detail article {
        padding: 0 12px;
    }

    .body-showcase-publish-detail section {
        margin-top: 10px;
        padding-top: 20px;
    }

    .body-showcase-publish-detail h1 {
        font-size: 116%;
        line-height: 1.3;
    }

    .body-showcase-publish-detail h1 .small {
        line-height: 1.5;
    }

    .body-showcase-publish-detail .detail-container {
        display: block;
    }

    .body-showcase-publish-detail .detail-container .book {
        display: block;
        width: 100%;
        text-align: center;
    }

    .body-showcase-publish-detail .detail-container .book img {
        width: 150px;
        height: auto;
    }

    .body-showcase-publish-detail .detail-container .info {
        display: block;
        width: 100%;
        margin-bpttom: 30px;
    }

    .body-showcase-publish-detail .detail-container .info h2 {
        font-size: 93%;
    }

    .body-showcase-publish-detail .detail-container .info dl {
        font-size: 93%;
    }

    .body-showcase-publish-detail .roundbtn {
        display: inline-block;
        margin: 30px auto;
        padding: 8px 24px;
        font-size: 108%;
        line-height: 1;
        outline: none;
    }

    .body-showcase-publish-detail .outline {
        margin: 20px 0;
        font-size: 93%;
    }

    .body-showcase-publish-detail .sub-headline {
        font-size: 124%;
    }

    .body-showcase-publish-detail .smalltitle {
        margin: 15px 0 10px;
    }

    .body-showcase-publish-detail .text {
        font-size: 93%;
    }

    .body-showcase-publish-detail .list {
        font-size: 93%;
    }

    .body-showcase-publish-detail .list dt {
        margin-right: 10px;
    }

    .body-showcase-publish-detail .list2 {
        font-size: 93%;
    }

    .body-showcase-publish-detail .list2 dt {
        margin-bottom: 5px;
    }

    .body-showcase-publish-detail .list3 {
        font-size: 93%;
        margin-top: 10px;
    }

    .body-showcase-publish-detail .thum-container figcaption {
        font-size: 93%;
    }
}

@media screen and (min-width: 768px) {
    .body-showcase-publish-detail .showcase-title {
        display: none;
    }

    .body-showcase-publish-detail .main {
        margin-bottom: 100px;
    }

    .body-showcase-publish-detail section {
        margin-top: 36px;
        padding-top: 36px;
    }

    .body-showcase-publish-detail .detail-container .info dl {
        font-size: 116%;
    }

    .body-showcase-publish-detail .sub-headline {
        font-size: 154%;
    }

    .body-showcase-publish-detail .smalltitle {
        margin: 25px 0 15px;
    }

    .body-showcase-publish-detail .text {
        font-size: 116%;
    }

    .body-showcase-publish-detail .list {
        font-size: 116%;
    }

    .body-showcase-publish-detail .list dt {
        margin-right: 20px;
    }

    .body-showcase-publish-detail .list2 {
        font-size: 116%;
    }

    .body-showcase-publish-detail .list2 dt {
        margin-bottom: 5px;
    }

    .body-showcase-publish-detail .list3 {
        margin-top: 10px;
        font-size: 116%;
    }

    .body-showcase-publish-detail .thum-container figcaption {
        font-size: 116%;
    }
}

/* Showcase
 * ====================================================================== */
.body-showcase-contribute .main {
    max-width: 1014px;
    margin: 0 auto;
}

.body-showcase-contribute .list {
    margin-top: 60px;
}

.body-showcase-contribute .list .group-title {
    font-family: 'monoton-num';
    font-size: 231%;
    color: #2b468d;
    border-bottom: 5px solid #2b468d;
    margin-bottom: 10px;
}

.body-showcase-contribute .list .book {
    width: 300px;
    margin: 0 auto;
    text-align: left;
}

.body-showcase-contribute .list .book .title {
    font-size: 108%;
    margin-bottom: 5px;
}

.body-showcase-contribute .list .book .title span {
    font-weight: normal;
}

.body-showcase-contribute .list .book .description {
    font-size: 100%;
}

.body-showcase-contribute .list .book figure {
    margin-top: 40px;
}

.body-showcase-contribute .list .book figure img {
    display: block;
    margin: 0 auto;
}

.body-showcase-contribute .list .book .links {
    margin: 20px 40px 0;
}

.body-showcase-contribute .list .book .roundbtn {
    display: block;
    text-align: center;
    font-size: 100%;
    margin: 0 auto;
    margin-bottom: 14px;
}

@media screen and (max-width: 1009px) {
    .body-showcase-contribute #list-2010 .book-wrapper {
        padding-bottom: 20px;
        border-bottom: 1px solid #d9d9d9;
        margin-bottom: 20px;
    }
}

@media screen and (min-width: 1010px) {
    .body-showcase-contribute .list .book-wrapper {
        width: 336px;
        padding: 20px 0;
    }

    .body-showcase-contribute .list .books {
        width: 1010px;
        margin: 0 auto;
    }

    .body-showcase-contribute .list .books1,
    .body-showcase-contribute .list .books2 {
        display: table;
        border-bottom: 1px solid #d9d9d9;
    }

    .body-showcase-contribute .list .books1 .book-wrapper,
    .body-showcase-contribute .list .books2 .book-wrapper {
        display: table-cell;
        vertical-align: top;
        text-align: center;
    }

    .body-showcase-contribute .list .books1 .book-wrapper:nth-child(1),
    .body-showcase-contribute .list .books2 .book-wrapper:nth-child(1) {
        border-right: 1px solid #d9d9d9;
    }

    .body-showcase-contribute .list .books1 .book-wrapper:nth-child(3),
    .body-showcase-contribute .list .books2 .book-wrapper:nth-child(3) {
        border-left: 1px solid #d9d9d9;
    }

    .body-showcase-contribute .list .books3 {
        border-bottom: 1px solid #d9d9d9;
    }

    .body-showcase-contribute .list .books3 .book-wrapper {
        border-right: 1px solid #d9d9d9;
    }
}

/* Showcase
 * ====================================================================== */
.body-showcase-lecture .main {
    max-width: 1014px;
    margin: 0 auto;
}

.body-showcase-lecture .list .list-title {
    font-family: 'monoton-num';
    color: #2b468d;
    border-bottom: 5px solid #2b468d;
}

.body-showcase-lecture .list article:last-child {
    padding-bottom: 0;
    border-bottom: none;
}

.body-showcase-lecture .list .title {
    color: #2b468d;
}

@media screen and (max-width: 767px) {
    .body-showcase-lecture .list {
        margin-top: 60px;
    }

    .body-showcase-lecture .list .list-title {
        padding-left: 12px;
        font-size: 170%;
        margin-bottom: 10px;
    }

    .body-showcase-lecture .list article {
        margin: 12px;
        padding-bottom: 20px;
        border-bottom: 1px solid #e8e8e8;
    }

    .body-showcase-lecture .list img {
        max-width: 100%;
    }

    .body-showcase-lecture .list .title {
        font-size: 116%;
        margin: 20px 0;
    }

    .body-showcase-lecture .list .text {
        font-size: 93%;
        margin: 20px 0;
    }
}

@media screen and (min-width: 768px) and (max-width: 1014px) {
    .body-showcase-lecture .list .list-title {
        padding-left: 12px;
    }

    .body-showcase-lecture .list article {
        margin-left: 12px;
        margin-right: 12px;
    }
}

@media screen and (min-width: 768px) {
    .body-showcase-lecture .list {
        margin-top: 60px;
    }

    .body-showcase-lecture .list .list-title {
        font-size: 231%;
        margin-bottom: 10px;
    }

    .body-showcase-lecture .list article {
        padding-bottom: 30px;
        border-bottom: 1px solid #e8e8e8;
        margin-bottom: 30px;
    }

    .body-showcase-lecture .list .title {
        font-size: 139%;
        margin: 20px 0;
    }

    .body-showcase-lecture .list .text {
        font-size: 108%;
        margin: 20px 0;
    }
}

/* Service
 * ====================================================================== */
.body-service .main p {
    color: #2e2e2e;
}

.body-service .main .category:nth-child(2) {
    background-color: #f6f6f6;
}

.body-service .main .category-title {
    text-align: center;
    font-weight: 100;
}

.body-service .main .article-title {
    font-weight: normal;
    color: #2b468d;
}

.body-service-detail .content .item-title {
    color: #4ccbd3;
}

.body-service-detail .content .point-title,
.body-service-detail .content .item-subtitle {
    color: #2b468d;
}

.body-service-detail .content .list {
    font-weight: bold;
}

.body-service-detail .content .item_sub p {
    margin-bottom: 20px;
}

.body-service-training .two-column a {
    color: #2e2e2e;
}

@media screen and (max-width: 767px) {
    .body-service .page-header {
        border-bottom: 1px solid #e2e2e2;
    }

    .body-service .main .category:nth-child(1) {
        margin-top: 40px;
    }

    .body-service .main .category:nth-child(2) {
        padding: 2px 0;
    }

    .body-service .main .category-title {
        margin-top: 20px;
        margin-bottom: 20px;
        font-size: 170%;
    }

    .body-service .main .category-title img {
        position: relative;
        vertical-align: middle;
        top: -3px;
        margin-right: 6px;
    }

    .body-service .main .category-lead {
        margin: 0 12px;
        font-size: 93%;
    }

    .body-service .main article {
        margin: 25px 0;
    }

    .body-service .main .article-sub {
        margin: 0 25px;
        text-align: center;
    }

    .body-service .main .article-sub img {
        width: 100%;
    }

    .body-service .main .lineup1 {
        margin-bottom: 50px;
    }

    .body-service .main .lineup2 {
        margin-bottom: 50px;
    }

    .body-service .main .lineup2 .article-sub {
        margin: 0 30px;
    }

    .body-service .main .lineup3 {
        margin-bottom: 50px;
    }

    .body-service .main .lineup4 .article-sub {
        margin: 0 70px;
    }

    .body-service .main .lineup5 {
        margin-bottom: 50px;
    }

    .body-service .main .lineup6 {
        margin-bottom: 50px;
    }

    .body-service .main .lineup6 .article-sub {
        margin: 0 35px;
    }

    .body-service .main .article-main {
        margin: 0 12px;
    }

    .body-service .main .article-title {
        font-size: 131%;
        margin: 15px 0;
    }

    .body-service .main .article-lead {
        font-size: 93%;
        margin: 15px 0;
    }

    .body-service-detail .mainvisual {
        margin: 12px;
    }

    .body-service-detail .mainvisual img {
        width: 100%;
    }

    .body-service-detail .service-title {
        margin-bottom: 25px;
    }

    .body-service-detail .outline {
        margin: 20px 12px 40px 12px;
        font-size: 93%;
        line-height: 1.5;
    }

    .body-service-detail .content .item-title {
        font-size: 116%;
        margin: 25px auto 10px 12px;
    }

    .body-service-detail .content .point-title {
        font-size: 100%;
        margin: 12px;
    }

    .body-service-detail .content .point-title img {
        width: 22px;
        margin-right: 5px;
    }

    .body-service-detail .content .item-subtitle {
        font-size: 100%;
        margin: 12px 12px 5px 12px;
    }

    .body-service-detail .content .text {
        font-size: 93%;
        margin: 5px 12px;
    }

    .body-service-detail .content .list {
        margin: 12px;
    }

    .body-service-detail .content .note {
        margin-top: 20px;
    }

    .body-service-detail .content .item-list {
        border-top: 1px solid #ccc;
    }

    .body-service-detail .content .item-list .item {
        border-bottom: 1px solid #ccc;
    }

    .body-service-detail .content .item-list .item:last-child {
        border-bottom: none;
    }

    .body-service-detail .content .item-list:last-child {
        border-bottom: 1px solid #ccc;
    }

    .body-service-detail .content .item-box {
        border-top: 1px solid #ccc;
        border-bottom: 1px solid #ccc;
    }

    .body-service-detail .content .item-two .item-inner-sub {
        margin: 10px auto 15px;
        text-align: center;
    }

    .body-service-detail .content .item-two .item-inner-sub img {
        max-width: 100%;
    }
}

@media screen and (min-width: 768px) {
    .body-service .main {
        margin-top: 30px;
    }

    .body-service .main .category {
        padding: 0 10px;
    }

    .body-service .main .category .inner {
        padding-top: 60px;
        padding-bottom: 80px;
        max-width: 1014px;
        margin: 0 auto;
    }

    .body-service .main .category:last-child .inner {
        padding-bottom: 20px;
    }

    .body-service .main .category-title {
        margin-bottom: 25px;
        font-size: 277%;
    }

    .body-service .main .category-title img {
        top: -4px;
        margin-right: 10 px; position : relative;
        vertical-align: middle;
    }

    .body-service .main .category-lead {
        margin-bottom: 50px;
        font-size: 108%;
        line-height: 2;
    }

    .body-service .main article {
        display: table;
        width: 100%;
        margin-top: 50px;
    }

    .body-service .main .article-sub {
        display: table-cell;
        width: 440px;
        vertical-align: middle;
        text-align: center;
    }

    .body-service .main .article-main {
        display: table-cell;
        padding-left: 60px;
        vertical-align: top;
    }

    .body-service .main .article-title {
        font-size: 170%;
    }

    .body-service .main .article-lead {
        margin: 25px 0 30px;
        font-size: 108%;
        line-height: 2;
    }

    .body-service-detail .mainvisual {
        margin: 30px 0;
    }

    .body-service-detail .mainvisual img {
        display: block;
        margin: 0 auto;
    }

    .body-service-detail .main {
        max-width: 1014px;
        margin: 0 auto;
    }

    .body-service-detail .service-title {
        margin: 30px auto 10px;
    }

    .body-service-detail .outline {
        margin: 40px auto 80px auto;
        font-size: 116%;
        line-height: 1.6;
    }

    .body-service-detail .content {
        padding: 0 50px;
        margin-bottom: 80px;
    }

    .body-service-detail .content .item-title {
        margin: 55px 0 10px;
        font-size: 124%;
        font-weight: bold;
    }

    .body-service-detail .content .point-title,
    .body-service-detail .content .item-subtitle {
        font-size: 108%;
        font-weight: bold;
    }

    .body-service-detail .content .point-title {
        position: relative;
        margin: 0 40px 0 65px;
    }

    .body-service-detail .content .point-title img {
        position: absolute;
        top: -4px;
        left: -45px;
    }

    .body-service-detail .content .item-subtitle {
        margin-bottom: 5px;
    }

    .body-service-detail .content .text {
        margin-bottom: 10px;
        font-size: 100%;
        line-height: 1.75;
    }

    .body-service-detail .content .note {
        margin-top: 30px;
    }

    .body-service-detail .content .item-list {
        border: 1px solid #ccc;
    }

    .body-service-detail .content .item-list .item {
        border-bottom: 1px solid #ccc;
        padding-top: 20px;
    }

    .body-service-detail .content .item-list .item:last-child {
        border-bottom: none;
    }

    .body-service-detail .content .item-inner-main .text {
        margin: 15px 40px 25px 65px;
    }

    .body-service-detail .content .item-inner-main .list {
        margin: 15px 40px 25px 65px;
    }

    .body-service-detail .content .item-two {
        display: table;
        width: 100%;
    }

    .body-service-detail .content .item-two .item-inner-main {
        display: table-cell;
        vertical-align: top;
    }

    .body-service-detail .content .item-two .item-inner-sub {
        display: table-cell;
        width: 332px;
        vertical-align: top;
        text-align: center;
    }

    .body-service-detail .content .item-box {
        border: 1px solid #ccc;
        padding: 20px 40px;
    }

    .body-service-detail .content ul {
        margin-bottom: 20px;
    }

    .body-service-detail .content li {
        line-height: 1.75;
    }

    .body-service-training .two-column {
        display: table;
        width: 100%;
        margin-bottom: 10px;
    }

    .body-service-training .two-column > h2 {
        display: table-cell;
    }

    .body-service-training .two-column > p {
        display: table-cell;
        text-align: right;
    }
}

/* Product
 * ====================================================================== */
@media screen and (max-width: 767px) {
    .body-product .main {
        padding-top: 20px;
    }

    .body-product .main .category:nth-child(2n) {
        padding: 2px 0;
        background-color: #f6f6f6;
    }

    .body-product .main article {
        margin: 25px auto;
    }

    .body-product .main .article-main {
        margin: 0 12px;
    }

    .body-product .main .article-title {
        display: block;
        margin: 25px auto;
        text-indent: 200%;
        white-space: nowrap;
        overflow: hidden;
    }

    .body-product .main .article-title.product_skydream {
        width: 119px;
        height: 20.5px;
        background: transparent url("product/img/sp/title_sp_skydream.png") 0 0 no-repeat;
        background-size: 119px 20.5px;
        -webkit-background-size: 119px 20.5px;
    }

    .body-product .main .article-title.product_qoopa {
        width: 91px;
        height: 20px;
        background: transparent url("product/img/sp/title_sp_qoopa.png") 0 0 no-repeat;
        background-size: 91px 20px;
        -webkit-background-size: 91px 20px;
    }

    .body-product .main .article-title.product_extouch {
        width: 198.5px;
        height: 18.5px;
        background: transparent url("product/img/sp/title_sp_extouch.png") 0 0 no-repeat;
        background-size: 198.5px 18.5px;
        -webkit-background-size: 198.5px 18.5px;
    }

    .body-product .main .article-title.product_knowledgegate {
        width: 253px;
        height: 22px;
        background: transparent url("product/img/sp/title_sp_kg.png") 0 0 no-repeat;
        background-size: 253px 22px;
        -webkit-background-size: 253px 22px;
    }

    .body-product .main .article-title.product_sharepoint_tmpl {
        width: 223.5px;
        height: 35px;
        background: transparent url("product/img/sp/title_sp_sharepoint.png") 0 0 no-repeat;
        background-size: 223.5px 35px;
        -webkit-background-size: 223.5px 35px;
    }

    .body-product .main .article-lead {
        margin: 20px 0;
        font-size: 108%;
        font-weight: bold;
        line-height: 1.5;
        color: #1ca0d5;
    }

    .body-product .main .article-body {
        margin: 0;
        font-weight: normal;
        font-size: 100%;
        line-height: 1.5;
        color: #000;
    }

    .body-product .main .article_thum img {
        display: block;
        width: 50%;
        height: auto;
        margin: 25px auto;
    }

    .body-product-detail .product-title {
        margin-bottom: 10px;
    }

    .body-product-detail .main {
        margin: 0 auto;
        padding: 0;
    }

    .body-product-detail .mainvisual img {
        width: 100%;
    }

    .body-product-detail .content {
        margin: 0 12px;
    }

    .body-product-detail .content .outline {
        margin: 30px auto;
        font-size: 116%;
        line-height: 1.6;
    }

    .body-product-detail .content .item {
        display: block;
        width: 100%;
        margin: 4px auto;
        border-bottom: 1px solid #e8e8e8;
    }

    .body-product-detail .content .item .item-inner-main {
        display: block;
        vertical-align: top;
    }

    .body-product-detail .content .item .item-inner-main .point-title {
        margin: 12px 0 0 0;
        font-size: 116%;
    }

    .body-product-detail .content .item .item-inner-main .text {
        box-sizing: content-box;
        -webkit-box-sizing: content-box;
        padding: 12px 0 32px 0;
        line-height: 1.8;
        font-size: 108%;
    }

    .body-product-detail .content .item > figure {
        display: block;
        padding: 12px 0;
        vertical-align: middle;
        text-align: center;
    }

    .body-product-detail .content .item > figure img {
        width: 50%;
    }

    .body-product-detail .content .item .figures1 figure,
    .body-product-detail .content .item .figures2 figure {
        margin: 15px 20px;
        text-align: center;
    }

    .body-product-detail .content .item .figures1 figcaption,
    .body-product-detail .content .item .figures2 figcaption {
        font-size: 85%;
        margin-top: 5px;
        text-align: center;
    }

    .body-product-detail .content .item .figures1 img,
    .body-product-detail .content .item .figures2 img {
        max-width: 100%;
    }

    .body-product-detail .content .item-title {
        margin: 0 auto 12px auto;
        padding-bottom: 12px;
        color: #4ccbd3;
        font-size: 139%;
        text-align: center;
        border-bottom: 3px solid #e8e8e8;
    }

    .body-product-detail .content .point-title,
    .body-product-detail .content .item-subtitle {
        color: #2b468d;
    }

    .body-product-detail .content .item_sub p {
        margin-bottom: 20px;
    }

    .body-product-detail .sample {
        margin: 36px 12px;
    }

    .body-product-detail .sample .text {
        margin-bottom: 32px;
        font-size: 108%;
        color: #000;
    }

    .body-product-detail .sample a {
        padding: 0 0 2px 0;
        color: #000;
        text-decoration: none;
        border-bottom: 1px dotted #000;
        font-weight: bold;
        font-size: 108%;
    }

    .body-product-detail .contact {
        margin: 24px 12px 0 12px;
        padding: 30px 24px;
        background-color: #eeeff2;
        border-radius: 6px;
    }

    .body-product-detail .contact h2 {
        margin: 0 0 24px 0;
        font-size: 108%;
        font-weight: bold;
    }

    .body-product-detail .contact h3 {
        margin: 24px 0 0 0;
        font-size: 108%;
        font-weight: normal;
    }

    .body-product-detail .contact dl:after {
        content: "";
        display: block;
        clear: both;
    }

    .body-product-detail .contact dt {
        clear: left;
        float: left;
        display: inline-block;
        font-size: 108%;
    }

    .body-product-detail .contact dd {
        float: left;
        display: block;
        font-size: 108%;
    }

    .body-product-detail .contact a {
        padding-bottom: 1px;
        color: #000;
        text-decoration: none;
        border-bottom: 1px dotted #000;
    }

    .body-product-detail .pagetop {
        margin: 14px auto 0 auto;
        padding: 10px;
    }
}

@media screen and (min-width: 768px) {
    .body-product .main {
        padding-top: 40px;
    }

    .body-product .main .category {
        padding: 50px 0;
    }

    .body-product .main .category:nth-child(2n) {
        background-color: #f6f6f6;
    }

    .body-product .main .inner {
        max-width: 1014px;
        margin: 0 auto;
    }

    .body-product .main article {
        position: relative;
        display: table;
        width: 100%;
    }

    .body-product .main .article_inner {
        display: table-cell;
        padding: 0 0 90px 5px;
        vertical-align: top;
    }

    .body-product .main .article_inner .article-title {
        width: 580px;
        text-indent: 200%;
        white-space: nowrap;
        overflow: hidden;
    }

    .body-product .main .article_inner .article-title.product_skydream {
        height: 60px;
        background: transparent url("product/img/title_skydream.png") 0 0 no-repeat;
    }

    .body-product .main .article_inner .article-title.product_qoopa {
        height: 60px;
        background: transparent url("product/img/title_qoopa.png") 0 0 no-repeat;
    }

    .body-product .main .article_inner .article-title.product_extouch {
        height: 60px;
        background: transparent url("product/img/title_extouch.png") 0 0 no-repeat;
    }

    .body-product .main .article_inner .article-title.product_knowledgegate {
        height: 60px;
        background: transparent url("product/img/title_kg.png") 0 0 no-repeat;
    }

    .body-product .main .article_inner .article-title.product_sharepoint_tmpl {
        height: 90px;
        background: transparent url("product/img/title_sharepoint.png") 0 0 no-repeat;
    }

    .body-product .main .article_inner .article-title.product_otegarulaunchergogo {
        height: 90px;
        background: transparent url("product/img/title_otegarulaunchergogo.png") 0 0 no-repeat;
    }

    .body-product .main .article_inner .article-lead {
        margin: 12px 36px 24px 0;
        font-size: 124%;
        font-weight: bold;
        line-height: 1.8;
        color: #1ca0d5;
    }

    .body-product .main .article_inner .article-body {
        margin: 0 36px 0 0;
        font-weight: normal;
        font-size: 116%;
        line-height: 1.6;
        color: #000;
    }

    .body-product .main .article_thum {
        display: table-cell;
        padding-right: 5px;
        vertical-align: middle;
    }

    .body-product .main .article_thum img {
        vertical-align: bottom;
    }

    .body-product .main .roundbtn {
        position: absolute;
        bottom: 0;
        left: 5px;
        margin-top: 24px;
    }

    .body-product-detail .product-title {
        margin: 30px auto 10px;
    }

    .body-product-detail .main {
        max-width: 1014px;
        margin: 0 auto;
        padding-top: 5px;
    }

    .body-product-detail .mainvisual img {
        width: 100%;
    }

    .body-product-detail .content {
        margin: 0 40px;
    }

    .body-product-detail .content a {
        font-weight: bold;
    }

    .body-product-detail .content .outline {
        margin: 40px auto;
        font-size: 116%;
        line-height: 1.6;
    }

    .body-product-detail .content .item {
        display: table;
        width: 100%;
        margin: 4px auto;
        border-bottom: 1px solid #e8e8e8;
    }

    .body-product-detail .content .item .item-inner-main {
        display: table-cell;
        vertical-align: top;
    }

    .body-product-detail .content .item .item-inner-main .point-title {
        margin: 32px 0 0 0;
        font-size: 139%;
    }

    .body-product-detail .content .item .item-inner-main .text {
        box-sizing: content-box;
        -webkit-box-sizing: content-box;
        padding: 12px 48px 32px 0;
        line-height: 1.8;
        font-size: 108%;
    }

    .body-product-detail .content .item > figure {
        display: table-cell;
        width: 420px;
        padding: 12px 0;
        vertical-align: middle;
        text-align: center;
    }

    .body-product-detail .content .item .figures1 figure,
    .body-product-detail .content .item .figures2 figure {
        margin-bottom: 30px;
        text-align: center;
    }

    .body-product-detail .content .item .figures1 figcaption,
    .body-product-detail .content .item .figures2 figcaption {
        margin-top: 10px;
        text-align: center;
    }

    .body-product-detail .content .item .figures1 {
        width: 398px;
        float: left;
    }

    .body-product-detail .content .item .figures2 {
        float: right;
        width: 397px;
    }

    .body-product-detail .content .item .figures2:after {
        display: block;
        clear: both;
        height: 0;
        visibility: hidden;
        content: ".";
    }

    .body-product-detail .content .item-title {
        margin: 0 auto 12px auto;
        padding-bottom: 2px;
        color: #4ccbd3;
        font-size: 170%;
        text-align: center;
        border-bottom: 3px solid #e8e8e8;
    }

    .body-product-detail .content .point-title,
    .body-product-detail .content .item-subtitle {
        color: #2b468d;
    }

    .body-product-detail .content .item_sub p {
        margin-bottom: 20px;
    }

    .body-product-detail .sample {
        margin: 36px 40px;
    }

    .body-product-detail .sample .text {
        margin-bottom: 32px;
        font-size: 108%;
        color: #000;
    }

    .body-product-detail .sample a {
        font-weight: bold;
        font-size: 108%;
    }

    .body-product-detail .contact {
        margin: 36px 40px 90px 40px;
        padding: 30px 40px;
        background-color: #eeeff2;
        border-radius: 6px;
    }

    .body-product-detail .contact h2 {
        margin: 0 0 24px 0;
        font-size: 108%;
        font-weight: bold;
    }

    .body-product-detail .contact h3 {
        margin: 24px 0 0 0;
        font-size: 108%;
        font-weight: normal;
    }

    .body-product-detail .contact dl:after {
        content: "";
        display: block;
        clear: both;
    }

    .body-product-detail .contact dt {
        clear: left;
        float: left;
        display: inline-block;
        font-size: 108%;
    }

    .body-product-detail .contact dd {
        float: left;
        display: block;
        font-size: 108%;
    }
}

@media screen and (max-width: 891px) and (min-width: 767px) {
    .body-product .main .article-main .article_inner {
        display: block;
        padding: 0 5px;
    }

    .body-product .main .article-main .article_inner .article-lead {
        margin: 12px auto;
    }

    .body-product .main .article-main .article_inner .article-body {
        margin: 0 auto;
    }

    .body-product .main .article-main .article_thum {
        display: block;
        margin: 24px auto;
    }

    .body-product .main .article-main .article_thum img {
        display: block;
        margin: 0 auto;
    }
}

/* News
 * ====================================================================== */
.body-news .content {
    position: relative;
    max-width: 678px;
    margin: 0 auto;
}

.body-news .content > h1 {
    color: #2e2e2e;
    font-family: 'nobel-regular';
    font-weight: normal;
}

.body-news .content .list {
    margin-top: 80px;
}

.body-news .content article {
    color: #2e2e2e;
}

.body-news .content article a {
    color: #2e2e2e;
    text-decoration: none;
    border-bottom: 1px dotted #2e2e2e;
}

.body-news .content article a:hover {
    color: #2e2e2e;
}

.body-news .content article h1.type0 {
    padding-left: 5px;
    border-left: 5px solid rgb(204, 204, 204);
}

.body-news .content article h1.type1 {
    padding-left: 5px;
    border-left: 5px solid #ff6b57;
}

.body-news .content article h1.type2 {
    padding-left: 5px;
    border-left: 5px solid #dddb52;
}

.body-news .content article h1.type3 {
    padding-left: 5px;
    border-left: 5px solid #70e052;
}

.body-news .content article h1.type4 {
    padding-left: 5px;
    border-left: 5px solid #55e4d8;
}

.body-news .content article h1.type5 {
    padding-left: 5px;
    border-left: 5px solid #fbc3e4;
}

.body-news .content article:after {
    display: block;
    clear: both;
    height: 0;
    visibility: hidden;
    content: ".";
}

.body-news-detail .news-main img {
    max-width: 100%;
}

.body-news-detail .news-main h1 {
    margin-bottom: 30px;
}

.body-news-detail .news-main a {
    font-weight: bold;
}

.body-news-detail .news-main .links li {
    margin-bottom: 10px;
}

.body-news-detail .news-type1 h1 {
    padding-left: 5px;
    border-left: 8px solid #ff6b57;
}

.body-news-detail .news-type2 h1 {
    padding-left: 5px;
    border-left: 8px solid #dddb52;
}

.body-news-detail .news-type3 h1 {
    padding-left: 5px;
    border-left: 8px solid #70e052;
}

.body-news-detail .news-type4 h1 {
    padding-left: 5px;
    border-left: 8px solid #55e4d8;
}

.body-news-detail .news-type5 h1 {
    padding-left: 5px;
    border-left: 8px solid #fbc3e4;
}

@media screen and (max-width: 767px) {
    .body-news .main {
        margin: 50px auto;
    }

    .body-news .content {
        margin: 0 auto;
        max-width: 600px;
    }

    .body-news .content .news_with_thumb {
        min-height: 120px;
    }

    .body-news .content > h1 {
        text-align: center;
        font-size: 131%;
        margin-bottom: 10px;
        line-height: 1.5;
        padding: 2px 0;
        letter-spacing: 1px;
        background-color: #e8e8e8;
    }

    .body-news .content .list {
        margin: auto;
        max-width: 600px;
    }

    .body-news .content .thumb {
        float: left;
        margin: 0 12px 12px 0;
    }

    .body-news .content article {
        margin: 12px 0 12px 0;
        padding: 0 12px 12px 12px;
        border-bottom: 2px solid #e8e8e8;
    }

    .body-news .content article h1 {
        font-size: 100%;
        line-height: 1.25;
        margin-bottom: 15px;
    }

    .body-news .content article p {
        font-size: 93%;
        line-height: 1.5;
    }

    .body-news .content article .date {
        margin-bottom: 10px;
    }

    .body-news .content article:last-child {
        border-bottom: none;
    }

    .body-news .content:last-child article:last-child {
        border-bottom: 2px solid #e8e8e8;
    }

    .body-news-detail .news-main {
        margin: 12px;
    }

    .body-news-detail .news-main h1 {
        font-size: 100%;
    }

    .body-news-detail .news-main .content {
        margin-bottom: 20px;
    }

    .body-news-detail .news-main .title {
        font-size: 108%;
        padding-bottom: 2px;
        border-bottom: 2px solid #e2e2e2;
    }

    .body-news-detail .news-main .text {
        font-size: 93%;
        margin-bottom: 20px;
    }
}

@media screen and (min-width: 768px) {
    .body-news .main {
        margin: 80px auto;
    }

    .body-news .content > h1 {
        font-size: 154%;
        position: absolute;
        top: -12px;
        left: 0;
    }

    .body-news .content .news_with_thumb {
        position: relative;
    }

    .body-news .content .news_with_thumb h1 {
        margin-left: 110px;
    }

    .body-news .content .news_with_thumb p {
        margin-left: 110px;
    }

    .body-news .content .news_with_thumb .thumb {
        position: absolute;
        top: 20px;
        left: 0;
    }

    .body-news .content article {
        border-top: 3px solid #e8e8e8;
        padding: 20px 0;
    }

    .body-news .content article h1 {
        font-size: 108%;
        line-height: 1.25;
        margin-bottom: 15px;
    }

    .body-news .content article p {
        font-size: 100%;
        line-height: 1.75;
    }

    .body-news .content article .date {
        margin-bottom: 10px;
    }

    .body-news .content:last-child article:last-child {
        border-bottom: 3px solid #e8e8e8;
    }

    .body-news-detail .news-main {
        width: 605px;
        margin: 0 auto;
    }

    .body-news-detail .news-main h1 {
        font-size: 139%;
    }

    .body-news-detail .news-main .content {
        margin-bottom: 30px;
    }

    .body-news-detail .news-main .title {
        font-size: 139%;
        padding-bottom: 5px;
        border-bottom: 3px solid #e2e2e2;
    }

    .body-news-detail .news-main .text {
        font-size: 108%;
    }
}

/* iOS
 * ====================================================================== */
@media screen and (min-width: 768px) {
    body.ios {
        margin-bottom: 580px;
    }

    body.ios .common-footer {
        bottom: 0;
    }

    body.ios .main {
        padding-top: 40px;
    }

    body.ios .main .category {
        padding: 50px 0;
        background: url("service/ios/img/category-bg.png") center bottom no-repeat;
    }

    body.ios .main .inner {
        max-width: 1014px;
        margin: 0 auto;
    }

    body.ios .main article {
        position: relative;
        display: table;
        width: 100%;
    }

    body.ios .main .ios-title {
        width: 100%;
        font-size: 277%;
        font-weight: normal;
        white-space: nowrap;
        text-align: center;
        height: 60px;
        line-height: 60px;
    }

    body.ios .main .ios-mainvisual {
        width: 100%;
        text-align: center;
        margin: 50px 0;
    }

    body.ios .main .ios-mainvisual img {
        height: 240px;
        width: auto;
    }

    body.ios .main .ios-title-sub,
    body.ios .main .ios-title-sub-2 {
        font-size: 190%;
        font-weight: normal;
        text-align: center;
    }

    body.ios .main .ios-title-sub-2 {
        color: #3f9ace;
        padding: 10px 0;
    }

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

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

    body.ios .mb30 {
        margin-bottom: 30px !important;
    }
    body.ios .mt30 {
        margin-top: 30px !important;
    }

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

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

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

    body.ios .c808080 {
        color: #808080 !important;
    }

    body.ios .f150 {
        font-size: 150% !important;
    }

    body.ios .ios-section {
        width: 100%;
        margin: 30px 0;
    }

    body.ios .main .ios-contact {
        margin: 0px auto;
        width: 286px;
        border: 2px solid #909090;
        padding: 30px 0;
        text-align: center;
        vertical-align: middle;
        color: #3f9ace;
        text-decoration: underline;
    }

    body.ios .nobg {
        background: none !important;
    }

    body.ios .bg {
        background: #f6f6f6 !important;
    }

    body.ios .main .ios-lctn,
    body.ios .main .ios-rctn {
        display: table-cell;
        width: 317px;
        text-align: center;
        vertical-align: middle;
    }

    body.ios .main .ios-lctn {
        padding-left: 190px;
    }

    body.ios .main .ios-rctn {
        padding-right: 190px;
    }

    body.ios .main .ios-section .ios-lctn-s-title,
    body.ios .main .ios-section .ios-rctn-s-label {
        display: table-cell;
        vertical-align: middle;
    }

    body.ios.main .ios-section .ios-lctn-s-title {
        width: 100px;
        text-align: center;
    }

    body.ios .main .ios-section .ios-rctn-s-label {
        width: 150px;
        padding-left: 17px;
        text-align: left;
    }

    body.ios .main .ios-section .ios-lctn {
        text-align: right;
        width: 300px;
        padding-right: 17px;
    }

    body.ios .main .ios-lctn .ios-lctn-article,
    body.ios .main .ios-rctn .ios-rctn-article {
        color: #808080;
    }

    body.ios .main .ios-section .ios-rctn {
        text-align: left;
    }

    body.ios .main .ios-lctn .ios-lctn-title,
    body.ios .main .ios-rctn .ios-rctn-title {
        font-size: 200%;
        font-weight: normal;
        margin: 10px 0;
        color: #3f9ace;
    }

    body.ios .main .ios-article {
        width: 100%;
        text-align: center;
        color: #808080;
    }

    body.ios .main .ios-title img {
        vertical-align: middle;
    }

    /*  footer style override ============ */
    body.ios .common-footer .badges {
        float: right;
        width: auto;
    }

    body.ios .common-footer .badges li {
        float: left;
    }

    body.ios .common-footer .badges li:nth-child(1),
    body.ios .common-footer .badges li:nth-child(2) {
        padding-right: 43px;
    }
}

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

    body.ios .main .category {
        padding: 12px 0;
        background: url("service/ios/img/category-bg.png") center bottom no-repeat;
    }

    body.ios .main .inner {
        margin: 0 12px;
    }

    body.ios .main .ios-title {
        width: 100%;
        font-size: 115%;
        font-weight: normal;
        white-space: nowrap;
        text-align: center;
        height: 60px;
        line-height: 60px;
    }

    body.ios .main .ios-mainvisual {
        width: 100%;
        text-align: center;
        margin: 12px 0;
    }
    body.ios .main .ios-mainvisual img {
        width: 90%;
        height: auto;
    }

    body.ios .main .ios-ctn-row div {
        display:block;
        margin: 12px 0;
    }

    body.ios .main .ios-ctn-row div img {
        width: 50%;
        height: auto;
    }

    body.ios .main .ios-title-sub,
    body.ios .main .ios-title-sub-2 {
        font-size: 100%;
        font-weight: normal;
        text-align: center;
    }

    body.ios .main .ios-title-sub-2 {
        color: #3f9ace;
        padding: 10px 0;
        font-size: 200%;
    }

    body.ios .w55 {
        width: 55%;
    }

    body.ios .w45 {
        width: 45%;
    }

    body.ios .w50 {
        width: 50%;
    }

    body.ios .w40 {
        width: 40%;
    }

    body.ios .w60 {
        width: 60%;
    }

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

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

    body.ios .mb30 {
        margin-bottom: 30px !important;
    }
    body.ios .mt30 {
        margin-top: 30px !important;
    }

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

    body.ios .c808080 {
        color: #808080 !important;
    }

    body.ios .pr50 {
        padding-right: 0;
    }

    body.ios .pl50 {
        padding-left: 0;
    }

    body.ios .ios-section {
        width: 100%;
        margin: 12px 0;
    }

    body.ios .main .ios-contact {
        margin: 0px auto;
        width: 286px;
        border: 2px solid #909090;
        padding: 30px 0;
        text-align: center;
        vertical-align: middle;
        color: #3f9ace;
        text-decoration: underline;
    }

    body.ios .nobg {
        background: none !important;
    }

    body.ios .bg {
        background: #f6f6f6 !important;
    }

    body.ios .main .ios-lctn,
    body.ios .main .ios-rctn {
        display: table-cell;
        text-align: center;
        vertical-align: middle;
    }

    body.ios .main .ios-section .ios-rctn {
        text-align: left;
        padding-left: 12px;
    }
    body.ios .main .ios-section .ios-lctn {
        text-align: right;
        padding-left: 30px;
    }

    body.ios .main .ios-section .ios-lctn-s-title,
    body.ios .main .ios-section .ios-rctn-s-label {
        display: table-cell;
        vertical-align: middle;
    }

    body.ios.main .ios-section .ios-lctn-s-title {
        width: 100px;
        text-align: center;
    }


    body.ios .main .ios-section .ios-rctn-s-label {
        text-align: left;
        padding-left: 10px;
    }



    body.ios .main .ios-lctn .ios-lctn-article,
    body.ios .main .ios-rctn .ios-rctn-article {
        color: #808080;
    }



    body.ios .main .ios-lctn .ios-lctn-title,
    body.ios .main .ios-rctn .ios-rctn-title {
        font-size: 200%;
        font-weight: normal;
        margin: 10px 0;
        color: #3f9ace;
    }

    body.ios .main .ios-msize {
        height: 40%;
        width: auto;
    }

    body.ios .main .ios-article {
        width: 100%;
        text-align: center;
        color: #808080;
    }

    body.ios .main .ios-title img {
        vertical-align: middle;
        height:30%;
        width: auto;
    }

    /* footer override ================= */
    body.ios .common-footer {
        height: auto;
        bottom: auto;
    }

    body.ios .common-footer .badges li:nth-child(2) {
        display: block;
    }

    body.ios .common-footer .badges li:nth-child(2) img,
    body.ios .common-footer .badges li:nth-child(3) img {
        padding-top: 10px;
    }
}




/* -------------------------------------------------- secondfactory WordPress theme */

.screen-reader-text {
    position: fixed;
    right: 100%;
    bottom: 100%;
    z-index: -1;
}

/* pagination of news archives page */
nav.navigation.pagination {
    padding-top: 50px;
}
.nav-links {
    text-align: center;
}
.nav-links .page-numbers {
    border-bottom-color: transparent;
    display: inline-block;
    padding: 0.5em 1.25em;
}
.nav-links a.page-numbers:hover {
    border-bottom-color: #000;
    color: #000;
}
.nav-links .page-numbers.current {
    color: #000;
    font-weight: bold;
}
.nav-links .page-numbers.prev {
    background-color: #ddd;
    margin-right: 1.5em;
    padding: 0.5em 0.75em;
}
.nav-links .page-numbers.next {
    background-color: #ddd;
    margin-left: 1.5em;
    padding: 0.5em 0.75em;
}
.nav-links .page-numbers.prev:hover,
.nav-links .page-numbers.next:hover {
    border-bottom-color: transparent;
}

/* slick slider */
.your-class-slick {
    max-width: 100%;
    margin: 0 auto;
}

.your-class-slick img {
    width: 100%;
    height: auto;
}