@charset "UTF-8";

.pc {
  display: none;
}
.sp {
  display: inline-block;
}
@media screen and (min-width: 737px) {
  .pc {
    display: inline-block;
  }
  .sp {
    display: none;
  }
}

/*--------------------------------------------------------
解像度1200px以下
--------------------------------------------------------*/
@media only screen and (max-width: 1200px) {
  .site-header-in,
  .global-nav-in,
  .main-body-in,
  .site-footer-in {
    width: 100%;
    margin: auto;
  }

  .main-image-in,
  .main-image-in-text,
  .main-image-in-text .main-image-in-text-cont,
  .main-image-in-text.wide .main-image-in-text-cont {
    width: 100%;
  }

  .col1 .section-wrap,
  .col1 .breadcrumbs,
  .col1 .section-wrap.wide .section-in,
  .col1 .section-wrap.wide {
    width: auto;
  }

  .col1 .breadcrumbs-in,
  .col1 .float-area {
    width: 96%;
    margin-right: auto;
    margin-left: auto;
  }

  /*吹き出し*/
  .bubble {
    width: 70%;
  }

  .talker {
    width: 25%;
  }

  .bubble .bubble-in:after,
  .bubble .bubble-in:before {
    top: 30px;
  }

  .together .bubble,
  .together .talker {
    width: 100%;
  }

  .together .talker b {
    max-width: 25%;
  }

  .ranking-list04 .rank-box,
  .ranking-list05 .rank-box,
  .post-list01 .post-box,
  .post-list02 .post-box {
    width: 100%;
  }

  .col1 .ranking-list05 .rank-box,
  .col1 .post-list02 .post-box {
    width: 320px;
  }
} /*解像度1200px以下*/

@media (max-width: 1024px) {
  body {
    margin-top: 70px !important;
  }
  .hidden-xs {
    display: none;
  }
}

@media (max-width: 950px) {
  .left,
  .right {
    float: none;
    margin-right: 0;
    margin-left: 0;
    /*		text-align: center;*/
  }

  #free .right,
  .voice-headshot.right {
    min-width: auto;
    width: 100%;
    box-sizing: border-box;
    margin-left: 0;
  }
  #free .right img,
  .voice-headshot.right img {
    width: 100%;
  }
  #free .left,
  .left.voice-content {
    width: 100%;
    box-sizing: border-box;
    margin-right: 0;
  }
  .content ul,
  .content ol {
    padding: 0 15px 15px 15px !important;
  }

  .customers-box .img-box {
    width: 100%;
  }
  .customers-box .voice-box {
    width: 100%;
    margin: 0 10px 10px 0px;
  }
  .customers-voice.voice-box:after,
  .customers-voice.voice-box:before {
    content: none;
  }
  .copyright p {
    font-size: 12px;
  }
  .customers-box .img-box img {
    width: 90px;
  }
  .site-footer-in {
    text-align: left;
  }
  .site-footer-in span {
    display: block;
  }
}

/*--------------------------------------------------------
解像度737px以上950px以下
--------------------------------------------------------*/
@media (min-width: 737px) and (max-width: 950px) {
  /*ランキング*/
  .col2 .sub-conts .ranking-list03 .rank-thumb,
  .col2r .sub-conts .ranking-list03 .rank-thumb,
  .col2 .comparative-list01 .rank-thumb,
  .col2 .comparative-list02 .rank-thumb,
  .col2r .comparative-list01 .rank-thumb,
  .col2r .comparative-list02 .rank-thumb {
    float: none;
  }

  .col2 .comparative-list01 .rank-thumb,
  .col2 .comparative-list02 .rank-thumb,
  .col2r .comparative-list01 .rank-thumb,
  .col2r .comparative-list02 .rank-thumb {
    display: inline-block;
  }

  .col1 .ranking-list04 li,
  .col1 .ranking-list05 li,
  .col1 .post-list01 li,
  .col1 .post-list02 li {
    display: block;
    margin-right: auto;
    margin-left: auto;
  }

  .col1 .ranking-list04 .rank-box,
  .col1 .ranking-list05 .rank-box,
  .col1 .post-list01 .post-box,
  .col1 .post-list02 .post-box {
    width: 320px;
  }

  .col1 .banner-list li {
    display: list-item;
    margin-left: 0;
  }
} /*解像度737px以上950px以下*/

/*--------------------------------------------------------
解像度736px以下
--------------------------------------------------------*/
@media only screen and (max-width: 736px) {
  html,
  body,
  .containr {
    min-width: 0;
    font-size: 95%;
  }

  html {
    overflow-x: hidden;
    overflow-y: scroll;
  }

  html,
  body {
    width: 100%;
    -webkit-text-size-adjust: 100%;
    -ms-text-size-adjust: 100%;
  }

  textarea,
  input {
    max-width: 95%;
  }

  input[type="submit"],
  input[type="image"],
  input[type="reset"],
  input[type="button"],
  input[type="file"] {
    max-width: none;
  }

  blockquote {
    position: relative;
    margin: 2em 0;
    padding: 115px 20px 80px;
    background: #eee;
  }

  .site-header-in,
  .global-nav-in,
  .main-body-in,
  .site-footer-in {
    width: 100%;
  }

  .col2 .main-conts,
  .col2 .sub-conts,
  .col2r .main-conts,
  .col2r .sub-conts {
    float: none;
    width: auto;
  }

  /*ヘッダー*/
  .site-header-conts,
  .site-title,
  .header-box {
    display: block;
  }

  .header-box {
    margin-top: 15px;
  }

  .site-header-conts {
    padding-top: 50px;
  }

  .no-gn .site-header-conts {
    padding-top: 0;
  }

  .site-header-conts {
    padding-bottom: 10px;
  }

  .site-title {
    padding: 0;
    font-size: 1.4em;
  }

  .normal-screen .site-title {
    font-size: 2em;
  }

  .normal-screen .lp-catch {
    padding: 15px 15px 0;
    font-size: 1em;
  }

  .header-box {
    margin-left: 0;
    text-align: center;
  }

  .site-header-in {
    position: relative;
    padding-bottom: 1em;
  }

  /*グローバルナビ*/
  .global-nav {
    position: absolute;
    top: 0;
    width: 100%;
    margin: 0;
    border: 0;
  }

  .global-nav ul {
    display: none;
    position: absolute;
    top: 50px;
    left: 10px;
    z-index: 50;
    width: 80%;
    border: 0;
    background: #666;
  }

  .global-nav-panel {
    display: block;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding: 10px;
    background: #333;
    color: #fff;
    cursor: pointer;
  }

  .global-nav-in li {
    display: list-item;
    width: auto;
    border-right: 0;
    border-bottom: 1px solid #999;
    text-align: left;
  }

  .global-nav-in li ul {
    position: static;
    width: auto;
    margin-left: 1em;
  }

  .global-nav-in li ul li {
    width: auto;
    border-bottom: 0;
  }

  .global-nav-in li a,
  .global-nav li ul li a {
    padding: 1em;
    padding-right: 2em;
    background: url(../images/icon/icon-gn-arw.png) right center no-repeat;
  }

  /*Retina（高解像度）ディスプレイ用*/
  @media screen and (-webkit-min-device-pixel-ratio: 2), (min-resolution: 2dppx) {
    .global-nav-in li a,
    .global-nav li ul li a {
      background: url(../images/icon/icon-gn-arw@2x.png) right center no-repeat;
      -webkit-background-size: 27px 18px;
      background-size: 27px 18px;
    }
  }

  /*--------------------------------------------------------
	メインビジュアル
	--------------------------------------------------------*/

  .main-image-in-text-cont {
    padding: 1em;
  }

  .main-copy {
    margin-bottom: 10px;
    font-size: 2em;
    text-align: center;
  }

  .sub-copy {
    font-size: 1em;
  }

  .section-wrap,
  .col1 .section-wrap.wide {
    padding: 0;
    border: 0;
  }

  .col1 .section-wrap {
    padding: 0;
  }

  .section-wrap .section-in,
  .col1 .section-wrap.wide .section-in,
  .float-area,
  .col1 .float-area {
    padding: 15px;
  }

  .col1 .sub-conts .section-wrap .section-in {
    padding: 0 20px 30px;
  }

  .section-wrap .section-in .section-title,
  .section-wrap .article-header .section-title {
    margin: -15px -15px 0;
    padding: 15px;
    font-size: 1.75em;
  }

  .sub-conts .section-wrap .section-in .section-title,
  .sub-conts .section-wrap .article-header .section-title,
  .col1 .sub-conts .section-wrap .section-in .section-title,
  .col1 .sub-conts .section-wrap .article-header .section-title {
    margin: 0 -20px 30px;
    padding: 10px 18px;
  }

  .main-body h1 {
    margin: 0;
    padding: 0;
  }
  .main-body h2,
  .main-body h3,
  .main-body h4,
  .main-body h5,
  .main-body h6 {
    margin: 35px 0 20px;
  }

  .main-body h1,
  .main-body h2,
  .main-body .h2 {
    font-size: 1.2em;
  }

  /*パンくずリスト*/
  .breadcrumbs-in {
    margin-bottom: 1em;
    padding: 0 1em;
  }

  .breadcrumbs-in li:last-child {
    display: none;
  }

  .col1 .breadcrumbs-in {
    width: auto;
  }

  /*フッターナビ*/
  .site-footer-nav {
    display: block;
    text-align: left;
  }

  .site-footer-nav li,
  .site-footer-nav li:first-child {
    display: list-item;
    margin-left: 20px;
  }

  /*コピーライト*/
  .copyright {
    /*text-align: left;*/
    padding-top: 15px;
    padding-right: 15px;
    padding-left: 15px;
  }
  .page-top {
    display: none;
    position: fixed;
    right: -13px;
    bottom: 12px;
    z-index: 99;
    line-height: 1.2;
    margin-bottom: 0;
  }
  .page-top img {
    width: 30px;
  }

  /*最新情報*/
  .news .news-thumb {
    float: none;
    text-align: center;
  }

  .main-body .news-title {
    font-size: 1.25em;
  }

  /*テーブル（左端がth、右側がtdの場合にスマホ表示で立て並びに変化）*/
  .table-block,
  .table-block thead,
  .table-block tbody,
  .table-block tfoot,
  .table-block tr,
  .table-block th,
  .table-block td {
    display: block;
  }

  .table-block {
    border-bottom: 1px solid #959595;
  }

  .table-block th,
  .table-block td {
    float: left;
    width: 100% !important;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
  }

  .table-block:after {
    content: "";
    display: block;
    clear: both;
    height: 0;
  }

  .table-block01,
  .table-block01 thead,
  .table-block01 tbody,
  .table-block01 tfoot,
  .table-block01 tr,
  .table-block01 th,
  .table-block01 td {
    display: block;
  }

  .table-block01 th,
  .table-block01 td {
    float: left;
    width: 100% !important;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
  }
  .table-block01:after {
    content: "";
    display: block;
    clear: both;
    height: 0;
  }
  .table-scroll:before {
    content: "※はみ出ている場合、横にスクロールできます。";
  }

  /*バナーエリア*/
  .banner-list li {
    text-align: center;
  }

  .banner-list li,
  .col1 .banner-list li,
  .main-conts .banner-list li {
    display: list-item;
    margin-left: 0;
  }

  /*ボタン*/
  .btn-area {
    text-align: center;
  }

  .btn {
    float: none;
    margin-right: 0;
    margin-left: 0;
  }

  .btn-green,
  .btn-blue,
  .btn-orange,
  .btn-red {
    padding: 15px;
  }

  .btn-form01 {
    padding: 20px 30px;
  }

  .btn-form02 {
    padding: 25px 10px;
  }

  /*ソーシャルボタン*/
  .sns-list li {
    margin-right: 1em;
    margin-left: 0;
  }

  /*登場人物紹介２*/
  .col1 .cast-box02 .cast {
    min-height: 0;
    padding-top: 210px;
  }

  .col1 .cast-box02 .cast-name,
  .col1 .cast-box02 .cast-profile {
    padding-left: 0;
  }

  .col1 .cast-box02 .cast .cast-headshot {
    width: 100%;
  }

  /*ランキング*/
  .rank-thumb {
    float: none;
  }

  .sub-conts .ranking-list03 .rank-thumb,
  .col2 .sub-conts .ranking-list03 .rank-thumb,
  .col2r .sub-conts .ranking-list03 .rank-thumb {
    float: left;
  }

  .col1 .ranking-list04 li,
  .col1 .ranking-list05 li,
  .col1 .post-list01 li,
  .col1 .post-list02 li {
    display: block;
    margin-right: auto;
    margin-left: auto;
  }

  .comparative-list01 .rank-thumb,
  .comparative-list02 .rank-thumb {
    display: inline-block;
    float: none;
  }

  .ranking-list04 .rank-box,
  .ranking-list05 .rank-box,
  .post-list01 .post-box,
  .post-list02 .post-box {
    width: 320px;
  }

  /*関連記事*/
  .related-articles-thumbs02 li {
    float: none;
    width: auto;
    margin-left: 0;
  }

  .eye-catch {
    float: none;
    margin: 0 0 1em;
    text-align: center;
  }

  .hidden-xs {
    display: none;
  }
  .voice-box {
    padding: 1em 1em 2em 1em;
  }
  .iframe-section {
    padding: 10px !important;
  }
  .border-boxb {
    margin: 30px 0px 20px 0px;
    padding: 20px 3px;
  }
  .site-footer-in {
    text-align: left;
  }
  .site-footer-in span {
    display: block;
  }
} /*解像度736px以下*/

/*--------------------------------------------------------
解像度480px以下
--------------------------------------------------------*/
/* CSSでレスポンシブ対応 */
@media screen and (max-width: 560px) {
  .dl-style01 dt {
    float: none;
    padding-bottom: 0px;
    width: 100%;
  }
  .dl-style01 dd {
    padding-left: 20px;
    border-bottom: 1px dotted #909090;
  }
} /*解像度560px以下*/

@media only screen and (max-width: 480px) {
  /*段組*/
  .col4-wrap,
  .col3-wrap,
  .col2-wrap {
    margin: 0 0 1em;
  }

  .col4-wrap .col,
  .col4-wrap .col_2of4,
  .col4-wrap .col_3of4,
  .col3-wrap .col,
  .col3-wrap .col_2of3,
  .col2-wrap .col {
    float: none;
    margin-left: 0;
  }

  .col4-wrap .col,
  .col4-wrap .col_2of4,
  .col4-wrap .col_3of4,
  .col3-wrap .col,
  .col3-wrap .col_2of3,
  .col2-wrap .col {
    width: auto;
  }

  .left,
  .right {
    float: none;
    margin-right: 0;
    margin-left: 0;
    /*		text-align: center;*/
  }

  #free .right,
  .voice-headshot.right {
    width: 100%;
    box-sizing: border-box;
    margin-left: 0;
  }
  #free .left,
  .left.voice-content {
    width: 100%;
    box-sizing: border-box;
    margin-right: 0;
  }

  .ranking-list04 .rank-box,
  .ranking-list05 .rank-box,
  .post-list01 .post-box,
  .post-list02 .post-box,
  .col1 .ranking-list05 .rank-box,
  .col1 .post-list02 .post-box {
    width: 100%;
  }
  .hidden-xs {
    display: none;
  }

  .br-sp {
    display: none;
  }
} /*解像度480px以下*/