/*
 * 汎用スタイル
 * OOCSSとBEMを合わせた設計方針になっており、Device-Object(_Elements)-Modifierの命名規則になります。
 * Object / Elements / Modifier が1単語で表せない場合にはキャメルケースでつなぎます。
 * Elementsが複数ある場合にはスネークケースでつなぎます。（Object-Elements_Elements-Modifier
 * Modifierが複数ある場合にはチェーンケースでつなぎます。（Object-Modifier-Modifier）
 */
/*-------------------------------------------------------------------------------
  ラッパー
-------------------------------------------------------------------------------*/
.container {
    margin-left: auto;
    margin-right: auto;
    width: 1050px;
}

.content {
    margin-right: 20px;
    margin-left: 20px;
}

.content-negative {
    margin-right: -20px;
    margin-left: -20px;
}

.content-wrap {
    margin: 20px;
}

/* スマホ */
@media screen and (max-width: 767px) {
    .container {
        width: auto;
    }

    .content {
        margin-left: 15px;
        margin-right: 15px;
    }

    .sp-content {
        margin-left: 15px;
        margin-right: 15px;
    }

    .content-negative {
        margin-right: -15px;
        margin-left: -15px;
    }

    .content-wrap {
        margin: 15px;
    }
}

/*-------------------------------------------------------------------------------
  背景色
-------------------------------------------------------------------------------*/
.bg-white {
    background-color: #fff;
}

.bg-gray {
    background-color: #F3F3F3;
}

/* スマホ向けスタイル */
@media screen and (max-width: 767px) {
    .decoration-line:before {
        display: none;
    }
}

.color-primaryGreen {
    color: #00ACB8;
}

/* thumbnail */
.thumbnail-48,
.thumbnail-75,
.thumbnail-xsm,
.thumbnail-sm,
.thumbnail-md,
.thumbnail-lg,
.thumbnail-circle,
.thumbnail-dummy {
    box-sizing: border-box;
    background-color: #fff;
    overflow: hidden;
}

.thumbnail-dummy {
    border: 1px solid #ccc;
}

.thumbnail-48 img,
.thumbnail-75 img,
.thumbnail-xsm img,
.thumbnail-sm img,
.thumbnail-md img,
.thumbnail-lg img,
.thumbnail-circle img,
.thumbnail-dummy img {
    width: 100%;
    height: auto;
}

.thumbnail-48 {
    width: 48px;
    height: 48px;
}

.thumbnail-75 {
    width: 75px;
    height: 75px;
}

.thumbnail-xsm {
    width: 106px;
    height: 106px;
}

.thumbnail-sm {
    width: 150px;
    height: 150px;
}

.thumbnail-md {
    width: 200px;
    height: 150px;
}

.thumbnail-lg {
    width: 270px;
    height: 270px;
}

.thumbnail-circle {
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -ms-border-radius: 50%;
    border-radius: 50%;
}

.thumbnail-contain {
    text-align: center;
}

.thumbnail-contain img {
    width: auto !important;
    height: auto !important;
    max-width: 100% !important;
    max-height: 100% !important;
}

.thumbnail-dummy {
    background-repeat: no-repeat;
    background-position: center;
}

.thumbnail-48.thumbnail-dummy {
    background-image: url(/img/common/dummy/no_image-xsm.png);
    background-size: 40px auto;
}

.thumbnail-75.thumbnail-dummy {
    background-image: url(/img/common/dummy/no_image-xsm.png);
    background-size: 50px auto;
}

.thumbnail-xsm.thumbnail-dummy {
    background-image: url(/img/common/dummy/no_image-xsm.png);
}

.thumbnail-sm.thumbnail-dummy {
    background-image: url(/img/common/dummy/no_image-sm.png);
}

.thumbnail-md.thumbnail-dummy {
    background-image: url(/img/common/dummy/no_image-sm.png);
}

.thumbnail-lg.thumbnail-dummy {
    background-image: url(/img/common/dummy/no_image-lg.png);
}

.thumbnail-flexible-h {
    height: auto !important;
}

/* スマホ向けスタイル */
@media screen and (max-width: 767px) {
    .thumbnail-xsm {
        width: 48px;
        height: 48px;
    }

    .thumbnail-xsm {
        width: 75px;
        height: 75px;
    }

    .thumbnail-sm {
        width: 75px;
        height: 75px;
    }

    .thumbnail-md {
        width: 100px;
        height: 100px;
    }

    .thumbnail-lg {
        width: 135px;
        height: 135px;
    }

    .thumbnail-dummy {
        background-image: url(/img/common/dummy/no_image-lg.png);
    }

    .thumbnail-xsm.thumbnail-dummy {
        background-size: 60px auto;
    }

    .thumbnail-sm.thumbnail-dummy {
        background-size: 60px auto;
    }

    .thumbnail-md.thumbnail-dummy {
        background-size: 80px auto;
    }

    .thumbnail-lg.thumbnail-dummy {
        background-size: 100px auto;
    }
}

/*-------------------------------------------------------------------------------
  書式設定
-------------------------------------------------------------------------------*/
.text-center {
    text-align: center !important;
}

.text-right {
    text-align: right !important;
}

.float-l {
    float: left !important;
}

.float-r {
    float: right !important;
}

.va-top {
    vertical-align: top !important;
}

.va-middle {
    vertical-align: middle !important;
}

.va-bottom {
    vertical-align: bottom !important;
}

.fw-bold {
    font-weight: bold;
}

.fontSize-16 {
    font-size: 16px;
    font-size: 1.6rem;
}

/* 要素間余白 */
.offset-top-n {
    margin-top: 0 !important;
}

.offset-top-xsm {
    margin-top: 5px !important;
}

.offset-top-sm {
    margin-top: 10px !important;
}

.offset-top-md {
    margin-top: 20px !important;
}

.offset-top-lg {
    margin-top: 30px !important;
}

.offset-top-xlg {
    margin-top: 40px !important;
}

.offset-right-sm {
    margin-right: 10px !important;
}

.offset-right-md {
    margin-right: 20px !important;
}

.offset-right-lg {
    margin-right: 30px !important;
}

.offset-right-xlg {
    margin-right: 40px !important;
}

.offset-btm-n {
    margin-bottom: 0 !important;
}

.offset-btm-xsm {
    margin-bottom: 5px !important;
}

.offset-btm-sm {
    margin-bottom: 10px !important;
}

.offset-btm-md {
    margin-bottom: 20px !important;
}

.offset-btm-lg {
    margin-bottom: 30px !important;
}

.offset-btm-xlg {
    margin-bottom: 40px !important;
}

.offset-left-sm {
    margin-left: 10px !important;
}

.offset-left-md {
    margin-left: 20px !important;
}

.offset-left-lg {
    margin-left: 30px !important;
}

.offset-left-xlg {
    margin-left: 40px !important;
}

.margin-n {
    margin: 0 !important;
}

.margin-sm {
    margin: 10px !important;
}

.margin-md {
    margin: 20px !important;
}

.margin-lg {
    margin: 30px !important;
}

.padding-n {
    padding: 0 !important;
}

.padding-sm {
    padding: 10px !important;
}

.padding-md {
    padding: 20px !important;
}

.padding-lg {
    padding: 30px !important;
}

/* スマホ向けスタイル */
@media screen and (max-width: 767px) {
    .margin-sm {
        margin: 10px !important;
    }

    .margin-md {
        margin: 15px !important;
    }

    .margin-lg {
        margin: 20px !important;
    }

    .padding-sm {
        padding: 10px !important;
    }

    .padding-md {
        padding: 15px !important;
    }

    .padding-lg {
        padding: 20px !important;
    }
}

/*-------------------------------------------------------------------------------
  幅
-------------------------------------------------------------------------------*/
.w-auto {
    width: auto !important;
}
.w100p {
    width: 100% !important;
}

/*-------------------------------------------------------------------------------
  線
-------------------------------------------------------------------------------*/
.border-none {
    border: none !important;
}

/*-------------------------------------------------------------------------------
  分類できないもの
-------------------------------------------------------------------------------*/
.nowrap {
    white-space: nowrap;
}

.block {
    display: block;
}

.hide {
    display: none !important;
}

.overflow-hidden {
    overflow: hidden;
}

@media screen and (min-width: 768px) {
    .pc-hide {
        display: none !important;
    }
}

/* スマホ向けスタイル */
@media screen and (max-width: 767px) {
    .sp-hide {
        display: none !important;
    }
}

/*-------------------------------------------------------------------------------
  文書体裁
-------------------------------------------------------------------------------*/
.sentence-v3 {
    font-size: 16px;
    font-size: 1.6rem;
    line-height: 1.75;
}

.sentence-v3 p,
.sentence-v3 ul,
.sentence-v3 ol,
.sentence-v3 dl {
    margin-top: 1.5em;
}

ul.alignInitials > li,
ol.alignInitials > li {
    padding-left: 1em;
    text-indent: -1em;
}

ul.alignInitials-lv3 > li,
ol.alignInitials-lv3 > li {
    padding-left: 3em;
    text-indent: -3em;
}

ul.alignInitials-lv3 > li > .comText,
ol.alignInitials-lv3 > li > .comText {
    text-indent: 0;
}

.dl_standard dt {
    margin-top: 2.5rem;
    font-weight: bold;
}

.dl_standard > :first-child {
    margin-top: 0;
}

.dl_standard {

}

/*-------------------------------------------------------------------------------
  アラート
-------------------------------------------------------------------------------*/
.alert {
    margin-bottom: 20px;
    padding: 10px;
}

.alert-success {
    background-color: #DAF1CF;
    border: 1px solid #00A854;
}

.alert-error {
    background-color: #F1C6BD;
    border: 1px solid #A8000A;
}

@media screen and (max-width: 767px) {
    #conts > .alert {
        margin-left: 15px;
        margin-right: 15px;
    }
}

/*-------------------------------------------------------------------------------
  見出し
-------------------------------------------------------------------------------*/
.ttl01 {
    margin: -5px 0 30px;
    font-size: 32px;
    color: #111;
    line-height: 1.3;
}

/* スマホ向けスタイル */
@media screen and (max-width: 767px) {
    .ttl01 {
        margin: 0 -5px 17px 0;
        color: #00ACBA;
        font-size: 1.5em;
        font-weight: normal;
        line-height: 1.4;
    }

    .page-template-all .ttl01,
    .category .ttl01 {
        display: none;
    }
}

.ttl02 {
    margin-top: 40px;
    margin-bottom: 15px;
    padding: 18px 15px 15px;
    background: #E9E9E9;
    font-size: 165%;
    line-height: 1.3;
    border-top: 2px solid #00ACBA;
}

.ttl03 {
    margin-bottom: 15px;
    padding: 11px 15px 8px;
    font-size: 143%;
    line-height: 1.4;
    border-top: 1px dotted #666;
    border-bottom: 1px dotted #666;
}

.ttl04 {
    margin-bottom: 12px;
    padding-left: 21px;
    font-size: 128%;
    background: url(/img/common/icon09.png) no-repeat left 7px;
}

.ttl05 {
    margin-bottom: 10px;
    padding-left: 21px;
    font-size: 114%;
    background: url(/img/common/icon10.png) no-repeat 3px 4px;
}

.ttl06 {
    margin-top: 45px;
    margin-bottom: 20px;
    font-size: 22px;
    font-size: 2.2rem;
}

.ttl07 {
    margin-top: 30px;
    margin-bottom: 20px;
    padding: 13px 20px 10px;
    border-top: 3px solid #00ACBA;
    border-bottom: 1px dotted #CCC;
    color: #000;
    font-size: 24px;
    font-size: 2.4rem;
    font-weight: bold;
}

.ttl08 {
    margin-top: 50px;
    margin-bottom: 30px;
    margin-right: 20px;
    margin-left: -10px;
    padding: 13px 30px;
    background: #B5EAEE;
    position: relative;
    color: #000;
    font-size: 24px;
    font-size: 2.4rem;
    font-weight: bold;
}

.ttl08:before {
    border-top: 5px solid #41C2CD;
    border-right: 5px solid #41C2CD;
    border-bottom: 5px solid transparent;
    border-left: 5px solid transparent;
    content: "";
    position: absolute;
    bottom: -10px;
    left: 0;
}

.ttl08.negative {
    margin-left: -30px;
    margin-right: 0;
}

.ttl09 {
    margin-bottom: 15px;
    padding-bottom: 13px;
    border-bottom: 1px dotted #CCC;
    color: #000;
    font-size: 20px;
    font-size: 2.0rem;
    font-weight: bold;
}

@media all and (-ms-high-contrast:none){
    *::-ms-backdrop, .ttl09 {margin-top: 15px;} /* IE11 */
}

.ttl10 {
    margin-bottom: 10px;
    color: #004699;
    font-size: 26px;
    font-size: 2.6rem;
    font-weight: bold;
}

.ttl10 a {
    text-decoration: none;
}

.ttl11 {
    margin-bottom: 20px;
    color: #111;
    font-size: 30px;
    font-size: 3rem;
    font-weight: bold;
}

.ttl12 {
    margin-top: 25px;
    margin-bottom: 10px;
    color: #111;
    font-size: 18px;
    font-size: 1.8rem;
    font-weight: bold;
}

.ttl13 {
    margin-bottom: 20px;
    color: #111;
    font-size: 20px;
    font-size: 2rem;
    font-weight: bold;
}

/* スマホ向けスタイル */
@media screen and (max-width: 767px) {
    .ttl01 {
        margin: 0 -5px 17px 0;
        color: #00ACBA;
        font-size: 1.5em;
        font-weight: normal;
        line-height: 1.4;
    }

    .page-template-all .ttl01,
    .category .ttl01 {
        display: none;
    }

    .ttl02 {
        margin-top: 20px;
        margin-bottom: 15px;
        padding: 13px 15px;
        font-size: 1.13em;
        line-height: 1.5;
    }

    .ttl03 {
        margin-bottom: 10px;
        padding: 10px;
        border-top: 1px dotted #666;
        border-bottom: 1px dotted #666;
        font-size: 1.13em;
    }

    .ttl04 {
        margin: 0 -5px 3px 0;
        padding-left: 19px;
        font-size: 1.13em;
        font-weight: normal;
        background: url(/img/sp/common/icon/icon09.png) no-repeat left center;
        background-size: 12px 4px;
    }

    .ttl07 {
        margin-top: 20px;
        margin-bottom: 15px;
        padding: 15px 15px 11px;
        background-color: #00ACBA;
        border: none;
        color: #fff;
        font-size: 2.2rem;
    }

    .ttl07 .fa {
        color: #fff !important;
    }

    .ttl08 {
        margin: 24px 0 13px 0;
        padding-top: 10px;
        padding-bottom: 8px;
        padding-left: 15px;
        padding-right: 15px;
        background-color: #F3F3F3;
        font-size: 2.0rem;
        font-weight: bold;
    }

    .ttl08:before {
        display: none;
    }

    .ttl08.negative {
        margin-left: -15px;
        margin-right: -15px;
    }

    .ttl10 {
        margin-bottom: 10px;
        line-height: 1.3;
        font-size: 20px;
        font-size: 2rem;
    }

    .ttl10 a {
        display: block;
    }

    .ttl12 {
        margin-top: 15px;
        margin-bottom: 7px;
    }

    .ttl12 {
        margin-top: 15px;
        margin-bottom: 7px;
        font-size: 1.6rem;
    }

    .ttl13 {
        margin-bottom: 10px;
        font-size: 1.6rem;
    }

    .ttl14 {
        margin: 0;
        font-size: 1.4rem;
    }
}

.subTtl01 {
    margin-bottom: .5em;
    color: #00ACBA;
    font-size: 14px;
    font-size: 1.4rem;
    line-height: 1.3;
    font-weight: normal;
}

/*-------------------------------------------------------------------------------
  ページタイトル
-------------------------------------------------------------------------------*/
.pageTtl_standard {
    margin-left: 20px;
    margin-right: 20px;
    margin-bottom: 30px;
    color: #111;
    font-size: 32px;
    font-size: 3.2rem;
}

.pageTtl_standard:before {
    margin-bottom: 30px;
    width: 200px;
    height: 4px;
    background-color: #00ACBA;
    display: block;
    content: "";
}

.pageTtl_standard-negative {
    margin-left: -20px;
    margin-right: -20px;
}

/* スマホ向けスタイル */
@media screen and (max-width: 767px) {
    .pageTtl_standard {
        margin-right: 0;
        margin-left: 0;
        margin-bottom: 15px;
        padding-top: 15px;
        padding-bottom: 11px;
        padding-left: 15px;
        padding-right: 15px;
        background-color: #00ACBA;
        color: #fff;
        font-size: 22px;
        font-size: 2.2rem;
    }

    .pageTtl_standard:before {
        display: none;
    }

    .pageTtl_standard:first-of-type {
        margin-top: 0;
    }

    .pageTtl_standard-negative {
        margin-left: -15px;
        margin-right: -15px;
    }
}

/*-------------------------------------------------------------------------------
  ページヘッダー
-------------------------------------------------------------------------------*/
.head01 {
    margin-bottom: 25px;
}

.head01 .ttl {
    font-style: 32px;
    font-size: 3.2rem;
    font-weight: bold;
}

.head01 .sub {
    font-style: 16px;
    font-size: 1.6rem;
    font-weight: bold;
}

/* スマホ向けスタイル */
@media screen and (max-width: 767px) {
    .head01 {
        padding-left: 15px;
        padding-right: 15px;
    }
}

.head-image {
    margin-bottom: 20px;
    width: 100%;
    height: 210px;
    background-repeat: no-repeat;
    background-size: cover;
    display: table;
    color: #fff;
}

.head-image-service {
    background-image: url(/img/common/head-image/service.jpg);
}

.head-image-column {
    background-image: url(/img/common/head-image/column.jpg);
}

.head-image-event {
    background-image: url(/img/common/head-image/event.jpg);
}

.head-image-library {
    background-image: url(/img/common/head-image/library.jpg);
}

.head-image-work {
    background-image: url(/img/common/head-image/work.jpg);
}

.head-image-words {
    background-image: url(/img/common/head-image/words.jpg);
}

.head-image_inner {
    padding-top: 35px;
    padding-left: 30px;
    padding-right: 30px;
    display: table-cell;
    position: relative;
}

.head-image_tag {
    position: absolute;
    top: 0;
    left: 0;
}

.head-image_ttl {
    margin-bottom: 10px;
    font-size: 32px;
    font-size: 3.2rem;
}

.head-image_lead {
    font-size: 16px;
    font-size: 1.6rem;
}

.head-image-library .head-image_inner {
    padding-top: 0;
    vertical-align: middle;
    text-align: center;
}

@media screen and (max-width: 767px) {
    .head-image {
        margin-bottom: 20px;
        height: auto;
    }

    .head-image_inner {
        padding-top: 30px;
        padding-bottom: 30px;
        vertical-align: middle;
    }

    .head-image_tag {
        width: 120px;
    }

    .head-image_tag img {
        max-width: 100%;
        height: auto;
    }

    .head-image_ttl {
        font-size: 2.4rem;
    }

    .head-image_lead {
        font-size: 1.4rem;
    }

    .head-image-library .head-image_inner {
        padding-top: 30px;
    }

}

/*-------------------------------------------------------------------------------
  ボタン
-------------------------------------------------------------------------------*/
.btn {
    box-sizing: border-box;
    padding-top: 14px;
    padding-bottom: 11px;
    padding-left: 1em;
    padding-right: 1em;
    background-color: #ED9C38;
    border-radius: 4px;
    display: inline-block;
    border: none;
    position: relative;
    color: #FFF !important;
    font-size: 17px;
    font-size: 1.7rem;
    font-weight: bold;
    text-align: center;
    text-decoration: none !important;
    line-height: 1;
    white-space: nowrap;
    cursor: pointer;
}

.btn:hover {
    opacity: 0.4;
    filter: alpha(opacity=40);
}

.btn-sm {
    padding-top: 8px;
    padding-bottom: 7px;
    font-size: 13px;
    font-size: 1.3rem;
}

.btn-lg {
    padding-top: 18px;
    padding-bottom: 16px;
    font-size: 20px;
    font-size: 2rem;
}

.btn-flex {
    display: block;
}

.btn-return {
    padding-right: 20px;
    padding-left: 20px;
    background: #bbb;
    border: 3px solid #ddd;
    color: #111 !important;
    font-weight: normal;
}

.btn-red {
    background-color: #E16868 !important;
}

.btn-gray {
    background-color: #BBB !important;
}

.btn-green {
    background-color: #00ACBA !important;
}

.btn-simple {
    padding: 6px 15px 5px 15px;
    background: #fff;
    border: 1px solid #ddd;
    border-radius: 2px;
    color: #004699 !important;
    font-size: 1.2rem !important;
    font-weight: normal;
}

/* スマホ向けスタイル */
@media screen and (max-width: 767px) {
    .btn {
        padding-top: 10px;
        padding-bottom: 9px;
        font-size: 1.6rem;
    }

    .btn-lg {
        padding-top: 15px;
        padding-bottom: 12px;
        font-size: 1.6rem;
    }
}

/*-------------------------------------------------------------------------------
  ソーシャル系ボタン
-------------------------------------------------------------------------------*/
.btn-facebook {
    width: 220px;
    background-color: #3B579D;
}

.btn-twitter {
    width: 220px;
    background-color: #00ACED;
}

/*-------------------------------------------------------------------------------
  アイコン
-------------------------------------------------------------------------------*/
.icon {
    position: relative;
}

.icon:before,
.icon:after {
    background-repeat: no-repeat;
    position: absolute;
    content: "";
}

.icon:before {
    left: 0;
}

.icon:after {
    right: 0;
}

/* 矢印 */
.icon-arrow-right-after {
    padding-right: 22px;
}

.icon-arrow-right-after:after,
.icon-arrow-right-before:before {
    margin-top: -8px;
    width: 14px;
    height: 14px;
    top: 50%;
    right: 0;
    background-image: url(/img/common/icon/arrow-right.png);
}

.icon-arrow-right-before {
    padding-left: 22px;
}

.icon-arrow-right-before:before {
    left: 0;
    right: auto;
}

.icon-arrow-right-after-lg {
    padding-right: 28px;
}

.icon-arrow-right-after-lg:after {
    margin-top: -11px;
    width: 20px;
    height: 21px;
    top: 50%;
    right: 0;
    background-image: url(/img/common/icon/arrow-right-lg.png);
}

.icon-arrow-right-before-green-sm {
    padding-left: 10px;
}

.icon-arrow-right-before-green-sm:before {
    margin-top: -5px;
    width: 9px;
    height: 9px;
    top: 50%;
    left: 0;
    background-image: url(/img/common/icon/arrow-right-green.png);
}

.icon-return {
    padding-left: 22px;
}

.icon-return:before {
    margin-top: -8px;
    width: 14px;
    height: 14px;
    background-image: url(/img/common/icon/arrow-left-md-black.png);
    top: 50%;
    left: 0;
}

.icon-facebook {
    padding-left: 18px;
}

.icon-facebook:before {
    margin-top: -10px;
    width: 11px;
    height: 20px;
    background-image: url(/img/common/icon/facebook.png);
    top: 50%;
    left: 0;
}

.icon-twitter {
    padding-left: 30px;
}

.icon-twitter:before {
    margin-top: -10px;
    width: 25px;
    height: 20px;
    background-image: url(/img/common/icon/twitter.png);
    top: 50%;
    left: 0;
}

/*
.icon-arrow-r-r { padding-right: 22px; }
.icon-arrow-r-l,
.icon-arrow-l-l-black { padding-left: 22px; }
.icon-arrow-r-r:after,
.icon-arrow-r-l:before,
.icon-arrow-l-l-black:before {
  margin-top: -8px;
  width: 14px;
  height: 14px;
  top: 50%;
}

.icon-arrow-r-r:after,
.icon-arrow-r-l:before { background-image: url(/img/common/icon/arrow-r-m.png); }
.icon-arrow-l-l-black:before { background-image: url(/img/common/icon/arrow-l-m-black.png); }

.icon-arrow-r-r.icon-s { padding-right: 18px; }
.icon-arrow-r-l.icon-s { padding-left: 18px; }
.icon-arrow-r-l.icon-s:before,
.icon-arrow-r-r.icon-s:after {
  margin-top: -7px;
  width: 12px;
  height: 12px;
  background-image: url(/img/common/icon/arrow-r-s.png);
  top: 50%;
}

.icon-arrow-r-r.icon-l { padding-right: 30px; }
.icon-arrow-r-l.icon-l { padding-left: 30px; }
.icon-arrow-r-l.icon-l:before,
.icon-arrow-r-r.icon-l:after {
  margin-top: -11px;
  width: 20px;
  height: 21px;
  background-image: url(/img/common/icon/arrow-r-l.png);
  top: 50%;
}*/

/* サービス */
.icon-service-before {
    padding-left: 30px;
}

.icon-service-before:before {
    margin-top: -10px;
    width: 19px;
    height: 19px;
    background-image: url(/img/common/icon/service.png);
    top: 50%;
    left: 0;
}

.icon-column-before {
    padding-left: 30px;
}

.icon-column-before:before {
    margin-top: -11px;
    width: 20px;
    height: 20px;
    background-image: url(/img/common/icon/column.png);
    top: 50%;
    left: 0;
}

.icon-member-before-lg {
    padding-left: 30px;
}

.icon-member-before-lg:before {
    margin-top: -11px;
    width: 20px;
    height: 20px;
    background-image: url(/img/common/icon/member-lg.png);
    top: 50%;
}

.icon-infoChange-before-lg {
    padding-left: 30px;
}

.icon-infoChange-before-lg:before {
    margin-top: -11px;
    width: 20px;
    height: 20px;
    background-image: url(/img/common/icon/info_change-lg.png);
    top: 50%;
}

.icon-mailChange-before-lg {
    padding-left: 30px;
}

.icon-mailChange-before-lg:before {
    margin-top: -11px;
    width: 20px;
    height: 20px;
    background-image: url(/img/common/icon/mail_change-lg.png);
    top: 50%;
}

.icon-passChange-before-lg {
    padding-left: 30px;
}

.icon-passChange-before-lg:before {
    margin-top: -11px;
    width: 20px;
    height: 20px;
    background-image: url(/img/common/icon/pass_change-lg.png);
    top: 50%;
}

.icon-document-before-lg {
    padding-left: 30px;
}

.icon-document-before-lg:before {
    margin-top: -11px;
    width: 20px;
    height: 20px;
    background-image: url(/img/common/icon/document-lg.png);
    top: 50%;
}

/* スマホ向けスタイル */
@media screen and (max-width: 767px) {
    .icon-arrow-right-after {
        padding-right: 12px;
    }

    .icon-arrow-right-after:after,
    .icon-arrow-right-before:before {
        margin-top: -7px;
        width: 8px;
        height: 12px;
        top: 50%;
        right: 0;
        background-image: url(/img/common/icon/arrow-right-x2.png);
        background-size: 100% auto;
    }

    .icon-arrow-right-after-lg {
        padding-right: 12px;
    }

    .icon-arrow-right-after-lg:after,
    .icon-arrow-right-before-lg:before {
        margin-top: -7px;
        width: 8px;
        height: 12px;
        top: 50%;
        right: 0;
        background-image: url(/img/common/icon/arrow-right-x2.png);
        background-size: 100% auto;
    }

    .icon-member-before-lg {
        padding-left: 22px;
    }

    .icon-member-before-lg:before {
        margin-top: -10px;
        width: 16px;
        height: 16px;
        background-size: 100% auto;
    }

    .icon-infoChange-before-lg {
        padding-left: 22px;
    }

    .icon-infoChange-before-lg:before {
        margin-top: -10px;
        width: 16px;
        height: 16px;
        background-size: 100% auto;
    }

    .icon-mailChange-before-lg {
        padding-left: 22px;
    }

    .icon-mailChange-before-lg:before {
        margin-top: -10px;
        width: 16px;
        height: 16px;
        background-size: 100% auto;
    }

    .icon-passChange-before-lg {
        padding-left: 22px;
    }

    .icon-passChange-before-lg:before {
        margin-top: -10px;
        width: 16px;
        height: 16px;
        background-size: 100% auto;
    }
}

/* 日付 */
.date-md,
.date-sm,
.date-lg {
    color: #666;
}

.date-md:before,
.date-sm:before,
.date-lg:before {
    margin-right: .2em;
    width: 11px;
    height: 11px;
    background-repeat: no-repeat;
    display: inline-block;
    content: "";
}

.date-lg:before {
    width: 20px;
    height: 20px;
}

.date-md {
    font-size: 15px;
    font-size: 1.5rem;
}

.date-sm {
    font-size: 13px;
    font-size: 1.3rem;
}

.date-lg {
    font-size: 24px;
    font-size: 2.4rem;
}

.date-md:before {
    background-image: url(/img/common/icon/clock.png);
}

.date-sm:before {
    background-image: url(/img/common/icon/clock.png);
}

.date-lg:before {
    background-image: url(/img/common/icon/clock-lg.png);
}

/* 更新 */
.update-md,
.update-sm,
.update-lg {
    color: #666;
}

.update-md:before,
.update-sm:before,
.update-lg:before {
    margin-right: .2em;
    width: 11px;
    height: 11px;
    background-repeat: no-repeat;
    display: inline-block;
    content: "";
}

.update-lg:before {
    width: 20px;
    height: 20px;
}

.update-md {
    font-size: 15px;
    font-size: 1.5rem;
}

.update-sm {
    font-size: 13px;
    font-size: 1.3rem;
}

.update-lg {
    font-size: 24px;
    font-size: 2.4rem;
}

.update-md:before {
    background-image: url(/img/common/icon/update.png);
}

.update-sm:before {
    background-image: url(/img/common/icon/update.png);
}

.update-lg:before {
    background-image: url(/img/common/icon/update-lg.png);
}

/* スマホ向けスタイル */
@media screen and (max-width: 767px) {
    .date-lg {
        font-size: 12px;
        font-size: 1.2rem;
    }

    .date-lg:before {
        width: 10px;
        height: 10px;
        background-size: 100% auto;
    }

    .update-lg {
        font-size: 12px;
        font-size: 1.2rem;
    }

    .update-lg:before {
        width: 10px;
        height: 10px;
        background-size: 100% auto;
    }
}

/* カテゴリラベル */
.list-categoriesLabel {
    font-size: 0;
}

.list-categoriesLabel > li {
    margin-left: 5px;
    padding: 8px 20px;
    background: #E492AE;
    display: inline-block;
    color: #FFF;
    font-size: 14px;
    font-size: 1.4rem;
    line-height: 1;
}

.list-categoriesLabel > :first-child {
    margin-left: 0;
}

/* スマホ向けスタイル */
@media screen and (max-width: 767px) {
    .list-categoriesLabel > li {
        margin-left: 3px;
        padding: 6px 10px 4px;
        background: #E492AE;
        color: #FFF;
        font-size: 1rem;
        line-height: 1;
    }
}

/* タグラベル */
.list-tagsLabel {
    font-size: 0;
}

.list-tagsLabel:before {
    margin-right: .4em;
    display: inline-block;
    font-family: FontAwesome;
    font-size: 16px;
    font-size: 1.6rem;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    color: #00ACB8;
    content: "\f02c";
}

.list-tagsLabel > li {
    margin-left: 5px;
    display: inline-block;
    font-size: 14px;
    font-size: 1.4rem;
    line-height: 1;
}

.list-tagsLabel > :first-child {
    margin-left: 0;
}

.list-tagsLabel > li > a,
.list-tagsLabel > li > .js-link {
    padding: .5em .5em .4em;
    background: #DEDEDE;
    display: inline-block;
    color: #666;
    text-decoration: none;
}

.list-tagsLabel > li > a:hover,
.list-tagsLabel > li > .js-link:hover {
    background-color: #999;
    color: #fff;
}

/* スマホ向けスタイル */
@media screen and (max-width: 767px) {
    .list-tagsLabel > li {
        margin-left: 3px;
        font-size: 1.2rem;
    }
}

/* テーブル */
.table-standard {
    width: 100%;
    border-top: 1px solid #DDD;
    border-collapse: collapse;
}

.table-standard th,
.table-standard td {
    padding: 15px 15px 12px;
    border-bottom: 1px solid #DDD;
    font-weight: normal;
    line-height: 1.5;
    vertical-align: top;
}

.table-standard th {
    width: 22%;
    background: #F3F3F3;
}

.table-lattice th,
.table-lattice td {
    border: 1px solid #DDD;
}

/* スマホ */
@media screen and (max-width: 767px) {
    .table-standard th,
    .table-standard td {
        padding: 7px 7px 5px;
    }
}

.loglyBox {
    padding-top: 30px;
    background-color: #F3F3F3;
}

.loglyBox .more_ttl,
.loglyBox .recommended_ttl {
    margin-top: 30px !important;
    margin-bottom: 0;
}

.loglyBox .logly {
    margin-top: 20px;
}

.loglyBox .logly:empty {
    display: none;
}

/* スマホ */
@media screen and (max-width: 767px) {
    .loglyBox .more_ttl,
    .loglyBox .recommended_ttl {
        margin-left: 15px;
        margin-right: 15px;
    }

    .loglyBox {
        background-color: #fff;
    }
}

/*-------------------------------------------------------------------------------
  サムネイル付きカラム
-------------------------------------------------------------------------------*/
.thumbnailColumn {
    padding: 20px;
    overflow: hidden;
    font-size: 16px;
    border-top: 1px dotted #ccc;
    border-bottom: 1px dotted #ccc;
}

.thumbnailColumn + .thumbnailColumn {
    border-top: none;
}

.thumbnailColumn-left .thumbnailColumn_thumbnail {
    float: left;
}

.thumbnailColumn_ttl {
    margin-bottom: 10px;
    font-size: 26px;
    font-size: 2.6rem;
    color: #004699;
    font-weight: bold;
}

.thumbnailColumn_ttl > a {
    text-decoration: none;
}

.thumbnailColumn_ttl > a:hover {
    text-decoration: underline;
}

.thumbnailColumn_header {
    margin-bottom: 10px;
}

.thumbnailColumn_body {
    margin-left: 220px;
    font-size: 16px;
    font-size: 1.6rem;
    line-height: 1.75;
}

.thumbnailColumn-xsm .thumbnailColumn_body {
    margin-left: 126px;
}

.thumbnailColumn-sm .thumbnailColumn_body {
    margin-left: 170px;
}

.thumbnailColumn-lg .thumbnailColumn_body {
    margin-left: 290px;
}

.thumbnailColumn.border-gray {
    border: 1px solid #ddd;
}

.thumbnailColumn_linkArea {
    margin: -20px;
    padding: 20px;
    overflow: hidden;
    display: block;
    text-decoration: none;
}

.thumbnailColumn_linkArea:link,
.thumbnailColumn_linkArea:visited {
    text-decoration: none;
}

.thumbnailColumn_linkArea:hover {
    background-color: #D9F3F5;
}

.thumbnailColumn_linkArea p {
    color: #111;
}

/* スマホ */
@media screen and (max-width: 767px) {
    .thumbnailColumn {
        padding: 15px;
    }

    .thumbnailColumn-left .thumbnailColumn_body {
        margin-left: 90px;
        line-height: 1.5;
    }

    .thumbnailColumn-left.thumbnailColumn-md .thumbnailColumn_body {
        margin-left: 115px;
    }

    .thumbnailColumn_linkArea:hover {
        background-color: transparent;
    }

    .thumbnailColumn_ttl {
        margin-bottom: 5px;
        font-size: 20px;
        font-size: 2rem;
    }

    .thumbnailColumn-left .thumbnailColumn_body.sp-drop {
        margin-left: 0;
        float: none;
    }

    .thumbnailColumn-left .thumbnailColumn_body.sp-drop:before {
        display: block;
        clear: left;
        content: "";
    }
}

/*-------------------------------------------------------------------------------
  カラムドロップ
-------------------------------------------------------------------------------*/
.columnsDrop {
    padding-bottom: 1px;
    overflow: hidden;
}

.columnsDrop-panel {
    margin-bottom: -1px;
    width: 240px;
    float: left;
}

.columnsDrop-panel_linkArea {
    padding: 20px;
    border: 1px dotted #CCC;
    border-left: none;
    background-color: #fff;
    display: block;
    text-decoration: none;
}

.columnsDrop-panel_linkArea:link,
.columnsDrop-panel_linkArea:visited {
    text-decoration: none;
}

.columnsDrop-panel_linkArea:hover {
    background-color: #D9F3F5;
}

.columnsDrop .pc-col3 .columnsDrop-panel_linkArea {
    border-right: none;
}

/* スマホ */
@media screen and (max-width: 767px) {
    .columnsDrop {
        margin-left: auto;
        margin-right: auto;
        width: 640px;
    }

    .columnsDrop-panel {
        width: 160px;
    }

    .columnsDrop .pc-col3 > .columnsDrop-panel_linkArea {
        border-right: 1px dotted #CCC;
    }

    .columnsDrop > :nth-child(4n+1) > .columnsDrop-panel_linkArea {
        border-left: 1px dotted #CCC;
    }
}

@media screen and (max-width: 640px) {
    .columnsDrop {
        width: 480px;
    }

    .columnsDrop > :nth-child(4n+1) > .columnsDrop-panel_linkArea {
        border-left: none;
    }

    .columnsDrop > :nth-child(3n+1) > .columnsDrop-panel_linkArea {
        border-left: 1px dotted #ccc;
    }
}

@media screen and (max-width: 480px) {
    .columnsDrop {
        width: 320px;
    }

    .columnsDrop > :nth-child(odd) > .columnsDrop-panel_linkArea {
        border-left: 1px dotted #ccc;
    }

    .columnsDrop > :nth-child(even) > .columnsDrop-panel_linkArea {
        border-left: none;
    }
}

@media screen and (max-width: 320px) {
    .columnsDrop > :nth-child(odd) > .columnsDrop-panel_linkArea {
        border-left: none;
    }
}

/*-------------------------------------------------------------------------------
  pagination
-------------------------------------------------------------------------------*/
.pagination {
    font-size: 0;
}

.pagination :first-child {
    margin-left: 0;
}

.pagination li {
    margin-left: 5px;
    text-align: center;
    display: inline-block;
    font-size: 16px;
    font-size: 1.6rem;
}

.pagination li a,
.pagination li span {
    padding: 2px 9px 0;
    border: 1px solid #DDD;
    display: inline-block;
    text-decoration: none;
    vertical-align: middle;
    line-height: 26px;
}

.pagination li a:hover {
    border: 1px solid #00ACBA;
    background: #00ACBA;
    color: #FFF;
}

.pagination li span {
    border: 1px solid #00ACBA;
    background: #00ACBA;
    color: #FFF;
}

.pagination .prev a:before {
    content: "≪前へ";
}

.pagination .next a:after {
    content: "次へ≫";
}

/* スマホ */
@media screen and (max-width: 767px) {
    .pagination {
        font-size: 0;
        float: none;
    }

    .pagination li {
        margin-bottom: 5px;
    }

    .pagination .prev a:before,
    .pagination .next a:after {
        width: 8px;
        height: 12px;
        background-image: url(/img/common/icon/arrow-right-green-x2.png);
        background-size: 100%;
        display: inline-block;
        content: "";
    }

    .pagination .prev a:before {
        -webkit-transform: rotate(180deg);
        -moz-transform: rotate(180deg);
        transform: rotate(180deg);
    }

    .pagination .prev a:hover:before,
    .pagination .next a:hover:after {
        background-image: url(/img/common/icon/arrow-right-x2.png);
    }
}

/*-------------------------------------------------------------------------------
  pagination 件数表示とのセット
-------------------------------------------------------------------------------*/
.paginationSet {
    overflow: hidden;
    line-height: 1;
}

.paginationSet_count {
    padding-top: 5px;
    float: left;
    font-size: 16px;
    font-size: 1.6rem;
    font-weight: bold;
}

.paginationSet_count_all {
    color: #00ACB8;
    font-size: 20px;
    font-size: 2rem;
}

.paginationSet .pagination {
    float: right;
}

/* スマホ */
@media screen and (max-width: 767px) {
    .paginationSet {
        text-align: center;
    }

    .paginationSet_count {
        margin-bottom: 8px;
        float: none;
    }

    .paginationSet .pagination {
        float: none;
    }
}

/* お知らせ一覧 */
.list-news {
    margin-top: 20px;
    margin-bottom: 20px;
    border-top: 1px dotted #CCC;
    font-size: 16px;
    font-size: 1.6rem;
    line-height: 1.75;
}

.list-news dt,
.list-news dd {
    padding: 18px 0;
}

.list-news dt {
    width: 155px;
    float: left;
    clear: left;
}

.list-news dt .time,
.list-news dt .new {
    vertical-align: middle;
}

.list-news dt .new {
    margin-left: 0.5em;
    margin-left: 8px;
    padding: 3px 10px;
    background: #F82C2C;
    color: #FFF;
    font-size: 11px;
    font-size: 1.1rem;
    text-align: center;
    line-height: 1;
}

.list-news dd {
    padding-left: 155px;
    border-bottom: 1px dotted #CCC;
}

.list-news dd a {
    color: #004699;
    text-decoration: none;
}

/* スマホ向けスタイル */
@media screen and (max-width: 767px) {
    .list-news {
        margin-top: 15px;
        margin-bottom: 15px;
        line-height: 1.5;
    }

    .list-news dt {
        padding: 15px 15px 0;
        width: auto;
        float: none;
    }

    .list-news dd {
        padding: 0 15px 15px;
    }
}

/* タブ */
.tab-top {
    margin-bottom: 40px;
    border-bottom: 4px solid #00ACBA;
}

.tab-bottom {
    margin-top: 40px;
    border-top: 4px solid #00ACBA;
}

.tab {
    overflow: hidden;
}

.tab li {
    float: left;
}

.tab li a {
    padding: 4px 20px 0 20px;
    display: block;
    position: relative;
    text-decoration: none;
    color: #111;
    font-size: 14px;
    font-size: 1.4rem;
    line-height: 46px;
}

.tab li.current a,
.tab li a:hover {
    background: #00ACBA;
    color: #FFF;
}

.tab li a:before {
    margin-top: -8px;
    width: 20px;
    height: 20px;
    position: absolute;
    top: 50%;
    left: 20px;
    content: "";
}

/* スマホ向けスタイル */
@media screen and (max-width: 767px) {
    .tab-top {
        margin-bottom: 20px;
        border-bottom-width: 2px;
    }

    .tab-bottom {
        margin-top: 20px;
        border-top-width: 2px;
    }

    .tab {
        padding-left: 15px;
    }

    .tab li a {
        padding: 0 10px;
        padding-top: 2px;
        font-size: 10px;
        font-size: 1rem;
        line-height: 38px;
    }

    .tab li a:before {
        display: none;
    }
}

/* ＠人事プライムコラム一覧タイトル部 */
.column-title .sub-title {
    font-size: 16px;
    font-weight: bold;
    line-height: 1;
}

.column-title .sub-title .company-name {
    color: #004699;
}

/* 記事詳細ソーシャルボタン */
.socialBtns {
    margin-top: 20px;
    margin-bottom: 20px;
    padding-top: 30px;
    padding-bottom: 30px;
    border-top: 1px dotted #CCC;
    border-bottom: 1px dotted #CCC;
    text-align: center;
}

.socialBtns-last {
    margin-bottom: -20px;
    border-bottom: none;
}

.socialBtns_share {
    font-size: 0;
}

.socialBtns_share li {
    margin-left: 10px;
    margin-right: 10px;
    display: inline-block;
}

.socialBtns_share li a {
    padding: 20px 0;
    display: block;
    border-radius: 5px;
    color: #FFF;
    font-weight: bold;
    text-decoration: none;
    line-height: 1;
    font-size: 2.0rem;
    font-size: 20px;
}

.socialBtns_share li a:hover {
    opacity: 0.6;
}

.socialBtns_share + .socialBtns_like {
    margin-top: 20px;
}

.socialBtns_like {
    font-size: 0;
}

.socialBtns_like li {
    margin-left: 5px;
    margin-right: 5px;
    display: inline-block;
}

/* スマホ */
@media screen and (max-width: 767px) {
    .socialBtns {
        margin-top: 15px;
        margin-bottom: 15px;
        padding-top: 15px;
        padding-bottom: 15px;
    }

    .socialBtns-last {
        margin-bottom: 0;
    }

    .socialBtns_share > :last-child {
        margin-top: 10px;
    }
}

/*------------------------------------------------------------
  WYSIWYG
------------------------------------------------------------*/
.wysiwygBox img {
    max-width: 100%;
    height: auto !important;
}

.wysiwygBox .clear-float {
    clear: both;
}

.wysiwygBox .left {
    margin-right: 10px !important;
    margin-bottom: 10px !important;
    float: left;
}

.wysiwygBox .right {
    margin-left;: 10 px !important;
    margin-bottom: 10px !important;
    float: right;
}

@media screen and (max-width: 767px) {
    .wysiwygBox img {
        margin-left: auto !important;
        margin-right: auto !important;
        display: block;
        float: none !important;
    }

    .wysiwygBox .left {
        margin-left: auto !important;
        margin-right: auto !important;
        margin-bottom: 5px !important;
        float: none;
    }

    .wysiwygBox .right {
        margin-left: auto !important;
        margin-right: auto !important;
        margin-bottom: 5px !important;
        float: none;
    }
}

/*------------------------------------------------------------
  記事のピックアップ表示
------------------------------------------------------------*/
.pickupArticle {
    margin-bottom: 30px;
    background-color: #fff;
    overflow: hidden;
    position: relative;
}

.pickupArticle_linkArea {
    overflow: hidden;
    display: block;
    color: #111;
    text-decoration: none;
}

.pickupArticle_linkArea:link,
.pickupArticle_linkArea:visited {
    color: #111;
}

.pickupArticle_linkArea:hover .pickupArticle_image {
    opacity: 0.7;
}

.pickupArticle_linkArea:hover .pickupArticle_body {
    background-image: url(/img/common/bg02.png);
}

.pickupArticle_body {
    box-sizing: border-box;
    padding: 13px 15px 10px;
    width: 100%;
    position: absolute;
    left: 0;
    bottom: 0;
    background: url(/img/common/bg01.png);
}

.pickupArticle_meta {
    margin-bottom: 10px;
}

.pickupArticle_body_label {
    margin: 0;
    margin-right: 8px;
    float: left;
}

.pickupArticle_body_subTtl02 {
    font-size: 16px;
    font-size: 1.6rem;
    color: #00ACBA;
    font-weight: bold;
    line-height: 1.2;
}

.pickupArticle_body_ttl {
    font-size: 26px;
    font-size: 2.6rem;
    line-height: 1.3;
}

.pickupArticle_body_subTtl01 {
    font-size: 14px;
    font-size: 1.4rem;
    line-height: 1.3;
    color: #999;
}

.pickupArticle_body_date {
    margin-top: 5px;
}

@media screen and (max-width: 767px) {
    .pickupArticle {
        margin-bottom: 20px;
    }

    .pickupArticle_image {
        width: 100%;
        height: auto;
    }

    .pickupArticle_meta {
        margin-bottom: 5px;
    }

    .pickupArticle_body_date {
        display: none;
    }

    .pickupArticle_body_subTtl02 {
        overflow: hidden;
        font-size: 1.4rem;
    }

    .pickupArticle_body_ttl {
        margin-top: 5px;
        font-size: 16px;
        font-size: 1.6rem;
        font-weight: bold;
    }
}

/*
 * ここからのスタイルは汎用スタイルではなく特定のページ・デザインに使われるスタイルです
 */
/*-------------------------------------------------------------------------------
   TOP
-------------------------------------------------------------------------------*/
.top_pickup {
    margin-bottom: 30px;
    border-top: 3px solid #00ACBA;
    overflow: hidden;
}

.top_pickup_ttl {
    padding-top: 2px;
    padding-left: 20px;
    border-bottom: 1px dotted #CCC;
    line-height: 37px;
    font-size: 16px;
    font-size: 1.6rem;
    font-weight: bold;
}

.top_pickup_news {
    width: 494px;
    float: left;
    border-right: 1px solid #ddd;
}

.top_pickup_popular {
    width: 321px;
    height: 435px;
    float: left;
    border-right: 1px solid #ddd;
}

.top_pickup_headline {
    width: 233px;
    height: 435px;
    float: left;
}

.online_article {
    border: none;
}

.online_article + .online_article {
    border-top: 1px dotted #ccc;
}

.online_article_linkArea {
    box-sizing: border-box;
    padding: 20px 10px 20px 20px;
    height: 197px;
    overflow: hidden;
    display: block;
}

.online_article_linkArea:link,
.online_article_linkArea:visited {
    text-decoration: none;
}

.online_article_linkArea:hover {
    background-color: #D9F3F5;
}

.online_article_subTtl {
    margin-bottom: 8px;
    color: #00ACBA;
    font-size: 14px;
    font-size: 1.4rem;
    line-height: 1.3;
    font-weight: bold;
}

.online_article_ttl {
    margin-bottom: 10px;
    color: #111;
    font-size: 22px;
    font-size: 2.2rem;
    font-weight: bold;
    line-height: 1.3;
}

.popular_articles {
    height: 395px;
    overflow-y: auto;
}

.popular_article {
    box-sizing: border-box;
    padding: 20px;
    overflow: hidden;
    display: block;
}

.popular_article:link,
.popular_article:visited {
    text-decoration: none;
}

.popular_article:hover {
    background-color: #D9F3F5;
}

.popular_article + .popular_article {
    border-top: 1px dotted #ccc;
}

.popular_article_thumbnail {
    width: 100px;
    float: left;
}

.popular_article_body {
    margin-left: 110px;
}

.popular_article_category {
    margin-bottom: 2px;
    overflow: hidden;
}

.popular_article_category .label {
    margin-bottom: 0;
}

.popular_article_subTitle {
    color: #00ACBA;
    font-size: 12px;
    line-height: 1.6;
}

.popular_article_title {
    color: #333;
}

.headline_list_item {
    width: 100%;
    display: table;
    overflow: hidden;
}

.headline_list_item + .headline_list_item {
    border-top: 1px dotted #ccc;
}

.headline_list_item_inner {
    box-sizing: border-box;
    padding: 4px 20px 0;
    height: 78px;
    display: table-cell;
    vertical-align: middle;
    line-height: 1.3;
}

.headline_list_item_inner:link,
.headline_list_item_inner:visited {
    text-decoration: none;
}

.headline_list > :last-child {
    height: 79px;
}

.headline_list_item_inner:hover {
    background-color: #D9F3F5;
}

.headline_list_item_ttl {
    color: #111;
}

.top_pickup_more {
    padding: 20px;
    border-top: 1px dotted #ccc;
    text-align: center;
    clear: both
}

.top_pickup_more .btn {
    min-width: 302px;
}

#library .ttl07 {
    position: relative;
}

#library .ttl07 .tag {
    position: absolute;
    top: -3px;
    left: 0;
}

.bn-paper {
    margin-top: 30px;
}

.bn-paper a {
    display: block;
}

.bn-paper a img {
    width: 100%;
    height: auto;
}

.bn-paper a:hover img {
    opacity: .7;
}

.top_service-banner {
    margin-bottom: 30px;
    display: inline-block;
}

.top_service-banner:hover {
    opacity: 0.7;
}

/* スマホ */
@media screen and (max-width: 767px) {
    .top_pickup {
        margin-top: 20px;
        border-top: none;
    }

    .top_pickup_ttl {
        border-top: 3px solid #00ACBA;
    }

    .top_pickup_news {
        width: auto;
        border-right: none;
        float: none;
    }

    .top_pickup_popular {
        margin-top: 20px;
        width: auto;
        height: auto;
        float: none;
        border-right: none;
    }

    .top_pickup_headline {
        margin-top: 20px;
        width: auto;
        height: auto;
        float: none;
    }

    .online_article {
        height: auto;
        border-bottom: 1px dotted #ccc;
    }

    .online_article + .online_article {
        border-top: none;
    }

    .online_article_linkArea {
        padding: 15px 30px 15px 15px;
        height: auto;
        position: relative;
    }

    .online_article_linkArea:after {
        margin-top: -6px;
        width: 8px;
        height: 12px;
        background: url(/img/common/icon/arrow-right-green-x2.png) no-repeat;
        background-size: 100% auto;
        position: absolute;
        top: 50%;
        right: 15px;
        content: "";
    }

    .online_article_linkArea:hover {
        background-color: transparent;
    }

    .online_article_ttl {
        font-size: 1.9rem;
    }

    .popular_article {
        height: auto;
        border-bottom: 1px dotted #ccc;
    }

    .popular_articles {
        height: auto;
        overflow: visible;
    }

    .popular_article + .popular_article {
        border-top: none;
    }

    .headline_list_item {
        border-bottom: 1px dotted #ccc;
        display: block;
    }

    .headline_list_item + .headline_list_item {
        border-top: none;
    }

    .headline_list_item_inner {
        padding: 15px 30px 15px 15px;
        height: auto;
        position: relative;
        display: block;
    }

    .headline_list_item_ttl {
        margin-bottom: 5px;
    }

    .headline_list_item_inner:after {
        margin-top: -6px;
        width: 8px;
        height: 12px;
        background: url(/img/common/icon/arrow-right-green-x2.png) no-repeat;
        background-size: 100% auto;
        position: absolute;
        top: 50%;
        right: 15px;
        content: "";
    }

    .headline_list_item_inner:hover {
        background-color: transparent;
    }

    .top_pickup_more {
        margin-top: 0;
        padding: 15px 0;
        border-top: none;
        text-align: center;
    }

    .top_pickup_more .btn {
        padding-top: 10px;
        padding-bottom: 9px;
        padding-left: 0;
        padding-right: 0;
        min-width: 290px;
        font-size: 1.6rem;
    }

    #library .ttl07 .tag {
        top: 0;
    }

    .top-bn-box a {
        margin: 0 auto;
        width: 290px;
        display: block;
    }

    .top-bn-box a img {
        width: 100%;
    }

    #sideBar.sideTop .bnPaper {
        display: block;
    }

    .top_service-banner {
        margin: 0 20px 30px;
    }

    .top_service-banner img {
        max-width: 100%;
        height: auto;
    }
}

/*-------------------------------------------------------------------------------
  コラムリスト
-------------------------------------------------------------------------------*/
.columnList {
    margin-top: 20px;
    margin-bottom: 20px;
}

.columnList_header_meta {
    margin-bottom: 5px;
    width: 100%;
    overflow: hidden;
}

.columnList_header_meta_subTtl {
    margin-bottom: 0;
    padding-top: 7px;
    float: left;
    color: #00ACBA !important;
    font-size: 16px;
    font-size: 1.6rem;
    font-weight: bold;
    vertical-align: middle;
}

.columnList_header_meta_categories {
    margin-bottom: 5px;
    float: right;
    text-align: right;
}

.columnList_header_ttl {
    color: #111;
}

/* スマホ */
@media screen and (max-width: 767px) {
    .columnList {
        margin-top: 10px;
        margin-bottom: 10px;
    }

    .columnList_header_meta {
        margin-bottom: 5px;
    }

    .columnList_header_meta_date {
        padding-top: 0;
    }

    .columnList_header_meta_subTtl {
        padding-top: 0;
        font-size: 1.4rem;
    }
}

/*-------------------------------------------------------------------------------
  サービスリスト
-------------------------------------------------------------------------------*/
.serviceList {
    margin-top: 20px;
    margin-bottom: 20px;
}

.service_article_ttl {
    margin-bottom: 5px;
}

.service_article_ttl-01 {
    margin-top: 25px;
    margin-bottom: 8px;
    color: #111;
    font-size: 18px;
    font-size: 1.8rem;
    line-height: 1.3;
    font-weight: bold;
}

.service_article_providerName {
    color: #666;
    font-size: 15px;
    font-size: 1.5rem;
    line-height: 1.3;
}

.service_article_ctrl {
    box-sizing: border-box;
    margin-top: 25px;
    padding: 20px;
    width: 100%;
    background-color: #F3F3F3;
    overflow: hidden;
    float: left;
}

.service_article .thumbnailColumn_linkArea:hover .service_article_ctrl {
    background-color: #D9F3F5;
}

.service_article_ctrl_detail,
.service_article_ctrl_contact {
    width: 310px;
    float: left;
}

.service_article_ctrl_contact {
    text-align: center;
}

.service_article_ctrl_contact_note {
    margin-top: 10px;
}

.service_article_ctrl_studyList {
    width: 310px;
    float: right;
}

.service_article_ctrl .add-studyList {
    background-color: #bbb;
    border: 1px solid #bbb;
}

.service_article_ctrl .remove-studyList,
.service_article_ctrl .del-studyList {
    background-color: #fff;
    border: 1px solid #bbb;
    color: #666 !important;
}

.service_article_ctrl .remove-studyList:hover {
    cursor: default;
    opacity: 1;
}

.service_article_ctrl .add-studyList:before,
.service_article_ctrl .remove-studyList:before,
.service_article_ctrl .del-studyList:before {
    margin-right: .33em;
    display: inline-block;
    font: normal normal normal 14px/1 FontAwesome;
    font-size: inherit;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.service_article_ctrl .add-studyList:before {
    content: "\f0c6";
}

.service_article_ctrl .remove-studyList:before {
    content: "\f00c";
}

.service_article_ctrl .del-studyList:before {
    content: "\f057";
}

/* スマホ */
@media screen and (max-width: 767px) {
    .service_article {
        margin-top: 10px;
        margin-bottom: 10px;
    }

    .service_article_ttl-01 {
        margin-top: 15px;
        margin-bottom: 5px;
        font-size: 18px;
        font-size: 1.8rem;
    }

    .service_article .thumbnailColumn_body:empty {
        display: none;
    }

    .service_article_ctrl {
        margin-top: 15px;
        padding: 15px;
    }

    .service_article .thumbnailColumn_linkArea:hover .service_article_ctrl {
        background-color: #F3F3F3;
    }

    .service_article_ctrl_detail {
        width: 100%;
        float: none;
    }

    .service_article_ctrl_studyList {
        margin-top: 10px;
        width: 100%;
        float: none;
    }
}

.service_article-light {
    border-top: none;
}

.service_article-light_linkArea {
    padding: 20px;
    display: block;
    overflow: hidden;
}

.service_article-light_linkArea:link,
.service_article-light_linkArea:visited {
    text-decoration: none;
}

.service_article-light_linkArea:hover {
    background-color: #D9F3F5;
}

.service_article-light_ttl {
    margin-bottom: 5px;
    color: #004699;
    font-size: 26px;
    font-size: 2.6rem;
    line-height: 1.3;
    font-weight: normal;
}

.service_article-light_body {
    color: #111;
    font-size: 16px;
    font-size: 1.6rem;
    line-height: 1.45;
}

.service_article-light + .service_article_more {
    padding: 20px;
    border-top: none;
    text-align: right;
}

.service_article_more .btn {
    min-width: 256px;
}

@media screen and (max-width: 767px) {
    .service_article-light {
        margin-left: 15px;
        margin-right: 15px;
    }

    .service_article-light_linkArea {
        padding: 15px 15px 15px 0;
        position: relative;
    }

    .service_article-light_linkArea:after {
        margin-top: -6px;
        width: 8px;
        height: 12px;
        background: url(/img/common/icon/arrow-right-green-x2.png) no-repeat;
        background-size: 100% auto;
        position: absolute;
        top: 50%;
        right: 0;
        content: "";
    }

    .service_article-light_linkArea:hover {
        background-color: transparent;
    }

    .service_article-light_ttl {
        font-size: 1.9rem;
    }

    .service_article-light + .service_article_more {
        padding: 15px 0;
        text-align: center;
    }

    .service_article_more .btn {
        padding-top: 10px;
        padding-bottom: 9px;
        padding-left: 0;
        padding-right: 0;
        min-width: 290px;
        font-size: 1.6rem;
    }
}

.serviceList-horizontal_articles {
    overflow: hidden;
    border-bottom: 1px dotted #ccc;
}

.serviceList-horizontal_article {
    box-sizing: border-box;
    width: 180px;
    border-left: 1px dotted #ccc;
    float: left;
}

.serviceList-horizontal_articles > :first-child {
    border-left: none;
}

.serviceList-horizontal_linkArea {
    padding: 20px;
    overflow: hidden;
    display: block;
    position: relative;
}

.serviceList-horizontal_linkArea:link,
.serviceList-horizontal_linkArea:visited {
    text-decoration: none;
}

.serviceList-horizontal_linkArea:hover {
    background-color: #D9F3F5;
}

.serviceList-horizontal_thumbnail,
.serviceList-horizontal_thumbnail-dummy {
    box-sizing: border-box;
    margin-bottom: 20px;
    width: 140px;
    height: 140px;
    background: #fff url(/img/common/dummy/no_image-lg.png) no-repeat center;
    -webkit-background-size: cover;
    background-size: cover;
}

.serviceList-horizontal_thumbnail-dummy {
    border: 1px solid #ccc;
    -webkit-background-size: 80% auto;
    background-size: 80% auto;
}

.serviceList-horizontal_ttl {
    position: relative;
    color: #111;
    font-size: 1.6rem;
    white-space: nowrap;
    font-weight: normal;
}

.serviceList-horizontal_companyName,
.serviceList-horizontal_date {
    position: relative;
    color: #666;
    font-size: 1.3rem;
    white-space: nowrap;
}

.serviceList-horizontal_companyName {
    margin-top: 5px;
}

.serviceList-horizontal_ttl:after,
.serviceList-horizontal_companyName:after,
.serviceList-horizontal_date:after {
    margin-left: -10px;
    width: 30px;
    height: 100%;
    background: -moz-linear-gradient(left,  rgba(255,255,255,0) 0%, rgba(255,255,255,1) 80%, rgba(255,255,255,1) 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(left,  rgba(255,255,255,0) 0%, rgba(255,255,255,1) 80%, rgba(255,255,255,1) 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to right,  rgba(255,255,255,0) 0%, rgba(255,255,255,1) 80%, rgba(255,255,255,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    position: absolute;
    top: 0;
    left: 100%;
    content: "";
}

.serviceList-horizontal_linkArea:hover .serviceList-horizontal_ttl:after,
.serviceList-horizontal_linkArea:hover .serviceList-horizontal_companyName:after,
.serviceList-horizontal_linkArea:hover .serviceList-horizontal_date:after {
    background: -moz-linear-gradient(left,  rgba(217,243,245,0) 0%, rgba(217,243,245,1) 80%, rgba(217,243,245,1) 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(left,  rgba(217,243,245,0) 0%, rgba(217,243,245,1) 80%,rgba(217,243,245,1) 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to right,  rgba(217,243,245,0) 0%, rgba(217,243,245,1) 80%,rgba(217,243,245,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
}

.serviceList-horizontal_date {
    margin-top: 8px;
}

.serviceList-horizontal_articles + .service_article_more {
    padding: 20px;
    text-align: right;
}

@media screen and (max-width: 767px) {
    .serviceList-horizontal_articles {
        overflow: hidden;
    }

    .serviceList-horizontal_article {
        width: 25%;
    }

    .serviceList-horizontal_linkArea {
        padding: 15px;
    }

    .serviceList-horizontal_thumbnail,
    .serviceList-horizontal_thumbnail-dummy {
        margin-left: auto;
        margin-right: auto;
        width: 130px;
        height: 130px;
    }

    .serviceList-horizontal_articles + .service_article_more {
        padding: 15px 0;
        text-align: center;
    }
}

@media screen and (max-width: 650px) {
    .serviceList-horizontal_articles {
        border-bottom: none;
    }

    .serviceList-horizontal_article {
        width: 50%;
        border-bottom: 1px dotted #ccc;
    }

    .serviceList-horizontal_articles > :nth-child(odd){
        border-left: none;
    }
}

/*-------------------------------------------------------------------------------
  ライブラリーリスト
-------------------------------------------------------------------------------*/
.libraryList {
    margin-top: 20px;
    margin-bottom: 20px;
}

.libraryColumn_ttl {
    margin-bottom: 13px;
}

.libraryColumn_tags {
    margin-top: -3px;
    margin-bottom: 10px;
}

/* スマホ */
@media screen and (max-width: 767px) {
    .columnList {
        margin-top: 10px;
        margin-bottom: 10px;
    }
}

.libraryList-horizontal_articles {
    overflow: hidden;
    border-bottom: 1px dotted #ccc;
}

.libraryList-horizontal_article {
    box-sizing: border-box;
    width: 240px;
    float: left;
}

.libraryList-horizontal_article + .libraryList-horizontal_article {
    border-left: 1px dotted #ccc;
}

.libraryList-horizontal_linkArea {
    padding: 20px;
    overflow: hidden;
    display: block;
    position: relative;
}

.libraryList-horizontal_linkArea:link,
.libraryList-horizontal_linkArea:visited {
    text-decoration: none;
}

.libraryList-horizontal_linkArea:hover {
    background-color: #D9F3F5;
}

.libraryList-horizontal_thumbnail,
.libraryList-horizontal_thumbnail-dummy {
    box-sizing: border-box;
    margin-bottom: 20px;
    width: 200px;
    height: 110px;
    background: #fff url(/img/common/dummy/no_image-lg.png) no-repeat center;
    -webkit-background-size: cover;
    background-size: cover;
}

.libraryList-horizontal_thumbnail-dummy {
    border: 1px solid #ccc;
    -webkit-background-size: 80% auto;
    background-size: 80% auto;
}

.libraryList-horizontal_ttl {
    position: relative;
    color: #111;
    font-size: 1.6rem;
    white-space: nowrap;
    font-weight: normal;
}

.libraryList-horizontal_date {
    position: relative;
    color: #666;
    font-size: 1.3rem;
    white-space: nowrap;
}

.libraryList-horizontal_ttl:after,
.libraryList-horizontal_date:after {
    margin-left: -10px;
    width: 30px;
    height: 100%;
    background: -moz-linear-gradient(left,  rgba(255,255,255,0) 0%, rgba(255,255,255,1) 80%, rgba(255,255,255,1) 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(left,  rgba(255,255,255,0) 0%, rgba(255,255,255,1) 80%, rgba(255,255,255,1) 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to right,  rgba(255,255,255,0) 0%, rgba(255,255,255,1) 80%, rgba(255,255,255,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    position: absolute;
    top: 0;
    left: 100%;
    content: "";
}

.libraryList-horizontal_linkArea:hover .libraryList-horizontal_ttl:after,
.libraryList-horizontal_linkArea:hover .libraryList-horizontal_companyName:after,
.libraryList-horizontal_linkArea:hover .libraryList-horizontal_date:after {
    background: -moz-linear-gradient(left,  rgba(217,243,245,0) 0%, rgba(217,243,245,1) 80%, rgba(217,243,245,1) 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(left,  rgba(217,243,245,0) 0%, rgba(217,243,245,1) 80%,rgba(217,243,245,1) 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to right,  rgba(217,243,245,0) 0%, rgba(217,243,245,1) 80%,rgba(217,243,245,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
}

.libraryList-horizontal_date {
    margin-top: 8px;
}

.libraryList-horizontal_articles + .library_more {
    padding: 20px;
    text-align: right;
}

@media screen and (max-width: 767px) {
    .libraryList-horizontal_articles {
        overflow: hidden;
    }

    .libraryList-horizontal_article {
        width: auto;
        float: none;
    }

    .libraryList-horizontal_article + .libraryList-horizontal_article {
        border-top: 1px dotted #ccc;
        border-left: none;
    }

    .libraryList-horizontal_linkArea {
        padding: 15px;
    }

    .libraryList-horizontal_thumbnail,
    .libraryList-horizontal_thumbnail-dummy {
        margin-left: auto;
        margin-right: auto;
    }

    .libraryList-horizontal_ttl,
    .libraryList-horizontal_date {
        white-space: normal;
    }

    .libraryList-horizontal_ttl:after,
    .libraryList-horizontal_date:after {
        display: none;
    }

    .libraryList-horizontal_articles + .library_more {
        padding: 15px 0;
        text-align: center;
    }
}

/*-------------------------------------------------------------------------------
  サービス提供会社一覧
-------------------------------------------------------------------------------*/
.providerList {
    margin-top: 20px;
    margin-bottom: 20px;
}

.providerList_ttl-01 {
    margin-bottom: 18px;
    font-size: 20px;
    font-size: 2rem;
    line-height: 1.3;
    font-weight: bold;
}

.providerList_btns {
    margin-right: -20px;
    overflow: hidden;
}

.providerList_btns > .btn {
    margin-top: 20px;
    margin-right: 20px;
    width: 245px;
    float: left;
}

/* スマホ */
@media screen and (max-width: 767px) {
    .providerList {
        margin-top: 10px;
        margin-bottom: 10px;
    }

    .providerList_ttl-01 {
        margin-top: 0;
        font-size: 1.4rem;
    }

    .providerList_outline {
        margin-top: 15px;
    }

    .providerList_btns {
        margin-top: 10px;
        margin-right: 0;
    }

    .providerList_btns > .btn {
        margin: 0;
        width: 100%;
        float: none;
    }

    .providerList_btns > .btn + .btn {
        margin-top: 5px;
    }
}

/*-------------------------------------------------------------------------------
  イベント申し込みリスト
-------------------------------------------------------------------------------*/
.ApplyEventList {
    margin-top: 20px;
    margin-bottom: 20px;
    padding: 20px;
    border-top: 1px dotted #ccc;
    border-bottom: 1px dotted #ccc;
}

/*-------------------------------------------------------------------------------
  関連コラム
-------------------------------------------------------------------------------*/
.relatedColumnList_ttl {
    color: #004699;
    font-size: 16px;
    font-size: 1.6rem;
    line-height: 1.3;
    font-weight: bold;
}

.relatedColumnList_thumbnail {
    margin-bottom: 18px;
    width: 199px;
    min-height: 88px;
    overflow: hidden;
}

.relatedColumnList_thumbnail img {
    max-width: 100%;
    height: auto;
}

.relatedColumnList_meta {
    margin-bottom: 5px;
}

/* スマホ */
@media screen and (max-width: 767px) {
    .relatedColumnList .columnsDrop-panel > a {
        padding: 15px;
    }

    .relatedColumnList_thumbnail {
        margin-bottom: 5px;
        width: 129px;
    }

    .relatedColumnList_meta {
        margin-bottom: 0;
    }
}

/*-------------------------------------------------------------------------------
  専門家一覧
-------------------------------------------------------------------------------*/
.expertsList {
    margin-top: 20px;
    margin-bottom: 20px;
}

.expertsList .columnsDrop-panel {
    text-align: center;
}

.expertsList_thumbnail {
    margin-left: auto;
    margin-right: auto;
    width: 140px;
    height: 140px;
}

.expertsList_thumbnail img {
    width: 100%;
    height: auto;
}

.expertsList_name {
    margin-top: 10px;
    margin-bottom: 10px;
    color: #004699;
    font-size: 20px;
    font-size: 2rem;
    font-weight: bold;
    text-align: center;
}

.expertsList_companyName {
    color: #111;
    font-size: 16px;
    font-size: 1.6rem;
    font-weight: normal;
    text-align: center;
}

.expertsList_post {
    color: #111;
    font-size: 16px;
    font-size: 1.6rem;
    font-weight: normal;
    text-align: center;
}

/* スマホ */
@media screen and (max-width: 767px) {
    .expertsList {
        margin-top: 10px;
        margin-bottom: 10px;
    }

    .expertsList_thumbnail {
        width: 100px;
        height: 100px;
    }

    .expertsList_name {
        margin-top: 5px;
        margin-bottom: 5px;
        font-size: 1.8rem;
    }

    .expertsList_companyName {
        font-size: 1.4rem;
    }

    .expertsList_post {
        font-size: 1.4rem;
    }
}

.expertList-light {
    margin-top: -1px;
    margin-right: -1px;
    overflow: hidden;
}

.expertList-light_panel {
    width: 360px;
}

.expertList-light_panel.pc-col2 .expertList-light_panel_linkArea {
    border-right: none;
}

.expertList-light_panel_header {
    margin-bottom: 15px;
    overflow: hidden;
}

.expertList-light_panel_subTtl {
    margin-right: 80px;
}

.expertList-light_panel_ttl {
    margin-right: 80px;
    color: #111;
    font-size: 18px;
    font-size: 1.8rem;
    line-height: 1.3;
    font-weight: bold;
}

.expertList-light_panel_thumbnail {
    width: 86px;
    height: 86px;
    float: right;
}

.expertList-light_panel_thumbnail.thumbnail-dummy {
    background-image: url(/img/common/dummy/no_image-xxsm.png);
}

.expertList-light_panel_body {
    color: #111;
    line-height: 1.5;
}

.expertList-light_more {
    padding: 20px;
    text-align: right;
}

.expertList-light + .expertList-light_more .btn {
    min-width: 256px;
}

/* スマホ */
@media screen and (max-width: 767px) {
    .expertList-light {
        margin-top: 0;
        margin-right: 15px;
        margin-left: 15px;
    }

    .expertList-light.columnsDrop {
        width: auto !important;
    }

    .expertList-light_panel {
        margin: 0 !important;
        width: auto;
        float: none;
    }

    .expertList-light_panel_linkArea {
        padding: 15px 0;
        border: none !important;
        border-bottom: 1px dotted #ccc !important;
    }

    .expertList-light_panel_linkArea:hover {
        background-color: transparent;
    }

    .expertList-light_panel_header {
        margin-bottom: 5px;
    }

    .expertList-light_panel_ttl {
        margin-right: 70px;
        font-size: 1.9rem;
        line-height: 1.3;
    }

    .expertList-light_panel_thumbnail {
        width: 65px;
        height: 65px;
        float: right;
    }

    .expertList-light_panel_thumbnail.thumbnail-dummy {
        background-image: url(/img/common/dummy/no_image-lg.png);
        background-size: 80% auto;
    }

    .expertList-light_panel_body {
        color: #111;
        line-height: 1.5;
    }

    .expertList-light_more {
        padding: 15px 0;
        text-align: center;
    }

    .expertList-light + .expertList-light_more .btn {
        padding-top: 10px;
        padding-bottom: 9px;
        padding-left: 0;
        padding-right: 0;
        min-width: 290px;
        font-size: 1.6rem;
    }
}

/*-------------------------------------------------------------------------------
  専門家詳細
-------------------------------------------------------------------------------*/
.expertProfile_name {
    margin-bottom: 10px;
    font-size: 32px;
    font-size: 3.2rem;
    font-weight: bold;
}

.expertProfile_name_ruby {
    margin-left: .5em;
    font-size: 16px;
    font-size: 1.6rem;
}

.expertProfile_pr {
    line-height: 1.75;
}

.expertProfile_pr_ttl {
    margin-top: 40px;
    margin-bottom: 20px;
    font-size: 26px;
    font-size: 2.6rem;
    font-weight: bold;
}

/* スマホ */
@media screen and (max-width: 767px) {
    .expertProfile .expertProfile_thumbnail {
        margin-bottom: 10px;
        float: none;
    }

    .expertProfile .expertProfile_thumbnail .thumbnail-xsm,
    .expertProfile .expertProfile_thumbnail .thumbnail-lg {
        margin-left: auto;
        margin-right: auto;
    }

    .expertProfile_name {
        margin-bottom: 5px;
        font-size: 22px;
        font-size: 2.2rem;
        font-weight: bold;
        text-align: center;
    }

    .expertProfile_meta {
        text-align: center;
    }
}

/*-------------------------------------------------------------------------------
  お知らせ詳細
-------------------------------------------------------------------------------*/

/*-------------------------------------------------------------------------------
  コラム詳細
-------------------------------------------------------------------------------*/
.column_header {
    margin-left: 20px;
    margin-right: 20px;
}

.column_header:before {
    margin-bottom: 30px;
    width: 200px;
    height: 4px;
    background-color: #00ACBA;
    display: block;
    content: "";
}

.column_header_subTtl {
    margin-bottom: 5px;
    font-size: 20px;
    font-size: 2rem;
    font-weight: bold;
}

.column_header_ttl {
    margin-bottom: 30px;
    color: #111;
    font-size: 32px;
    font-size: 3.2rem;
}

.column_header_meta_date {
    float: left;
}

.column_header_meta_categories {
    float: right;
}

/* スマホ */
@media screen and (max-width: 767px) {
    .column_header {
        margin: 0 15px;
    }

    .column_header:before {
        display: none;
    }

    .column_header_subTtl {
        font-size: 1.6rem;
    }

    .column_header_ttl {
        margin-bottom: 10px;
        font-size: 2.2rem;
        font-weight: bold;
    }

    .column_mainImage {
        margin-left: -15px;
        margin-right: -15px;
    }
}

/*-------------------------------------------------------------------------------
  ライブラリ詳細
-------------------------------------------------------------------------------*/
.library_header {
    margin-left: 20px;
    margin-right: 20px;
    margin-bottom: 30px;
}

.library_header:before {
    margin-bottom: 30px;
    width: 200px;
    height: 4px;
    background-color: #00ACBA;
    display: block;
    content: "";
}

.library_header_ttl {
    margin-bottom: 25px;
    color: #111;
    font-size: 32px;
    font-size: 3.2rem;
}

.library_header_tag_icon {
    margin-right: 5px;
    color: #00ACBA;
    font-size: 26px;
    font-size: 2.6rem;
    vertical-align: middle;
}

.library_header_tags {
    margin-bottom: 20px;
}

.library_header_client {
    margin-top: 20px;
}

/* スマホ */
@media screen and (max-width: 767px) {
    .library_header {
        margin: 0 15px;
    }

    .library_header:before {
        display: none;
    }

    .library_header_subTtl {
        font-size: 1.6rem;
    }

    .library_header_ttl {
        margin-bottom: 10px;
        font-size: 2.2rem;
        font-weight: bold;
    }
}

/*-------------------------------------------------------------------------------
  デジタルライブラリの動画表示
-------------------------------------------------------------------------------*/
.library_movie {
    margin-top: -30px;
    margin-bottom: 30px;
    min-height: 360px;
    background-color: #333;
    position: relative;
    text-align: center;
    font-size: 0;
}

.library_movie .eviry-baseplayer {
    margin-left: auto;
    margin-right: auto;
}

.install_flash_player {
    min-height: 360px;
    background: #fff;
    font-size: 14px;
    text-align: center;
}

.install_flash_player p {
    padding-top: 140px;
}

.library_movie .warningSign {
    position: absolute;
    top: 50%;
    left: 50%;
    text-align: left;

    transform: translate(-50%, -50%);
}

@media screen and (max-width: 767px) {
    .library_movie {
        box-sizing: border-box;
        margin-top: -20px;
        min-height: 210px;
    }

    .library_movie_posterImage {
        max-width: 100%;
        height: auto;
    }
}

/*-------------------------------------------------------------------------------
  閲覧制限があるコンテンツを表示する前の注意喚起看板
-------------------------------------------------------------------------------*/
.warningSign {
    box-sizing: border-box;
    padding: 20px 20px 30px;
    width: 500px;
    background: rgba(255, 255, 255, 0.9);
    text-align: left;
}

.warningSign_text {
    font-size: 16px;
    font-size: 1.6rem;
    font-weight: bold;
}

.warningSign_notes {
    margin-top: 15px;
    font-size: 14px;
    font-size: 1.4rem;
}

.warningSign_btn {
    margin-top: 25px;
    text-align: center;
    font-size: 0;
}

.warningSign_btn_login {
    margin-right: 20px;
    width: 168px;
}

.warningSign_btn_register {
    width: 205px;
}

.warningSign_btn_input {
    width: 389px;
}

.warningSign_btn_consent {
    width: 237px;
}

@media screen and (max-width: 767px) {
    .warningSign {
        padding: 15px;
        width: 300px;
    }

    .warningSign_text {
        font-size: 14px;
        font-size: 1.4rem;
        font-weight: bold;
    }

    .warningSign_notes {
        margin-top: 5px;
        font-size: 10px;
        font-size: 1rem;
    }

    .warningSign_btn {
        margin-top: 10px;
    }

    .warningSign_btn_login {
        margin-right: 10px;
        width: auto;
    }

    .warningSign_btn_register {
        width: auto;
    }
}

.warningSign-border {
    margin-top: 30px;
    margin-bottom: 30px;
    width: auto;
    background-color: #F3F3F3;
    border: 2px solid #00ACBA;
}

/*-------------------------------------------------------------------------------
  イベントリスト
-------------------------------------------------------------------------------*/
.eventList {
    margin-top: 20px;
    margin-bottom: 20px;
}

.eventColumn_body .eventColumn_type {
    margin-bottom: 12px;
    padding: 3px 10px;
    background-color: #7DB61F;
    display: table;
    color: #fff;
    font-size: 11px;
    font-size: 1.1rem;
    line-height: 1;
}

.eventColumn_datetime {
    margin-bottom: 8px;
}

/* スマホ */
@media screen and (max-width: 767px) {
    .eventList {
        margin-top: 10px;
        margin-bottom: 10px;
    }
}

.eventList-horizontal_articles {
    overflow: hidden;
    border-bottom: 1px dotted #ccc;
}

.eventList-horizontal_article {
    box-sizing: border-box;
    width: 180px;
    border-left: 1px dotted #ccc;
    float: left;
}

.eventList-horizontal_articles > :first-child {
    border-left: none;
}

.eventList-horizontal_linkArea {
    padding: 20px;
    overflow: hidden;
    display: block;
    position: relative;
}

.eventList-horizontal_linkArea:link,
.eventList-horizontal_linkArea:visited {
    text-decoration: none;
}

.eventList-horizontal_linkArea:hover {
    background-color: #D9F3F5;
}

.eventList-horizontal_thumbnail,
.eventList-horizontal_thumbnail-dummy {
    box-sizing: border-box;
    margin-bottom: 20px;
    width: 140px;
    height: 140px;
    background: #fff url(/img/common/dummy/no_image-lg.png) no-repeat center;
    -webkit-background-size: cover;
    background-size: cover;
}

.eventList-horizontal_thumbnail-dummy {
    border: 1px solid #ccc;
    -webkit-background-size: 80% auto;
    background-size: 80% auto;
}

.eventList-horizontal_type {
    margin-bottom: 12px;
    padding: 3px 10px;
    background-color: #7DB61F;
    display: inline-block;
    color: #fff;
    font-size: 11px;
    font-size: 1.1rem;
    line-height: 1;
}

.eventList-horizontal_ttl {
    position: relative;
    color: #111;
    font-size: 1.6rem;
    white-space: nowrap;
    font-weight: normal;
}

.eventList-horizontal_date {
    position: relative;
    color: #666;
    font-size: 1.3rem;
    white-space: nowrap;
}

.eventList-horizontal_ttl:after,
.eventList-horizontal_type:after,
.eventList-horizontal_date:after {
    margin-left: -10px;
    width: 30px;
    height: 100%;
    background: -moz-linear-gradient(left,  rgba(255,255,255,0) 0%, rgba(255,255,255,1) 80%, rgba(255,255,255,1) 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(left,  rgba(255,255,255,0) 0%, rgba(255,255,255,1) 80%, rgba(255,255,255,1) 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to right,  rgba(255,255,255,0) 0%, rgba(255,255,255,1) 80%, rgba(255,255,255,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    position: absolute;
    top: 0;
    left: 100%;
    content: "";
}

.eventList-horizontal_linkArea:hover .eventList-horizontal_ttl:after,
.eventList-horizontal_linkArea:hover .eventList-horizontal_type:after,
.eventList-horizontal_linkArea:hover .eventList-horizontal_date:after {
    background: -moz-linear-gradient(left,  rgba(217,243,245,0) 0%, rgba(217,243,245,1) 80%, rgba(217,243,245,1) 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(left,  rgba(217,243,245,0) 0%, rgba(217,243,245,1) 80%,rgba(217,243,245,1) 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to right,  rgba(217,243,245,0) 0%, rgba(217,243,245,1) 80%,rgba(217,243,245,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
}

.eventList-horizontal_date {
    margin-top: 8px;
}

.eventList-horizontal_articles + .event_more {
    padding: 20px;
    text-align: right;
}

@media screen and (max-width: 767px) {
    .eventList-horizontal_articles {
        overflow: hidden;
    }

    .eventList-horizontal_article {
        width: 25%;
    }

    .eventList-horizontal_linkArea {
        padding: 15px;
    }

    .eventList-horizontal_thumbnail,
    .eventList-horizontal_thumbnail-dummy {
        margin-left: auto;
        margin-right: auto;
        width: 130px;
        height: 130px;
    }

    .eventList-horizontal_articles + .event_more {
        padding: 15px 0;
        text-align: center;
    }
}

@media screen and (max-width: 650px) {
    .eventList-horizontal_articles {
        border-bottom: none;
    }

    .eventList-horizontal_article {
        width: 50%;
        border-bottom: 1px dotted #ccc;
    }

    .eventList-horizontal_articles > :nth-child(odd) {
        border-left: none;
    }
}

/*-------------------------------------------------------------------------------
  イベント詳細
-------------------------------------------------------------------------------*/
.event_header {
    margin-left: 20px;
    margin-right: 20px;
    margin-bottom: 30px;
}

.event_header:before {
    margin-bottom: 30px;
    width: 200px;
    height: 4px;
    background-color: #00ACBA;
    display: block;
    content: "";
}

.event_header_eventType {
    margin-bottom: 18px;
    padding: 3px 10px;
    background-color: #7DB61F;
    display: table;
    float: left;
    color: #fff;
    font-size: 11px;
    font-size: 1.1rem;
    line-height: 1;
}

.event_header_publicDate {
    float: right;
}

.event_header_ttl {
    margin-bottom: 10px;
    clear: both;
    color: #111;
    font-size: 32px;
    font-size: 3.2rem;
    line-height: 1.3;
}

.event_header_schedule {
    margin-bottom: 5px;
    color: #666;
    font-size: 24px;
    font-size: 2.4rem;
}

.event_header_location {
    margin-bottom: 12px;
}

.event_header_location li {
    margin-right: 30px;
    display: inline-block;
}

.event_header_location > :last-child {
    margin-right: 0;
}

.event_header_location .fa {
    font-size: 16px;
    font-size: 1.6rem;
}

.event_header_tag_icon {
    margin-right: 5px;
    color: #00ACBA;
    font-size: 16px;
    font-size: 1.6rem;
    vertical-align: middle;
}

.event_header_tag_list {
    display: inline-block;
    vertical-align: middle;
}

.event_apply {
    padding: 30px;
    background: #F3F3F3;
    text-align: center;
}

.event_apply_btn {
    width: 256px;
}

.event_apply_info {
    margin-top: 17px;
    font-size: 16px;
    font-size: 1.6rem;
    font-weight: bold;
}

.event_apply_settled {
    color: #878787;
    font-size: 22px;
    font-size: 2.2rem;
}

.event_apply_exit {
    color: #f00;
    font-size: 22px;
    font-size: 2.2rem;
    font-weight: bold;
}

.event_body {
    margin-top: 25px;
}

.event_map_canvas {
    width: 100%;
    height: 425px;
}

/* スマホ */
@media screen and (max-width: 767px) {
    .event_header {
        margin: 0 15px;
    }

    .event_header:before {
        display: none;
    }

    .event_header_subTtl {
        font-size: 1.6rem;
    }

    .event_header_ttl {
        margin-bottom: 10px;
        font-size: 2.2rem;
        font-weight: bold;
    }

    .event_apply {
        padding: 15px;
    }

    .event_apply_info {
        margin-top: 10px;
    }

    .event_map_canvas {
        height: 300px;
    }
}

/*-------------------------------------------------------------------------------
  クライアントプロフィールの概要
-------------------------------------------------------------------------------*/
.library_header_tag + .client_overview_small {
    margin-top: 20px;
}

.client_overview_small {
    display: table;
}

.client_overview_small_thumbnail {
    display: table-cell;
}

.client_overview_small_name {
    padding: 0 10px;
    display: table-cell;
    vertical-align: middle;
}

.client_overview_small_date {
    display: table-cell;
    vertical-align: middle;
}

.client_overview_small {

}

/*-------------------------------------------------------------------------------
  サブコンテンツの検討リスト
-------------------------------------------------------------------------------*/
.sub_container {
    margin-bottom: 20px;
    border-top: 3px solid #00ACBA;
    background-color: #fff;
}

.sub_container_header {
    padding: 15px;
    border-bottom: 1px dotted #ccc;
    font-size: 18px;
    font-size: 1.8rem;
    font-weight: normal;
}

.sub_container_list {

}

.sub_container_list li a {
    padding: 15px 10px 13px 30px;
    font-size: 15px;
    display: block;
    background: url(/img/common/icon02.png) no-repeat 15px 1.4em;
    border-bottom: 1px dotted #ccc;
    text-decoration: none;
}

.sub_container_list li li a {
    padding-left: 45px;
    background-position: 30px 1.4em;
}

.sub_container_list li a:hover {
    background-color: #D9F3F5;
}
/*-------------------------------------------------------------------------------
  サブコンテンツの検討リスト
-------------------------------------------------------------------------------*/
.sub_studyList {
    padding: 13px;
}

.sub_studyList_ttl {
    margin-top: 4px;
    font-size: 18px;
    font-size: 1.8rem;
    text-align: center;
}

.sub_studyList_count {
    margin-top: 15px;
    padding-top: 15px;
    padding-bottom: 15px;
    background-color: #f3f3f3;
    font-size: 16px;
    font-size: 1.6rem;
    text-align: center;
    line-height: 1;
}

.sub_studyList_count a {
    border-bottom: 2px solid #51448D;
    text-decoration: none;
}

.sub_studyList_count a:link {
    border-bottom: 2px solid #004799;
}

.sub_studyList_count a:visited {
    border-bottom: 2px solid #51448D;
}

.sub_studyList_count a:hover {
    border-bottom: 2px solid #004799;
}

.sub_studyList_count_num {
    font-size: 30px;
    font-size: 3rem;
}

.sub_studyList_contact {
    margin-top: 15px;
    width: 100%;
}

.sub_studyList_note {
    margin-top: 10px;
    text-align: center;
}

/*-------------------------------------------------------------------------------
  デジタルライブラリー
-------------------------------------------------------------------------------*/
#library #container {
    background-color: #fff;
}

#library #main {
    width: 1200px;
}

#library #conts {
    width: 880px;
}

/* FV */
#library .head-image_box {
    display: inline-block;
    text-align: left;
}

#library .head-image_ttl {
    margin-bottom: 15px;
}

#library .head-image_lead p:not(:last-child) {
    margin-bottom: 5px;
}

#library .comBox .ttl {
    margin-bottom: 25px;
    padding: 12px 15px;
    background: #F5F5F5;
    border: 1px solid #CCC;
    display: flex;
    color: #111;
    font-size: 2.2rem;
    font-weight: 500;
}

#library .comBox .ttl .icon {
    margin-right: 15px;
    -ms-flex-item-align: center;
    align-self: center;
}

#library .comBox .ttl .en {
    margin-left: 7px;
    vertical-align: middle;
    color: #AAA;
    font-family: '源ノ角ゴシック JP', '源ノ角ゴシック';
    font-size: 1rem;
    -webkit-transform: scale(0.9);
    transform: scale(0.9);
}

/* sec01 */
#library .rankingList {
    display: flex;
    flex-wrap: wrap;
    margin-bottom: 30px;
}

#library .rankingList > li {
    width: calc(100% / 4 - 8px);
    margin-bottom: 10px;
    margin-right: 10px;
    text-align: center;
    display: flex;
    flex-direction: column;
}

#library .rankingList > li:nth-of-type(4n) {
    margin-right: 0;
}

#library .rankingOrder {
    margin-bottom: 2px;
    font-size: 2rem;
    font-weight: bold;
    text-align: center;
    position: relative;
    display: flex;
    width: 100%;
    align-items: baseline;
    justify-content: center;
}

#library .rankingOrder > span::before {
    content: "";
    position: absolute;
    left: -23px;
    top: -1px;
    bottom: 0;
    margin: auto;
    background: url(/img/library/library_icon05.png) center /17px 15px no-repeat;
    width: 17px;
    height: 15px;
}

#library .rankingList li:nth-of-type(1) .rankingOrder > span::before {
    background-image: url(/img/library/library_icon05.png);
}

#library .rankingList li:nth-of-type(2) .rankingOrder > span::before {
    background-image: url(/img/library/library_icon06.png);
}

#library .rankingList li:nth-of-type(3) .rankingOrder > span::before {
    background-image: url(/img/library/library_icon07.png);
}

#library .rankingList li:nth-of-type(4) .rankingOrder > span::before {
    background-image: none;
}

#library .rankingOrder > span {
    position: relative;
}

#library .rankingOrder > span > span {
    font-size: 1.6rem;
}

#library .rankingItem {
    border: 1px solid #ccc;
    text-align: left;
    position: relative;
    height: 100%;
}

#library .rankingInner {
    padding: 9px;
    margin-bottom: 31px;
}

#library .rankingLabel {
    margin-bottom: 5px;
    position: relative;
    display: block;
    cursor: pointer;
}

#library .rankingLabel::before {
    content: "";
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    margin-top: -10px;
    width: 20px;
    height: 20px;
    background: #fff;
    border: 1px solid #CCC;
    border-radius: 2px;
    position: absolute;
    top: 15px;
    left: 5px;
}

#library .rankingLabel input:checked + span::before {
    content: "";
    margin-top: -8px;
    width: 5px;
    height: 10px;
    border-right: 3px solid #1F2228;
    border-bottom: 3px solid #1F2228;
    position: absolute;
    top: 15px;
    left: 11px;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
  }

#library .rankingLabel input {
    display: none;
}

#library .rankingLabel img {
    width: 190px;
    height: auto;
}

#library .rankingLabel + .rankingLink {
  margin-bottom: 10px;
  display: block;
  color: #333;
  font-weight: bold;
}

#library .rankingLink {
    text-decoration: none;
}

#library .rankingLink:hover {
    text-decoration: underline;
}

#library .rankingInner + .rankingLink {
    color: #fc2545;
    background: #f5f5f5;
    display: block;
    text-align: center;
    padding: 5px 0;
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
}

#library .libraryColumn_tags {
    margin: 0 0 5px;
}

#library .list-tagsLabel > li {
    font-size: 1rem;
    margin: 0 5px 5px 0;
    vertical-align: top;
}

#library .list-tagsLabel > li > .js-link {
    padding: 0.5em 0.9em 0.4em;
}

#library .list-tagsLabel:before {
    color: #006699;
    font-size: 1.4rem;
}

#library .movie .rankingLabel span {
    display: none;
}

#library .movie .rankingLabel::before {
  content: none;
}

#library .movie .rankingLabel::after {
  margin: auto;
  width: 40px;
  height: 40px;
  background: url(/img/library/library_icon10.png) center /40px 40px no-repeat;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  content: "";
}

#library .movie .rankingLabel:hover::after {
  background-image: url(/img/library/library_icon11.png);
}

#library .pdf .rankingInner .rankingLink {
  padding-left: 18px;
  position: relative;
}

#library .pdf .rankingInner .rankingLink::before {
  width: 12px;
  height: 16px;
  background: url(/img/library/library_icon09.png) center /12px 16px no-repeat;
  position: absolute;
  top: 1px;
  left: 0;
  content: "";
}

/* sec02 */
#library .test {
    padding: 25px 85px;
    margin-bottom: 30px;
    border: 2px solid #ccc;
}

#library .test .testTtl {
    margin: 0 0 7px 5px;
}

#library .test .testTtl .im {
    font-size: 1.6rem;
    color: #006699;
    vertical-align: sub;
}

#library .test .testKey {
    margin-bottom: 15px;
}

#library .test .testKey .body {
    background: url(/img/library/library_bg01.jpg) center /694px 100px no-repeat;
}

#library .test .testKey .body .text_form {
    height: 100px;
    display: flex;
    justify-content: center;
    align-items: center;
}

#library .test .testKey .body input {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding: 12px 20px !important;
    width: 410px;
    height: 40px;
    background-position: 20px center !important;
    border: 1px solid #CCC !important;
    border-right: none !important;
    border-radius: 20px 0 0 20px;
    font-size: 1.2rem;
}

#library .test .testKey .body button {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding: 12px;
    width: 120px;
    height: 40px;
    background: #FC2545;
    border: none;
    border-radius: 0 20px 20px 0;
    position: relative;
    color: #fff;
    font-size: 1.5rem;
    font-weight: 400;
    cursor: pointer;
    -webkit-transition: .5s ease;
    transition: .5s ease;
}

#library .test .testTag .body .list-tagsLabel {
    margin: 0 3px 10px;
}

#library .test .testTag .body .list-tagsLabel > li {
    margin: 0 4px 8px 4px;
    font-size: 1.1rem;
    display: none;
}

#library .test .testTag .body .list-tagsLabel > li.is-visible {
    display: inline-block;
    animation: fadeIn 0.5s ease forwards;
}

@keyframes fadeIn {
  from {
    opacity: 0;
    display: none;
  }
  to {
    opacity: 1;
    display: inline-block;
  }
}

#library .test .testTag .body .list-tagsLabel > li > .js-link {
    padding: 0.5em 1.2em 0.4em;
}

#library .test .testTag .body .list-tagsLabel::before {
    display: none;
}

#library .test .testTag .body .tagsBtnWrap {
    text-align: center;
}

#library .test .testTag .body .tagsBtn {
    background-color: transparent;
    cursor: pointer;
    outline: none;
    appearance: none;
    display: inline-block;
    border-radius: 20px;
    padding: 9px 50px;
    border: 1px solid #006699;
    text-decoration: none;
    font-size: 1.3rem;
    font-weight: bold;
    position: relative;
    color: #004799;
    transition: .3s;
}

#library .test .testTag .body .tagsBtnWrap.is-hidden .tagsBtn {
    display: none;
}

#library .test .testTag .body .tagsBtn:hover {
    opacity: 0.7;
}

#library .test .testTag .body .tagsBtn span {
    position: relative;
    padding-right: 15px;
}

#library .test .testTag .body .tagsBtn span::after {
    position: absolute;
    top: -3px;
    bottom: 0;
    right: 0;
    margin: auto;
    width: 5px;
    height: 5px;
    content: "";
    vertical-align: middle;
    border-top: 1px solid #006699;
    border-right: 1px solid #006699;
    -webkit-transform: rotate(135deg);
    transform: rotate(135deg);
}

#library .test .testType .typeList {
    display: flex;
}

#library .test .testType .typeList li:first-child {
    margin-right: 7px;
}

#library .test .testType .typeList li:nth-child(2) {
    pointer-events: none;
}

/* sec03 */
#library .paginationWrap {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    border-bottom: 1px dashed #ccc;
    padding-bottom: 15px;
    margin-bottom: 30px;
}

#library .paginationWrap:last-of-type {
    border-bottom: none;
    margin-bottom: 0;
}

#library .pagination li span {
    background: #006699;
    border-color: #006699;
}

#library .pagination li a:hover {
    background: #006699;
    border-color: #006699;
}

#library .sortTag {
    display: flex;
}

#library .sortTag li {
    position: relative;
    padding: 0 7px;
}

#library .sortTag li.is-active {
    font-weight: bold;
}

#library .sortTag li:not(:last-child)::after {
    content: "｜";
    position: absolute;
}

#library .sortTag li a {
    text-decoration: none;
    color: #333;
}

#library .sortTag li a:hover {
    text-decoration: underline;
}

#library .allCheck {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding: 15px 25px;
    margin-bottom: 30px;
    width: 100%;
    height: 70px;
    background: #1f2228;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    position: relative;
}

#library .allCheck label {
  padding-right: 20px;
  padding-left: 30px;
  width: 17%;
  border-right: 1px dotted #ccc;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  position: relative;
  color: #fff;
  font-size: 1.4rem;
  font-weight: 400;
  -webkit-box-align: center;
  align-items: center;
  -ms-flex-align: center;
  cursor: pointer;
}

#library .allCheck label::before {
    content: "";
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    margin-top: -10px;
    width: 20px;
    height: 20px;
    background: #fff;
    border: 1px solid #CCC;
    border-radius: 2px;
    position: absolute;
    top: 50%;
    left: 0;
}

#library .allCheck label input {
    display: none;
}

#library .allCheck label input:checked + span::before {
    content: "";
    margin-top: -12px;
    width: 5px;
    height: 10px;
    border-right: 3px solid #1F2228;
    border-bottom: 3px solid #1F2228;
    position: absolute;
    top: 15px;
    left: 7px;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
}

#library .allCheck p {
    padding-left: 25px;
    color: #fff;
}

#library .comBox:nth-of-type(3) .rankingList {
    border-bottom: 1px dashed #ccc;
    margin-bottom: 15px;
    padding-bottom: 15px;
}

#library .noApplicable {
  margin-top: 50px;
  padding: 30px;
  border: 4px solid #FC2545;
  color: #FC2545;
  font-size: 2rem;
  font-weight: 400;
  text-align: center;
  margin-bottom: 15px;
}

/* タブレット */
@media only screen and (max-width: 1279px) and (min-width: 768px) {

    #library .rankingLabel img {
        width: 100%;
        height: auto;
    }

}

/* スマホ */
@media screen and (max-width: 767px) {
    #library .head-image {
        margin-bottom: 0;
    }

    #library .head-image_ttl {
        font-size: 2rem;
    }

    #library .head-image_lead {
        font-size: 1.2rem;
    }

    #library .head-image_lead p br {
        display: none;
    }

    #library #conts .downloadNote {
        padding: 15px;
    }

    #library .comBox {
        margin-bottom: 20px;
    }

    #library .comBox .ttl {
        margin-bottom: 15px;
        font-size: 1.6rem;
    }

    #library .comBox .ttl .en {
        display: block;
        margin-left: 0;
        transform: none;
        margin-top: 5px;
    }

    #library .comBox .ttl .icon {
        width: 27px;
        height: 24px;
    }

    #library .rankingInner {
        padding: 5px;
    }

    #library .rankingList {
        margin: 0 15px;
    }

    #library .rankingList > li {
        width: calc(100% / 2 - 5px);
        font-size: 1.2rem;
        margin-bottom: 10px;
    }

    #library .rankingList > li:nth-of-type(2n) {
        margin-right: 0;
    }

    #library .rankingLabel + .rankingLink {
        height: auto;
    }

    #library .list-tagsLabel > li {
        margin-right: 3px;
    }

    #library .list-tagsLabel > li > .js-link {
        padding: 0.5em 0.5em 0.4em;
    }

    #library .rankingLabel::before {
        width: 15px;
        height: 15px;
    }

    #library .rankingLabel input:checked + span::before {
        width: 4px;
        height: 7px;
        border-width: 2px;
        left: 10px;
    }

    #library .rankingLabel img {
        width: 100%;
        height: auto;
    }

    #library .rankingOrder::before {
        background-size: 18px 16px;
        width: 18px;
        height: 16px;
    }

    #library .contTab {
        margin-bottom: 15px;
    }

    #library .contTab .contTab_list {
        padding: 0 15px;
    }

    #library .contTab .contTab_list li {
        padding: 8px 10px 10px;
        border-width: 2px;
        border-radius: 5px 5px 0 0;
        font-size: 1rem;
        text-align: left;
    }

    #library .contTab .contTab_list li span {
        margin-bottom: 2px;
        font-size: 1.6rem;
        text-align: center;
    }

    #library .contTab .contTab_list li::before,
    #library .contTab .contTab_list li::after {
        height: 2px;
    }

    #library .contTab .contTab_list li::before {
        width: 4px;
        left: -4px;
    }

    #library .testType .body {
        padding: 0 15px;
    }

    #library .pdf .rankingInner .rankingLink {
        padding-left: 13px;
    }

    #library .pdf .rankingInner .rankingLink::before {
        width: 9px;
        height: 12px;
        background-size: 9px 12px;
    }

    #library .movie .rankingLabel::after {
        width: 30px;
        height: 30px;
        background-size: 30px 30px;
    }

    #library .movie .rankingLabel:hover::after {
        background-image: url(/img/library/library_icon10.png);
    }

    #library .test {
        padding: 0;
        border: none;
    }

    #library .test .testTtl {
        margin-left: 15px;
    }

    #library .test .testKey .body {
        background: url(/img/library/sp/library_bg01.jpg) center /cover no-repeat;
        padding: 0 15px;
    }

    #library .test .testTag .body {
        padding: 0 15px;
    }

    #library .test .testTag .body .list-tagsLabel {
        margin: 0 0 10px;
    }

    #library .test .testTag .body .list-tagsLabel > li {
        margin: 0 5px 8px 5px;
        font-size: 1rem;
    }

    #library .test .testTag .body .list-tagsLabel > li > .js-link {
        padding: 0.5em 0.5em 0.4em;
    }

    #library .test .testTag .body .tagsBtn {
        width: 100%;
        box-sizing: border-box;
        margin-bottom: 15px;
    }

    #library .paginationWrap {
        margin: 0 15px 15px;
        padding-bottom: 10px;
        display: block;
    }

    #library .display {
        margin-bottom: 3px;
    }

    #library .pagination {
        margin: 0 -10px 3px;
    }

    #library .pagination :first-child {
        margin-left: 5px;
    }

    #library .sortTag {
        margin: 0 -7px;
    }

    #library .allCheck {
        padding: 15px;
        font-size: 1rem;
    }

    #library .allCheck p {
        padding-left: 15px;
    }

    #library .allCheck label {
        font-size: 1rem;
        padding-right: 10px;
        padding-left: 25px;
        min-width: 110px;
        box-sizing: border-box;
    }

    #library .allCheck label::before {
        width: 15px;
        height: 15px;
    }

    #library .allCheck label input:checked + span::before {
        margin-top: -8px;
        width: 3px;
        height: 8px;
        border-width: 2px;
        top: 7px;
        left: 6px;
    }

    #library .movie .rankingLabel::before {
        background-size: 17px;
        width: 17px;
        height: 17px;
    }
}





/* サイドバー関係 */
#library #side.fixed {
    position: fixed;
    top: 15px;
}

#library .downloadBox {
    margin-bottom: 7px;
    background: #f8f8f8;
    border: 1px solid #1f2228;
}

#library .downloadHdg {
    font-size: 1.4rem;
    text-align: center;
    background: #1f2228;
    color: #fff;
}

#library .downloadTtl {
    display: inline-block;
    position: relative;
    padding-left: 30px;
}

#library .downloadTtl::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    margin: auto;
    background: url(/img/library/library_icon01.png) center /27px 24px no-repeat;
    width: 27px;
    height: 24px;
}

#library .downloadTtl > span {
    font-size: 2.7rem;
    margin: 0 5px;
    vertical-align: sub;
}

#library .downloadBox .ctaBtn {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    width: calc(100% - 30px);
    height: 50px;
    margin: 15px auto!important;
    background: #fc2545;
    border-radius: 25px;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    color: #fff;
    line-height: 1.3;
    font-size: 1.4rem;
    font-weight: 700;
    -webkit-transition: .5s ease;
    transition: .5s ease;
    -moz-transition: .5s ease;
    -ms-transition: .5s ease;
    -o-transition: .5s ease;
    -webkit-border-radius: 25px;
    -moz-border-radius: 25px;
    -ms-border-radius: 25px;
    -o-border-radius: 25px;
    text-decoration: none;
}

#library .downloadBox .ctaBtn:hover {
    opacity: 0.7;
}

#library .downloadBox .ctaBtn i.im {
    margin-top: 2px;
    margin-right: 10px;
    color: #ffe33f;
    font-size: 1.5rem;
}

/* タブレット */
@media only screen and (max-width: 1279px) and (min-width: 768px) {
    #library #main {
        width: 1050px;
    }

    #library #conts {
        width: 720px;
    }

    #library #conts .content-wrap {
        margin: 30px 20px;
    }
}

/* スマホ */
@media screen and (max-width: 767px) {
    #library #main {
        width: auto;
    }

    #library #conts {
        width: auto;
    }

    #library .downloadBox {
        margin-bottom: 0;
    }

    #library #footer {
        margin-bottom: 101px;
    }

    #library .downloadHdg {
        padding: 5px 0;
    }

    #library .downloadTtl {
        font-size: 1.2rem;
        display: inline;
        padding-left: 20px;
    }

    #library .downloadTtl > span {
        font-size: 1.6rem;
        vertical-align: baseline;
    }

    #library .downloadTtl::before {
        background-size: 17px 15px;
        width: 17px;
        height: 15px;
        top: -3px;
    }

    #library .downloadBox .ctaBtn {
        font-size: 1.2rem;
    }
}

#library .bnrBox {
  text-align: center;
}

#library .bnrBox a {
  display: inline-block;
}

#library .bnrBox a:hover {
  opacity: 0.7;
}

.contTab {
  margin-bottom: 30px;
}

.contTab .contTab_list {
  display: flex;
  justify-content: space-between;
}

.contTab .contTab_list li {
  box-sizing: border-box;
  padding: 13px 0 10px;
  width: calc(50% - 2px);
  background: #f5f5f5;
  border: 4px solid #f5f5f5;
  border-bottom: none;
  border-radius: 10px 10px 0 0;
  position: relative;
  color: #aaa;
  line-height: 1.3;
  text-align: center;
  cursor: pointer;
  transition: 0.2s;
}

.contTab .contTab_list li:nth-child(3) {
  pointer-events: none;
  color: #808080;
}

.fade-enter-active,
.fade-leave-active {
  transition: opacity 0.5s;
}

.fade-enter,
.fade-leave-to /* .fade-leave-active below version 2.1.8 */ {
  opacity: 0;
}

.contTab .contTab_list li:hover,
.contTab .contTab_list li.is-active {
  background: #fff;
  border-color: #fc2545;
  color: #fc2545;
}

.contTab .contTab_list li::after {
  margin: auto;
  width: 100%;
  height: 4px;
  background: #fc2545;
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  content: "";
}

.contTab .contTab_list li:not(:first-child)::before {
  margin: auto;
  width: 8px;
  height: 4px;
  background: #fc2545;
  position: absolute;
  bottom: 0;
  left: -8px;
  content: "";
}

.contTab .contTab_list li:hover::after,
.contTab .contTab_list li.is-active::after {
  background: #fff;
}

.contTab .contTab_list li span {
  display: block;
  font-size: 2.7rem;
  font-weight: bold;
  color: #aaa;
}

.contTab .contTab_list li.is-active span {
  color: #fc2545;
}


/*-------------------------------------------------------------------------------
    お気に入り資料・ダウンロード履歴
-------------------------------------------------------------------------------*/

#myLibrary #container {
    background-color: #fff;
}

#myLibrary #main {
    width: 1200px;
}

#myLibrary #conts {
    width: 880px;
}

#myLibrary .head-image_box {
    display: inline-block;
    text-align: left;
}

#myLibrary .head-image_ttl {
    margin-bottom: 15px;
}

#myLibrary .head-image_lead p:not(:last-child) {
    margin-bottom: 5px;
}

#myLibrary .comBox .ttl {
    margin-bottom: 25px;
    padding: 12px 15px;
    background: #F5F5F5;
    border: 1px solid #CCC;
    display: flex;
    color: #111;
    font-size: 2.2rem;
    font-weight: 500;
}

#myLibrary .comBox .ttl .icon {
    margin-right: 15px;
    -ms-flex-item-align: center;
    align-self: center;
}

#myLibrary .comBox .ttl .en {
    margin-left: 7px;
    vertical-align: middle;
    color: #AAA;
    font-family: '源ノ角ゴシック JP', '源ノ角ゴシック';
    font-size: 1rem;
    -webkit-transform: scale(0.9);
    transform: scale(0.9);
}

#myLibrary .favBox{
    margin-top: 35px;

}

#myLibrary .dlBox{
    margin-top: 60px;
    padding-bottom: 20px;
}

#myLibrary .liraryList {
    display: flex;
    flex-wrap: wrap;
    margin-top: 30px;
}

#myLibrary .liraryList > li {
    width: calc(100% / 4 - 8px);
    margin-bottom: 10px;
    margin-right: 10px;
    text-align: center;
    display: flex;
    flex-direction: column;
}

#myLibrary .liraryList > li:nth-of-type(4n) {
    margin-right: 0;
}

#myLibrary .libraryListHistory {
    padding: 10px;
    font-size: 1em;
    text-align: center;
    position: relative;
    display: flex;
    width: 100%;
    justify-content:space-between;
    align-items: center;
    border-top:1px solid #ccc;
    border-right:1px solid #ccc;
    border-left:1px solid #ccc;
    box-sizing: border-box;
}

#myLibrary .libraryListHistory .downloadStatus {
    font-size: 1rem;
    width: 45px;
    background-color:#ed9c38;
    color:#fff;
}
#myLibrary .libraryListHistory .downloadStatus.done {
    background-color:#989898;
}
#myLibrary .libraryListHistory .addDate {
    font-size: 1.1rem;
}


#myLibrary .rankingItem {
    border-left: 1px solid #ccc;
    border-right: 1px solid #ccc;
    border-bottom: 1px solid #ccc;
    text-align: left;
    position: relative;
    height: 100%;
}

#myLibrary .rankingInner {
    padding: 0 10px;
    margin-bottom: 65px;
}

#myLibrary .rankingLabel {
    margin-bottom: 5px;
    position: relative;
    display: block;
    cursor: pointer;
}

#myLibrary .rankingLabel input:checked + span::before {
    content: "";
    margin-top: -8px;
    width: 5px;
    height: 10px;
    border-right: 3px solid #1F2228;
    border-bottom: 3px solid #1F2228;
    position: absolute;
    top: 15px;
    left: 11px;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
}

#myLibrary .rankingLabel input {
    display: none;
}

#myLibrary .rankingLabel img {
    width: 100%;
    height: auto;
}

#myLibrary .rankingLabel + .rankingLink {
  margin-bottom: 10px;
  display: block;
  color: #333;
  font-weight: bold;
}

#myLibrary .rankingLink {
    text-decoration: none;
}

#myLibrary .rankingLink:hover {
    text-decoration: underline;
}

#myLibrary .liblaryListbottomLinkbox{
    margin: auto;
    display: block;
    text-align: center;
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    font-size: 1em;

}
#myLibrary .liblaryListbottomLinkbox .rankingLink {
    padding: 5px 0;
    color: #fc2545;
    background: #f5f5f5;
    width: 100%;
    display: inline-block;
}

#myLibrary .liblaryListbottomLinkbox .libraryListTest{
    padding: 5px 0;
    color:#fff;
    background-color:#fc2545;
    display: inline-block;
    width: 100%;
    align-items: center;
    text-decoration: none;
}
#myLibrary .liblaryListbottomLinkbox .libraryListTest:hover{
    opacity: 0.6;
}

#myLibrary .libraryColumn_tags {
    margin: 0 0 5px;
}

#myLibrary .list-tagsLabel > li {
    font-size: 1rem;
    margin: 0 5px 5px 0;
    vertical-align: top;
}

#myLibrary .list-tagsLabel > li > .js-link {
    padding: 0.5em 0.9em 0.4em;
}

#myLibrary .list-tagsLabel:before {
    color: #006699;
    font-size: 1.4rem;
}

#myLibrary .movie .rankingLabel span {
    display: none;
}

#myLibrary .movie .rankingLabel::before {
  content: none;
}

#myLibrary .movie .rankingLabel::after {
  margin: auto;
  width: 40px;
  height: 40px;
  background: url(/img/library/library_icon10.png) center /40px 40px no-repeat;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  content: "";
}

#myLibrary .movie .rankingLabel:hover::after {
  background-image: url(/img/library/library_icon11.png);
}

#myLibrary .pdf .rankingInner .rankingLink {
  position: relative;
}
/* sec02 */
#myLibrary .test {
    padding: 25px 85px;
    margin-bottom: 30px;
    border: 2px solid #ccc;
}

#myLibrary .test .testTtl {
    margin: 0 0 7px 5px;
}

#myLibrary .test .testTtl .im {
    font-size: 1.6rem;
    color: #006699;
    vertical-align: sub;
}

#myLibrary .test .testKey {
    margin-bottom: 15px;
}

#myLibrary .test .testKey .body {
    background: url(/img/library/library_bg01.jpg) center /694px 100px no-repeat;
}

#myLibrary .test .testKey .body .text_form {
    height: 100px;
    display: flex;
    justify-content: center;
    align-items: center;
}

#myLibrary .test .testKey .body input {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding: 12px 20px !important;
    width: 410px;
    height: 40px;
    background-position: 20px center !important;
    border: 1px solid #CCC !important;
    border-right: none !important;
    border-radius: 20px 0 0 20px;
    font-size: 1.2rem;
}

#myLibrary .test .testKey .body button {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding: 12px;
    width: 120px;
    height: 40px;
    background: #FC2545;
    border: none;
    border-radius: 0 20px 20px 0;
    position: relative;
    color: #fff;
    font-size: 1.5rem;
    font-weight: 400;
    cursor: pointer;
    -webkit-transition: .5s ease;
    transition: .5s ease;
}

#myLibrary .test .testTag .body .list-tagsLabel {
    margin: 0 3px 10px;
}

#myLibrary .test .testTag .body .list-tagsLabel > li {
    margin: 0 4px 8px 4px;
    font-size: 1.1rem;
    display: none;
}

#myLibrary .test .testTag .body .list-tagsLabel > li.is-visible {
    display: inline-block;
    animation: fadeIn 0.5s ease forwards;
}

@keyframes fadeIn {
  from {
    opacity: 0;
    display: none;
  }
  to {
    opacity: 1;
    display: inline-block;
  }
}

#myLibrary .test .testTag .body .list-tagsLabel > li > .js-link {
    padding: 0.5em 1.2em 0.4em;
}

#myLibrary .test .testTag .body .list-tagsLabel::before {
    display: none;
}

#myLibrary .test .testTag .body .tagsBtnWrap {
    text-align: center;
}

#myLibrary .test .testTag .body .tagsBtn {
    background-color: transparent;
    cursor: pointer;
    outline: none;
    appearance: none;
    display: inline-block;
    border-radius: 20px;
    padding: 9px 50px;
    border: 1px solid #006699;
    text-decoration: none;
    font-size: 1.3rem;
    font-weight: bold;
    position: relative;
    color: #004799;
    transition: .3s;
}

#myLibrary .test .testTag .body .tagsBtnWrap.is-hidden .tagsBtn {
    display: none;
}

#myLibrary .test .testTag .body .tagsBtn:hover {
    opacity: 0.7;
}

#myLibrary .test .testTag .body .tagsBtn span {
    position: relative;
    padding-right: 15px;
}

#myLibrary .test .testTag .body .tagsBtn span::after {
    position: absolute;
    top: -3px;
    bottom: 0;
    right: 0;
    margin: auto;
    width: 5px;
    height: 5px;
    content: "";
    vertical-align: middle;
    border-top: 1px solid #006699;
    border-right: 1px solid #006699;
    -webkit-transform: rotate(135deg);
    transform: rotate(135deg);
}

#myLibrary .test .testType .typeList {
    display: flex;
}

#myLibrary .test .testType .typeList li:first-child {
    margin-right: 7px;
}

/* sec03 */
#myLibrary .paginationWrap {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    border-bottom: 1px dashed #ccc;
    padding-bottom: 15px;
    margin-bottom: 30px;
}

#myLibrary .paginationWrap:last-of-type {
    border-bottom: none;
    margin-bottom: 0;
}

#myLibrary .pagination li span {
    background: #006699;
    border-color: #006699;
}

#myLibrary .pagination li a:hover {
    background: #006699;
    border-color: #006699;
}

#myLibrary .sortTag {
    display: flex;
}

#myLibrary .sortTag li {
    position: relative;
    padding: 0 7px;
}

#myLibrary .sortTag li.is-active {
    font-weight: bold;
}

#myLibrary .sortTag li:not(:last-child)::after {
    content: "｜";
    position: absolute;
}

#myLibrary .sortTag li a {
    text-decoration: none;
    color: #333;
}

#myLibrary .sortTag li a:hover {
    text-decoration: underline;
}

#myLibrary .allCheck {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding: 15px 25px;
    margin-bottom: 30px;
    width: 100%;
    height: 70px;
    background: #1f2228;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    position: relative;
}

#myLibrary .allCheck label {
  padding-right: 20px;
  padding-left: 30px;
  width: 17%;
  border-right: 1px dotted #ccc;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  position: relative;
  color: #fff;
  font-size: 1.4rem;
  font-weight: 400;
  -webkit-box-align: center;
  align-items: center;
  -ms-flex-align: center;
  cursor: pointer;
}

#myLibrary .allCheck label::before {
    content: "";
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    margin-top: -10px;
    width: 20px;
    height: 20px;
    background: #fff;
    border: 1px solid #CCC;
    border-radius: 2px;
    position: absolute;
    top: 50%;
    left: 0;
}

#myLibrary .allCheck label input {
    display: none;
}

#myLibrary .allCheck label input:checked + span::before {
    content: "";
    margin-top: -12px;
    width: 5px;
    height: 10px;
    border-right: 3px solid #1F2228;
    border-bottom: 3px solid #1F2228;
    position: absolute;
    top: 15px;
    left: 7px;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
}

#myLibrary .allCheck p {
    padding-left: 25px;
    color: #fff;
}

#myLibrary .comBox:nth-of-type(3) .rankingList {
    border-bottom: 1px dashed #ccc;
    margin-bottom: 15px;
    padding-bottom: 15px;
}

/* タブレット */
@media only screen and (max-width: 1279px) and (min-width: 768px) {

    #myLibrary .rankingLabel img {
        width: 100%;
        height: auto;
    }

}

/* スマホ */
@media screen and (max-width: 767px) {
    #myLibrary .libraryListHistory{
        padding: 5px;
    }
    #myLibrary .libraryListHistory .addDate {
        font-size: 1rem;
    }
    #myLibrary .libraryListHistory .downloadStatus{
        width: 35px;
        height: 17px;
        display: inline-flex;
        justify-content: center;
        align-items: center;
    }
    #myLibrary .head-image {
        margin-bottom: 0;
    }

    #myLibrary .head-image_ttl {
        font-size: 2rem;
    }

    #myLibrary .head-image_lead {
        font-size: 1.2rem;
    }

    #myLibrary .head-image_lead p br {
        display: none;
    }

    #myLibrary #conts .downloadNote {
        padding: 15px;
    }

    #myLibrary .comBox {
        margin-bottom: 20px;
    }

    #myLibrary .comBox .ttl {
        margin-bottom: 15px;
        font-size: 1.6rem;
    }

    #myLibrary .comBox .ttl .en {
        display: block;
        margin-left: 0;
        transform: none;
        margin-top: 5px;
    }

    #myLibrary .comBox .ttl .icon {
        width: 27px;
        height: 24px;
    }

    #myLibrary .rankingInner {
        padding: 5px;
    }
    #myLibrary .liraryList{
        margin-top: 15px;
    }
    #myLibrary .liraryList > li {
        width: calc(100% / 2 - 5px);
        font-size: 1.2rem;
        margin-bottom: 10px;
    }

    #myLibrary .liraryList > li:nth-of-type(2n) {
        margin-right: 0;
    }

    #myLibrary .rankingLabel + .rankingLink {
        height: auto;
    }

    #myLibrary .list-tagsLabel > li {
        margin-right: 3px;
    }

    #myLibrary .list-tagsLabel > li > .js-link {
        padding: 0.5em 0.5em 0.4em;
    }

    #myLibrary .rankingLabel::before {
        width: 15px;
        height: 15px;
    }

    #myLibrary .rankingLabel input:checked + span::before {
        width: 4px;
        height: 7px;
        border-width: 2px;
        left: 10px;
    }

    #myLibrary .rankingLabel img {
        width: 100%;
        height: auto;
    }

    #myLibrary .rankingOrder::before {
        background-size: 18px 16px;
        width: 18px;
        height: 16px;
    }

    #myLibrary .contTab {
        margin-bottom: 15px;
    }

    #myLibrary .contTab .contTab_list {
        padding: 0 15px;
    }

    #myLibrary .contTab .contTab_list li {
        padding: 8px 10px 10px;
        border-width: 2px;
        border-radius: 5px 5px 0 0;
        font-size: 1rem;
        text-align: left;
    }

    #myLibrary .contTab .contTab_list li span {
        margin-bottom: 2px;
        font-size: 1.6rem;
        text-align: center;
    }

    #myLibrary .contTab .contTab_list li::before,
    #myLibrary .contTab .contTab_list li::after {
        height: 2px;
    }

    #myLibrary .contTab .contTab_list li::before {
        width: 8px;
        left: -8px;
    }

    #myLibrary .testType .body {
        padding: 0 15px;
    }

    #myLibrary .movie .rankingLabel::after {
        width: 30px;
        height: 30px;
        background-size: 30px 30px;
    }

    #myLibrary .movie .rankingLabel:hover::after {
        background-image: url(/img/library/library_icon10.png);
    }

    #myLibrary .test {
        padding: 0;
        border: none;
    }

    #myLibrary .test .testTtl {
        margin-left: 15px;
    }

    #myLibrary .test .testKey .body {
        background: url(/img/library/sp/library_bg01.jpg) center /cover no-repeat;
        padding: 0 15px;
    }

    #myLibrary .test .testTag .body {
        padding: 0 15px;
    }

    #myLibrary .test .testTag .body .list-tagsLabel {
        margin: 0 0 10px;
    }

    #myLibrary .test .testTag .body .list-tagsLabel > li {
        margin: 0 5px 8px 5px;
        font-size: 1rem;
    }

    #myLibrary .test .testTag .body .list-tagsLabel > li > .js-link {
        padding: 0.5em 0.5em 0.4em;
    }

    #myLibrary .test .testTag .body .tagsBtn {
        width: 100%;
        box-sizing: border-box;
        margin-bottom: 15px;
    }

    #myLibrary .paginationWrap {
        margin: 0 15px 15px;
        padding-bottom: 10px;
        display: block;
    }

    #myLibrary .display {
        margin-bottom: 3px;
    }

    #myLibrary .pagination {
        margin: 0 -10px 3px;
    }

    #myLibrary .pagination :first-child {
        margin-left: 5px;
    }

    #myLibrary .sortTag {
        margin: 0 -7px;
    }

    #myLibrary .allCheck {
        padding: 15px;
        font-size: 1rem;
    }

    #myLibrary .allCheck p {
        padding-left: 15px;
    }

    #myLibrary .allCheck label {
        font-size: 1rem;
        padding-right: 10px;
        padding-left: 25px;
        min-width: 110px;
        box-sizing: border-box;
    }

    #myLibrary .allCheck label::before {
        width: 15px;
        height: 15px;
    }

    #myLibrary .allCheck label input:checked + span::before {
        margin-top: -8px;
        width: 3px;
        height: 8px;
        border-width: 2px;
        top: 7px;
        left: 6px;
    }

    #myLibrary .movie .rankingLabel::before {
        background-size: 17px;
        width: 17px;
        height: 17px;
    }
}


/* サイドバー関係 */
#myLibrary #side.fixed {
    position: fixed;
    top: 15px;
}

#myLibrary .downloadBox {
    margin-bottom: 7px;
    background: #f8f8f8;
    border: 1px solid #1f2228;
}

#myLibrary .downloadHdg {
    font-size: 1.4rem;
    text-align: center;
    background: #1f2228;
    color: #fff;
}

#myLibrary .downloadTtl {
    display: inline-block;
    position: relative;
    padding-left: 30px;
}

#myLibrary .downloadTtl::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    margin: auto;
    background: url(/img/library/library_icon01.png) center /27px 24px no-repeat;
    width: 27px;
    height: 24px;
}

#myLibrary .downloadTtl > span {
    font-size: 2.7rem;
    margin: 0 5px;
    vertical-align: sub;
}

#myLibrary .downloadBox .ctaBtn {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    width: calc(100% - 30px);
    height: 50px;
    margin: 15px auto!important;
    background: #fc2545;
    border-radius: 25px;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    color: #fff;
    line-height: 1.3;
    font-size: 1.4rem;
    font-weight: 700;
    -webkit-transition: .5s ease;
    transition: .5s ease;
    -moz-transition: .5s ease;
    -ms-transition: .5s ease;
    -o-transition: .5s ease;
    -webkit-border-radius: 25px;
    -moz-border-radius: 25px;
    -ms-border-radius: 25px;
    -o-border-radius: 25px;
    text-decoration: none;
}

#myLibrary .downloadBox .ctaBtn:hover {
    opacity: 0.7;
}

#myLibrary .downloadBox .ctaBtn i.im {
    margin-top: 2px;
    margin-right: 10px;
    color: #ffe33f;
    font-size: 1.5rem;
}

/* タブレット */
@media only screen and (max-width: 1279px) and (min-width: 768px) {
    #myLibrary #main {
        width: 1050px;
    }

    #myLibrary #conts {
        width: 720px;
    }

    #myLibrary #conts .content-wrap {
        margin: 30px 20px;
    }
}

/* スマホ */
@media screen and (max-width: 767px) {
    #myLibrary #main {
        width: auto;
        font-size:1.2rem;
    }

    #myLibrary #conts {
        width: auto;
    }

    #myLibrary .downloadBox {
        margin-bottom: 0;
    }

    #myLibrary #footer {
        margin-bottom: 101px;
    }

    #myLibrary .downloadHdg {
        padding: 5px 0;
    }

    #myLibrary .downloadTtl {
        font-size: 1.2rem;
        display: inline;
        padding-left: 20px;
    }

    #myLibrary .downloadTtl > span {
        font-size: 1.6rem;
        vertical-align: baseline;
    }

    #myLibrary .downloadTtl::before {
        background-size: 17px 15px;
        width: 17px;
        height: 15px;
        top: -3px;
    }

    #myLibrary .downloadBox .ctaBtn {
        font-size: 1.2rem;
    }
}