@charset "UTF-8";

/* * {
  font-family: 'Noto Sans SC', 'PingFang SC', 'Microsoft YaHei', sans-serif;
} */

a:hover {
  opacity: 0.8;
  -webkit-filter: alpha(opacity=80);
  filter: alpha(opacity=80);
  -moz-transition: 0.3s;
  -o-transition: 0.3s;
  -webkit-transition: 0.3s;
  transition: 0.3s;
}

a:hover img {
  opacity: 0.8;
  -webkit-filter: alpha(opacity=80);
  filter: alpha(opacity=80);
  -moz-transition: 0.3s;
  -o-transition: 0.3s;
  -webkit-transition: 0.3s;
  transition: 0.3s;
}

.clear {
  clear: both;
}

.clearfix:after {
  content: " ";
  /* 新しい要素を作る */
  display: block;
  /* ブロックレベル要素に */
  clear: both;
  height: 0;
  visibility: hidden;
}

.clearfix {
  min-height: 1px;
}

* html .clearfix {
  height: 1px;
  /*¥*/
  /*/
height: auto;
overflow: hidden;
/**/
}

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

.brt-none {
  border-top: none !important;
}

.brb-none {
  border-bottom: none !important;
}

.border-solid-glay {
  width: 700px;
  border-bottom: solid 1px #ccc;
  margin-bottom: 10px;
  margin-left: 20px;
  padding-top: 30px;
}

.border-solid-glay {
  width: 100%;
  display: block;
  height: 1px;
  border-bottom: solid 1px #ccc;
  margin: 0 0 15px 0;
  padding: 15px 0 0 0;
}

/* =========================================================
　フォント
========================================================= */
/* font-family
--------------------------------------------------------- */
.ff-bass {
  font-family: "KaiTi", "SimSun", "sans-serif";
}

.ff-sh {
  font-family: "SimHei", "sans-serif";
}

.ff-my {
  font-family: "Microsoft YaHei", sans-serif;
}

.ff-mj {
  font-family: "Microsoft JhengHei", "sans-serif";
}

.ff-ja {
  font-family: "游ゴシック Medium", "游ゴシック体", "Yu Gothic Medium", YuGothic,
    "ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo,
    "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}

/* fotn-style
--------------------------------------------------------- */
.fw-b {
  font-weight: bold;
}

/* font-size
--------------------------------------------------------- */
.fs07 {
  font-size: 0.7em !important;
}

.fs075 {
  font-size: 0.75em !important;
}

.fs08 {
  font-size: 0.8em !important;
}

.fs085 {
  font-size: 0.85em !important;
}

.fs09 {
  font-size: 0.9em !important;
}

.fs095 {
  font-size: 0.95em !important;
}

.fs10 {
  font-size: 1em !important;
}

.fs12 {
  font-size: 1.2em !important;
}

.fs15 {
  font-size: 1.5em !important;
}

/* font-color
--------------------------------------------------------- */
.fc-red {
  color: #f00;
}

.fc-red-bold {
  color: #f00;
  font-weight: bold;
}

.fc-blue-bold {
  color: #003399;
  font-weight: bold;
}

.fc-orange {
  color: #f25f0f;
}

.fc-orange-bold {
  color: #f25f0f;
  font-weight: bold;
}

.fc-black {
  color: #000;
}

/* text-align
--------------------------------------------------------- */
.t-r {
  text-align: right;
}

.t-l {
  text-align: left;
}

.t-c {
  text-align: center;
}

/* light-height
--------------------------------------------------------- */
.lh-11 {
  line-height: 1.1em;
}

.lh-12 {
  line-height: 1.2em;
}

.lh-13 {
  line-height: 1.3em;
}

.lh-14 {
  line-height: 1.4em;
}

.lh-15 {
  line-height: 1.5em;
}

.lh-16 {
  line-height: 1.6em;
}

.lh-17 {
  line-height: 1.7em;
}

.lh-18 {
  line-height: 1.8em;
}

.lh-19 {
  line-height: 1.9em;
}

.lh-20 {
  line-height: 2em;
}

.lh-25 {
  line-height: 2.5em;
}

.lh-30 {
  line-height: 3em;
}

/* margin
--------------------------------------------------------- */
/* ----- 0-100 ---- */
.mt0 {
  margin-top: 0px !important;
}

.mb0 {
  margin-bottom: 0px !important;
}

.ml0 {
  margin-left: 0px !important;
}

.mr0 {
  margin-right: 0px !important;
}

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

.mb5 {
  margin-bottom: 5px !important;
}

.ml5 {
  margin-left: 5px !important;
}

.mr5 {
  margin-right: 5px !important;
}

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

.mb10 {
  margin-bottom: 10px !important;
}

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

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

.mt15 {
  margin-top: 15px !important;
}

.mb15 {
  margin-bottom: 15px !important;
}

.ml15 {
  margin-left: 15px !important;
}

.mr15 {
  margin-right: 15px !important;
}

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

.mb20 {
  margin-bottom: 20px !important;
}

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

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

.mt25 {
  margin-top: 25px !important;
}

.mb25 {
  margin-bottom: 25px !important;
}

.ml25 {
  margin-left: 25px !important;
}

.mr25 {
  margin-right: 25px !important;
}

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

.mb30 {
  margin-bottom: 30px !important;
}

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

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

.mt35 {
  margin-top: 35px !important;
}

.mb35 {
  margin-bottom: 35px !important;
}

.ml35 {
  margin-left: 35px !important;
}

.mr35 {
  margin-right: 35px !important;
}

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

.mb40 {
  margin-bottom: 40px !important;
}

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

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

.mt45 {
  margin-top: 45px !important;
}

.mb45 {
  margin-bottom: 45px !important;
}

.ml45 {
  margin-left: 45px !important;
}

.mr45 {
  margin-right: 45px !important;
}

.mt50 {
  margin-top: 50px !important;
}

.mb50 {
  margin-bottom: 50px !important;
}

.ml50 {
  margin-left: 50px !important;
}

.mr50 {
  margin-right: 50px !important;
}

.mt55 {
  margin-top: 55px !important;
}

.mb55 {
  margin-bottom: 55px !important;
}

.ml55 {
  margin-left: 55px !important;
}

.mr55 {
  margin-right: 55px !important;
}

.mt60 {
  margin-top: 60px !important;
}

.mb60 {
  margin-bottom: 60px !important;
}

.ml60 {
  margin-left: 60px !important;
}

.mr60 {
  margin-right: 60px !important;
}

.mt65 {
  margin-top: 65px !important;
}

.mb65 {
  margin-bottom: 65px !important;
}

.ml65 {
  margin-left: 65px !important;
}

.mr65 {
  margin-right: 65px !important;
}

.mt70 {
  margin-top: 70px !important;
}

.mb70 {
  margin-bottom: 70px !important;
}

.ml70 {
  margin-left: 70px !important;
}

.mr70 {
  margin-right: 70px !important;
}

.mt75 {
  margin-top: 75px !important;
}

.mb75 {
  margin-bottom: 75px !important;
}

.ml75 {
  margin-left: 75px !important;
}

.mr75 {
  margin-right: 75px !important;
}

.mt80 {
  margin-top: 80px !important;
}

.mb80 {
  margin-bottom: 80px !important;
}

.ml80 {
  margin-left: 80px !important;
}

.mr80 {
  margin-right: 80px !important;
}

.mt85 {
  margin-top: 85px !important;
}

.mb85 {
  margin-bottom: 85px !important;
}

.ml85 {
  margin-left: 85px !important;
}

.mr85 {
  margin-right: 85px !important;
}

.mt90 {
  margin-top: 90px !important;
}

.mb90 {
  margin-bottom: 90px !important;
}

.ml90 {
  margin-left: 90px !important;
}

.mr90 {
  margin-right: 90px !important;
}

.mt95 {
  margin-top: 95px !important;
}

.mb95 {
  margin-bottom: 95px !important;
}

.ml95 {
  margin-left: 95px !important;
}

.mr95 {
  margin-right: 95px !important;
}

.mt100 {
  margin-top: 100px !important;
}

.mb100 {
  margin-bottom: 100px !important;
}

.ml100 {
  margin-left: 100px !important;
}

.mr100 {
  margin-right: 100px !important;
}

/*　margin-top & margin-bottom　*/
.mtb0 {
  margin-top: 0px !important;
  margin-bottom: 0px !important;
}

.mtb5 {
  margin-top: 5px !important;
  margin-bottom: 5px !important;
}

.mtb10 {
  margin-top: 10px !important;
  margin-bottom: 10px !important;
}

.mtb15 {
  margin-top: 15px !important;
  margin-bottom: 15px !important;
}

.mtb20 {
  margin-top: 20px !important;
  margin-bottom: 20px !important;
}

.mtb25 {
  margin-top: 25px !important;
  margin-bottom: 25px !important;
}

.mtb30 {
  margin-top: 30px !important;
  margin-bottom: 30px !important;
}

.mtb35 {
  margin-top: 35px !important;
  margin-bottom: 35px !important;
}

.mtb40 {
  margin-top: 40px !important;
  margin-bottom: 40px !important;
}

.mtb45 {
  margin-top: 45px !important;
  margin-bottom: 45px !important;
}

.mtb50 {
  margin-top: 50px !important;
  margin-bottom: 50px !important;
}

/* margin-left & margin-right　*/
.mlr25 {
  margin-left: 25px !important;
  margin-right: 25px !important;
}

.mlr30 {
  margin-left: 30px !important;
  margin-right: 30px !important;
}

.mlr35 {
  margin-left: 35px !important;
  margin-right: 35px !important;
}

.mlr40 {
  margin-left: 40px !important;
  margin-right: 40px !important;
}

.mlr45 {
  margin-left: 45px !important;
  margin-right: 45px !important;
}

.mlr50 {
  margin-left: 50px !important;
  margin-right: 50px !important;
}

/* margin-all　*/
.ma0 {
  margin: 0px !important;
}

.ma5 {
  margin: 5px !important;
}

.ma10 {
  margin: 10px !important;
}

.ma15 {
  margin: 15px !important;
}

.ma20 {
  margin: 20px !important;
}

.ma25 {
  margin: 25px !important;
}

.ma30 {
  margin: 30px !important;
}

.ma35 {
  margin: 35px !important;
}

.ma40 {
  margin: 40px !important;
}

.ma45 {
  margin: 45px !important;
}

.ma50 {
  margin: 50px !important;
}

.ma55 {
  margin: 55px !important;
}

.ma60 {
  margin: 60px !important;
}

.ma65 {
  margin: 65px !important;
}

.ma70 {
  margin: 70px !important;
}

.ma75 {
  margin: 75px !important;
}

.ma80 {
  margin: 80px !important;
}

.ma85 {
  margin: 85px !important;
}

.ma90 {
  margin: 90px !important;
}

.ma95 {
  margin: 95px !important;
}

.ma100 {
  margin: 100px !important;
}

/* padding
--------------------------------------------------------- */
/* ----- 0-100 ---- */
.pt0 {
  padding-top: 0px !important;
}

.pb0 {
  padding-bottom: 0px !important;
}

.pl0 {
  padding-left: 0px !important;
}

.pr0 {
  padding-right: 0px !important;
}

.pt5 {
  padding-top: 5px !important;
}

.pb5 {
  padding-bottom: 5px !important;
}

.pl5 {
  padding-left: 5px !important;
}

.pr5 {
  padding-right: 5px !important;
}

.pt10 {
  padding-top: 10px !important;
}

.pb10 {
  padding-bottom: 10px !important;
}

.pl10 {
  padding-left: 10px !important;
}

.pr10 {
  padding-right: 10px !important;
}

.pt15 {
  padding-top: 15px !important;
}

.pb15 {
  padding-bottom: 15px !important;
}

.pl15 {
  padding-left: 15px !important;
}

.pr15 {
  padding-right: 15px !important;
}

.pt20 {
  padding-top: 20px !important;
}

.pb20 {
  padding-bottom: 20px !important;
}

.pl20 {
  padding-left: 20px !important;
}

.pr20 {
  padding-right: 20px !important;
}

.pt25 {
  padding-top: 25px !important;
}

.pb25 {
  padding-bottom: 25px !important;
}

.pl25 {
  padding-left: 25px !important;
}

.pr25 {
  padding-right: 25px !important;
}

.pt30 {
  padding-top: 30px !important;
}

.pb30 {
  padding-bottom: 30px !important;
}

.pl30 {
  padding-left: 30px !important;
}

.pr30 {
  padding-right: 30px !important;
}

.pt35 {
  padding-top: 35px !important;
}

.pb35 {
  padding-bottom: 35px !important;
}

.pl35 {
  padding-left: 35px !important;
}

.pr35 {
  padding-right: 35px !important;
}

.pt40 {
  padding-top: 40px !important;
}

.pb40 {
  padding-bottom: 40px !important;
}

.pl40 {
  padding-left: 40px !important;
}

.pr40 {
  padding-right: 40px !important;
}

.pt45 {
  padding-top: 45px !important;
}

.pb45 {
  padding-bottom: 45px !important;
}

.pl45 {
  padding-left: 45px !important;
}

.pr45 {
  padding-right: 45px !important;
}

.pt50 {
  padding-top: 50px !important;
}

.pb50 {
  padding-bottom: 50px !important;
}

.pl50 {
  padding-left: 50px !important;
}

.pr50 {
  padding-right: 50px !important;
}

.pt55 {
  padding-top: 55px !important;
}

.pb55 {
  padding-bottom: 55px !important;
}

.pl55 {
  padding-left: 55px !important;
}

.pr55 {
  padding-right: 55px !important;
}

.pt60 {
  padding-top: 60px !important;
}

.pb60 {
  padding-bottom: 60px !important;
}

.pl60 {
  padding-left: 60px !important;
}

.pr60 {
  padding-right: 60px !important;
}

.pt65 {
  padding-top: 65px !important;
}

.pb65 {
  padding-bottom: 65px !important;
}

.pl65 {
  padding-left: 65px !important;
}

.pr65 {
  padding-right: 65px !important;
}

.pt70 {
  padding-top: 70px !important;
}

.pb70 {
  padding-bottom: 70px !important;
}

.pl70 {
  padding-left: 70px !important;
}

.pr70 {
  padding-right: 70px !important;
}

.pt75 {
  padding-top: 75px !important;
}

.pb75 {
  padding-bottom: 75px !important;
}

.pl75 {
  padding-left: 75px !important;
}

.pr75 {
  padding-right: 75px !important;
}

.pt80 {
  padding-top: 80px !important;
}

.pb80 {
  padding-bottom: 80px !important;
}

.pl80 {
  padding-left: 80px !important;
}

.pr80 {
  padding-right: 80px !important;
}

.pt85 {
  padding-top: 85px !important;
}

.pb85 {
  padding-bottom: 85px !important;
}

.pl85 {
  padding-left: 85px !important;
}

.pr85 {
  padding-right: 85px !important;
}

.pt90 {
  padding-top: 90px !important;
}

.pb90 {
  padding-bottom: 90px !important;
}

.pl90 {
  padding-left: 90px !important;
}

.pr90 {
  padding-right: 90px !important;
}

.pt95 {
  padding-top: 95px !important;
}

.pb95 {
  padding-bottom: 95px !important;
}

.pl95 {
  padding-left: 95px !important;
}

.pr95 {
  padding-right: 95px !important;
}

.pt100 {
  padding-top: 100px !important;
}

.pb100 {
  padding-bottom: 100px !important;
}

.pl100 {
  padding-left: 100px !important;
}

.pr100 {
  padding-right: 100px !important;
}

/*　padding-top & padding-bottom　*/
.ptb0 {
  padding-top: 0px !important;
  padding-bottom: 0px !important;
}

.ptb5 {
  padding-top: 5px !important;
  padding-bottom: 5px !important;
}

.ptb10 {
  padding-top: 10px !important;
  padding-bottom: 10px !important;
}

.ptb15 {
  padding-top: 15px !important;
  padding-bottom: 15px !important;
}

.ptb20 {
  padding-top: 20px !important;
  padding-bottom: 20px !important;
}

.ptb25 {
  padding-top: 25px !important;
  padding-bottom: 25px !important;
}

.ptb30 {
  padding-top: 30px !important;
  padding-bottom: 30px !important;
}

.ptb35 {
  padding-top: 35px !important;
  padding-bottom: 35px !important;
}

.ptb40 {
  padding-top: 40px !important;
  padding-bottom: 40px !important;
}

.ptb45 {
  padding-top: 45px !important;
  padding-bottom: 45px !important;
}

.ptb50 {
  padding-top: 50px !important;
  padding-bottom: 50px !important;
}

/* padding-left & padding-right　*/
.plr25 {
  padding-left: 25px !important;
  padding-right: 25px !important;
}

.plr30 {
  padding-left: 30px !important;
  padding-right: 30px !important;
}

.plr35 {
  padding-left: 35px !important;
  padding-right: 35px !important;
}

.plr40 {
  padding-left: 40px !important;
  padding-right: 40px !important;
}

.plr45 {
  padding-left: 45px !important;
  padding-right: 45px !important;
}

.plr50 {
  padding-left: 50px !important;
  padding-right: 50px !important;
}

/* padding-all　*/
.pa0 {
  padding: 0px !important;
}

.pa5 {
  padding: 5px !important;
}

.pa10 {
  padding: 10px !important;
}

.pa15 {
  padding: 15px !important;
}

.pa20 {
  padding: 20px !important;
}

.pa25 {
  padding: 25px !important;
}

.pa30 {
  padding: 30px !important;
}

.pa35 {
  padding: 35px !important;
}

.pa40 {
  padding: 40px !important;
}

.pa45 {
  padding: 45px !important;
}

.pa50 {
  padding: 50px !important;
}

.pa55 {
  padding: 55px !important;
}

.pa60 {
  padding: 60px !important;
}

.pa65 {
  padding: 65px !important;
}

.pa70 {
  padding: 70px !important;
}

.pa75 {
  padding: 75px !important;
}

.pa80 {
  padding: 80px !important;
}

.pa85 {
  padding: 85px !important;
}

.pa90 {
  padding: 90px !important;
}

.pa95 {
  padding: 95px !important;
}

.pa100 {
  padding: 100px !important;
}

/* float
--------------------------------------------------------- */
.f-r {
  float: right;
}

.f-l {
  float: left;
}

/* display
--------------------------------------------------------- */
.dsp-b {
  display: block !important;
}

.dsp-n {
  display: none !important;
}

/* vertical-align
--------------------------------------------------------- */
.vta-t {
  vertical-align: top !important;
}

.vta-m {
  vertical-align: middle !important;
}

.vta-b {
  vertical-align: bottom !important;
}

/* hover
----mouse----------------------------------------------------- */
.mouse-on:hover {
  opacity: 0.7;
  filter: alpha(opacity=70);
  /* ie */
  -ms-filter: "alpha( opacity=70 )";
  /* ie */
}

html,
body,
div,
applet,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
a,
abbr,
acronym,
address,
big,
cite,
code,
del,
dfn,
em,
font,
img,
ins,
kbd,
q,
s,
samp,
small,
strike,
strong,
sub,
sup,
tt,
var,
b,
u,
i,
center,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  font-size: 100%;
  vertical-align: middle;
  background: transparent;
}

body {
  line-height: 1;
  position: relative;
}

ol,
ul {
  list-style: none;
}

blockquote,
q {
  quotes: none;
}

blockquote:before,
blockquote:after,
q:before,
q:after {
  content: "";
  content: none;
}

/* remember to define focus styles! */
:focus {
  outline: 0;
}

/* remember to highlight inserts somehow! */
ins {
  text-decoration: none;
}

del {
  text-decoration: line-through;
}

/* tables still need 'cellspacing="0"' in the markup */
table {
  border-collapse: collapse;
  border-spacing: 0;
}

/* CSS Document */
a {
  text-decoration: none;
  /* vertical-align: bottom; */
}

/* =========================================================

fancy_box

========================================================= */
/*! fancyBox v2.1.5 fancyapps.com | fancyapps.com/fancybox/#license */
.fancybox-wrap,
.fancybox-skin,
.fancybox-outer,
.fancybox-inner,
.fancybox-image,
.fancybox-wrap iframe,
.fancybox-wrap object,
.fancybox-nav,
.fancybox-nav span,
.fancybox-tmp {
  padding: 0;
  margin: 0;
  border: 0;
  outline: none;
  vertical-align: top;
}

.fancybox-wrap {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 8020;
}

.fancybox-skin {
  position: relative;
  background: #f9f9f9;
  color: #444;
  text-shadow: none;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
}

.fancybox-opened {
  z-index: 8030;
}

.fancybox-opened .fancybox-skin {
  -webkit-box-shadow: 0 10px 25px rgba(0, 0, 0, 0.5);
  -moz-box-shadow: 0 10px 25px rgba(0, 0, 0, 0.5);
  box-shadow: 0 10px 25px rgba(0, 0, 0, 0.5);
}

.fancybox-outer,
.fancybox-inner {
  position: relative;
}

.fancybox-inner {
  overflow: hidden;
}

.fancybox-type-iframe .fancybox-inner {
  -webkit-overflow-scrolling: touch;
}

.fancybox-error {
  color: #444;
  font: 14px/20px "Helvetica Neue", Helvetica, Arial, sans-serif;
  margin: 0;
  padding: 15px;
  white-space: nowrap;
}

.fancybox-image,
.fancybox-iframe {
  display: block;
  width: 100%;
  height: 100%;
}

.fancybox-image {
  max-width: 100%;
  max-height: 100%;
}

#fancybox-loading,
.fancybox-close,
.fancybox-prev span,
.fancybox-next span {
  background-image: url("../images/fancy_box/fancybox_sprite.png");
}

#fancybox-loading {
  position: fixed;
  top: 50%;
  left: 50%;
  margin-top: -22px;
  margin-left: -22px;
  background-position: 0 -108px;
  opacity: 0.8;
  cursor: pointer;
  z-index: 8060;
}

#fancybox-loading div {
  width: 44px;
  height: 44px;
  background: url("../images/fancy_box/fancybox_loading.gif") center center
    no-repeat;
}

.fancybox-close {
  position: absolute;
  top: -18px;
  right: -18px;
  width: 36px;
  height: 36px;
  cursor: pointer;
  z-index: 8040;
}

.fancybox-nav {
  position: absolute;
  top: 0;
  width: 40%;
  height: 100%;
  cursor: pointer;
  text-decoration: none;
  background: transparent url("../images/fancy_box/blank.gif");
  /* helps IE */
  -webkit-tap-highlight-color: transparent;
  z-index: 8040;
}

.fancybox-prev {
  left: 0;
}

.fancybox-next {
  right: 0;
}

.fancybox-nav span {
  position: absolute;
  top: 50%;
  width: 36px;
  height: 34px;
  margin-top: -18px;
  cursor: pointer;
  z-index: 8040;
  visibility: hidden;
}

.fancybox-prev span {
  left: 10px;
  background-position: 0 -36px;
}

.fancybox-next span {
  right: 10px;
  background-position: 0 -72px;
}

.fancybox-nav:hover span {
  visibility: visible;
}

.fancybox-tmp {
  position: absolute;
  top: -99999px;
  left: -99999px;
  visibility: hidden;
  max-width: 99999px;
  max-height: 99999px;
  overflow: visible !important;
}

/* Overlay helper */
.fancybox-lock {
  overflow: hidden !important;
  width: auto;
}

.fancybox-lock body {
  overflow: hidden !important;
}

.fancybox-lock-test {
  overflow-y: hidden !important;
}

.fancybox-overlay {
  position: absolute;
  top: 0;
  left: 0;
  overflow: hidden;
  display: none;
  z-index: 8010;
  background: url("../images/fancy_box/fancybox_overlay.png");
}

.fancybox-overlay-fixed {
  position: fixed;
  bottom: 0;
  right: 0;
}

.fancybox-lock .fancybox-overlay {
  overflow: auto;
  overflow-y: scroll;
}

/* Title helper */
.fancybox-title {
  visibility: hidden;
  font: normal 13px/20px "Helvetica Neue", Helvetica, Arial, sans-serif;
  position: relative;
  text-shadow: none;
  z-index: 8050;
}

.fancybox-opened .fancybox-title {
  visibility: visible;
}

.fancybox-title-float-wrap {
  position: absolute;
  bottom: 0;
  right: 50%;
  margin-bottom: -35px;
  z-index: 8050;
  text-align: center;
}

.fancybox-title-float-wrap .child {
  display: inline-block;
  margin-right: -100%;
  padding: 2px 20px;
  background: transparent;
  /* Fallback for web browsers that doesn't support RGBa */
  background: rgba(0, 0, 0, 0.8);
  -webkit-border-radius: 15px;
  -moz-border-radius: 15px;
  border-radius: 15px;
  text-shadow: 0 1px 2px #222;
  color: #fff;
  font-weight: bold;
  line-height: 24px;
  white-space: nowrap;
}

.fancybox-title-outside-wrap {
  position: relative;
  margin-top: 10px;
  color: #fff;
}

.fancybox-title-inside-wrap {
  padding-top: 10px;
}

.fancybox-title-over-wrap {
  position: absolute;
  bottom: 0;
  left: 0;
  color: #fff;
  padding: 10px;
  background: #000;
  background: rgba(0, 0, 0, 0.8);
}

/*Retina graphics!*/
@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
  only screen and (min--moz-device-pixel-ratio: 1.5),
  only screen and (min-device-pixel-ratio: 1.5) {
  #fancybox-loading,
  .fancybox-close,
  .fancybox-prev span,
  .fancybox-next span {
    background-image: url("../images/fancy_box/fancybox_sprite@2x.png");
    background-size: 44px 152px;
    /*The size of the normal image, half the size of the hi-res image*/
  }

  #fancybox-loading div {
    background-image: url("../images/fancy_box/fancybox_loading@2x.gif");
    background-size: 24px 24px;
    /*The size of the normal image, half the size of the hi-res image*/
  }
}

/* Magnific Popup */
.page-fixed {
  overflow: hidden !important;
}

/* =========================================================
 layout.scss
========================================================= */
/*=========================================================
■ PC版スタイルシート
 ・ページ骨組
 ・ヘッダー
 ・パンクズリスト
 ・フッター
=========================================================*/
.pc-none {
  display: none;
}

/* PC版 > ページ骨組
--------------------------------------------------------- */
body {
  background: #fff;
  width: 100%;
  min-width: 1100px;
  background-image: none;
  padding: 0px;
  margin: 0px auto;
  background-attachment: fixed;
  height: 100%;
  font-family: "KaiTi", "SimSun", "sans-serif";
}

#wrap {
  overflow: hidden;
}

#main-contents {
  border-top: 0px #111 solid;
}

* {
  box-sizing: border-box;
}

/* PC版 > ヘッダー
--------------------------------------------------------- */
#header {
  width: 100%;
  min-width: 1100px;
  padding: 5px 5px 7px;
  background: #1e1e1e;
}

#header .h-top {
  width: 1100px;
  margin: 0 auto;
  color: #333;
  text-align: right;
  font-size: 0.85em;
  line-height: 30px;
  position: relative;
  z-index: 2;
}

#header .h-top .logo a {
  margin-right: 18px;
  background: none;
  display: block;
  float: left;
  padding: 3px 0 0;
}

#header .h-top h1 {
  float: left;
  font-family: "SimHei", "sans-serif";
  font-weight: normal;
  padding: 6px 0 0;
}

#header .h-top .ff-sh {
  padding: 7px 0 0;
}

#header select:first-child {
  padding: 2px 4px;
}

/* #header{
    width: 100%;
    min-width: 1100px;
    background: #000;
    &:before{
        min-width: 1100px;
        height: 140px;
        z-index: 1;
        content:"";
        display: block;
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        background: url("../images/common/bg_washi.png");
    }
    .h-top{
        width: 1100px;
        margin: 0 auto;
        color: #fff;
        text-align: right;
        font-size: .85em;
        line-height: 30px;
        position: relative;
        z-index: 2;
        .catch{
            float: left;
        }
        a{
            margin-left: 10px;
            padding: 5px;
            color: #fff;
            background: #666;
            font-size: .85em;
            @include border-radius(10px);
        }
    }
    .h-middle{
        width: 100%;
        height: 110px;
        background: #ccc;
        .h-inner{
            width: 1100px;
            height: 110px;
            margin: 0 auto;
            background: linear-gradient(90deg,#ccc,#eee,#eee,#ccc);
            .bg-flower{
                height: 110px;
                background: url("../images/common/h_flower.png");
            }
            .logo{
                width: 240px;
                margin: 0 auto;
                a{
                    margin-top: 30px;
                    z-index: 2;
                    position: absolute;
                }
            }
        }
    }
} */
/* PC版 > グローバルナビゲーション
--------------------------------------------------------- */
#g-nav {
  width: 100%;
  min-width: 1100px;
  background: #1e1e1e;
  position: relative;
  z-index: 100;
  position: fixed;
}

/* header固定調整 */
#illust,
#narration,
#sound,
#movie,
#promotion,
#works,
#faq,
#access,
#company,
#privacy_policy,
#site-map,
#works-illust,
#illust-character,
#illust-design,
#portfolio,
.portfolio-sub {
  padding: 70px 0 0;
}

#g-nav .gnv-inner {
  display: flex;
  justify-content: flex-end;
}

#g-nav .gnv-inner ul {
  display: flex;
}

#g-nav .gnv-inner ul li {
  width: 106px;
  height: 70px;
  border-left: 1px solid #5a5a5a;
  line-height: 4.2;
  font-size: 16px;
  text-align: center;
}

#g-nav .gnv-inner h1 {
  position: absolute;
  top: 4px;
  left: 18px;
}

#g-nav .gnv-inner ul li.lng-btn i {
  margin-right: 2px;
  color: #fff;
}

#g-nav .gnv-inner ul li.lng-btn select {
  background-color: #1e1e1e;
  color: #fff;
  border: 0;
  cursor: pointer;
}

#g-nav .gnv-inner ul li span {
  display: inline-block;
  margin-left: 4px;
  font-size: 14px;
  color: #fff;
  cursor: pointer;
}

#g-nav .gnv-inner .menuSub {
  display: none;
}

#g-nav .gnv-inner .menuSub li {
  border-top: 1px solid #5a5a5a;
  background: #1e1e1e;
  height: 36px;
}

#g-nav .gnv-inner .menuSub li.en {
  width: 106px;
}

#g-nav .gnv-inner .menuSub li a {
  line-height: 2.4;
  font-size: 14px;
  color: #fff !important;
}

#g-nav .gnv-inner ul li.coming-soon {
  color: #ccc;
}

#g-nav .gnv-inner ul li:last-child {
  width: 145px;
  padding: 0;
}

#g-nav .gnv-inner ul li.gnv-btn a {
  display: block;
  background: #f39700;
  line-height: 4.4;
  color: #fff;
}

#g-nav .gnv-inner ul li.gnv-btn a:hover {
  color: #fff;
  background: #333;
}

#g-nav .gnv-inner ul li a {
  display: block;
  color: #fff;
}

#g-nav .gnv-inner ul li a:hover {
  color: #8eb3ff;
}

.fa-envelope:before {
  margin-right: 6px;
}

/* PC版 > パンクズリスト
--------------------------------------------------------- */
#pankuzu {
  width: 100%;
  /* padding: 10px 0 0; */
  padding-bottom: 10px;
}

#illust #pankuzu,
#sound #pankuzu,
#narration #pankuzu,
#movie #pankuzu,
#promotion #pankuzu {
  padding: 70px 0 0;
}

#pankuzu .pankuzu-list {
  width: 1200px;
  margin: 0 auto;
  font-size: 0.9em;
  display: flex;
  justify-content: left;
  align-items: center;
}

#pankuzu .pankuzu-list li {
  float: left;
  margin: 10px 10px 0 0;
}

#pankuzu .pankuzu-list li a {
  color: #000;
  vertical-align: initial;
}

#pankuzu .pankuzu-list .current-page {
  color: #f39800;
  /* vertical-align: initial;
  text-align: center; */
  /* vertical-align: initial; */
}

#pankuzu .pankuzu-list .current-page__arrow {
  /* color: #f39800; */
  /* vertical-align: initial; */
  font-size: 1.3em;
  /* vertical-align: initial;
  text-align: center; */
}

#pankuzu .pankuzu-list li a:hover {
  color: #8eb3ff;
}

#company #pankuzu {
  width: 100%;
  padding: 0 0 10px 15px;
}

/* #illust #pankuzu,
#narration #pankuzu,
#sound #pankuzu,
#movie #pankuzu{
  background: #EFEFEF;
} */

/* PC版 > フッター
--------------------------------------------------------- */
/* =========================================================
ページトップへ
WeChat
========================================================= */
/*スマホで見た時*/
#pageTop {
  position: fixed;
  bottom: 15%;
  right: -140px;
  display: block;
  line-height: 50px;
  color: #fff;
  background: none;
  font-size: 13px;
  text-decoration: none;
  font-weight: bold;
  z-index: 20;
}

#pageTop img {
  width: 30%;
  height: auto;
  opacity: 0.9;
}

#sideContact {
  position: fixed;
  display: block;
  line-height: 2;
  bottom: 22%;
  right: -140px;
}

#sideContact img {
  width: 30%;
  height: auto;
  opacity: 0.9;
}

#chatplusview.closed.headless #outline #eye_catcher {
  right: -20px;
}

/*PCで見た時*/
@media screen and (min-width: 640px) {
  #pageTop {
    display: none;
    position: fixed;
    bottom: 22%;
    right: -100px;
    background: none;
    /* line-height: 100px; */
  }

  #pageTop img {
    width: 50%;
    height: auto;
    opacity: 0.9;
  }

  #sideContact {
    display: none;
    position: fixed;
    background: none;
    line-height: 2;
    bottom: 30%;
    right: -100px;
  }

  #sideContact img {
    width: 50%;
    height: auto;
    opacity: 0.9;
  }
  .contact-form {
    width: 100%;
    height: 1250px;
    display: block;
    min-width: 100%;
    width: 100px;
    border: none;
    overflow: auto;
    /* padding-bottom: 50px; */
  }

  #chatplusview.closed.headless #outline #eye_catcher {
    right: -45px;
  }
}

/* =========================================================
contact-form
========================================================= */
.contact-form {
  width: 100%;
  height: 1350px;
}

/* =========================================================
site-map & logo-area
========================================================= */
#footer {
  width: 100%;
}

#footer .site-map {
  background: #000;
  font-size: 1.2em;
  text-align: center;
}

#footer .site-map .sm-inner ul {
  display: flex;
  justify-content: center;
}

#footer .site-map .sm-inner ul li {
  width: 50%;
  position: relative;
}

#footer .site-map .sm-inner ul li:first-child:after {
  content: "";
  width: 1px;
  height: 100%;
  background-color: #555;
  position: absolute;
  top: 0;
  left: 100%;
}

#footer .site-map .sm-inner ul li a {
  display: block;
  color: #fff;
  line-height: 3;
  transition: 0.5s;
}

#footer .site-map .sm-inner ul li a:hover {
  background: #f39700;
  transition: 0.5s;
}

#footer .site-map .sm-inner ul li .coming-soon {
  color: #333;
}

#footer .foot-logo-area {
  width: 100%;
  background: #222;
  color: #fff;
}

#footer .foot-logo-area .foot-logo-inner {
  width: 100%;
  margin: 0 auto;
  padding: 15px 10px;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

#footer .foot-logo-area .foot-logo-inner .foot-logo {
  width: 500px;
  text-align: center;
  float: left;
}

#footer .foot-logo-area .foot-logo-inner .copyright {
  margin-top: 7px;
  font-size: 0.75em;
  color: #ccc;
  font-family: "Microsoft JhengHei", "sans-serif";
  line-height: 1.4;
}

#footer .foot-logo-area .foot-logo-inner .foot-contact {
  float: right;
}

#footer .foot-logo-area .foot-logo-inner .foot-contact a {
  font-size: 1em;
  padding: 0 50px;
  color: #fff;
  display: inline-block;
  text-align: center;
}

#footer .foot-logo-area .foot-logo-inner .foot-contact a:hover {
  color: #999;
  opacity: 0.6;
  -webkit-filter: alpha(opacity=60);
  filter: alpha(opacity=60);
  -moz-transition: 0.3s;
  -o-transition: 0.3s;
  -webkit-transition: 0.3s;
  transition: 0.3s;
}

#footer .foot-logo-area .foot-logo-inner .foot-contact a + a {
  border-left: 1px solid #555;
}

#footer .foot-logo-area .foot-logo-inner .foot-chat {
  margin: 8px 75px 0 0;
  float: right;
}

#footer .foot-logo-area .foot-logo-inner .foot-chat li {
  float: left;
}

#footer .foot-logo-area .foot-logo-inner .foot-chat li a {
  margin-left: 8px;
  padding: 11px;
  display: block;
  background: #000;
  -moz-border-radius: 10px;
  -webkit-border-radius: 10px;
  border-radius: 10px;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

#footer .foot-logo-area .foot-logo-inner .foot-chat li a:hover {
  background: #111;
}

/*=========================================================

 ・見出し
 ・共通デザインレイアウト
 ・共通HTMLパーツデザインレイアウト
 ・項目別共通レイアウト
 ・select input-type textarea
 ・微調節・細かい共通パーツ
=========================================================*/
/* ----- メインビジュアル ----- */
#main-visual {
  width: 100%;
  background: url("../images/common/main_bg_left.jpg") no-repeat;
  background-position: left top;
}

#main-visual .mv-inner {
  width: 100%;
  background: url("../images/common/main_bg_right.jpg") no-repeat;
  background-position: right top;
}

#main-visual .mv-inner p {
  text-align: center;
}

#main-visual h2 {
  font-size: 2.3em;
  padding: 25px 0;
}

/* ----- 見出し ----- */
h2.en-title {
  text-align: center;
  font-size: 2.4em;
  font-weight: bold;
  font-family: "メイリオ", "Meiryo", verdana, "ヒラギノ角ゴ Pro W3",
    "Hiragino Kaku Gothic Pro", Osaka, "ＭＳ Ｐゴシック", "MS PGothic",
    Sans-Serif;
}

h2.en-title span {
  display: block;
  margin-top: 8px;
  font-weight: normal;
  font-size: 0.5em;
}

.tit-text {
  margin-top: 15px;
  text-align: center;
  line-height: 1.8em;
  font-size: 1.1em;
}

.big-title-box {
  padding: 60px 0;
}

/* ----- キャッチ ----- */
.catch-box {
  width: 800px;
  margin: 60px auto;
  border: 1px solid #111;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

.catch-box .catch-inner {
  margin: 6px -8px -8px 6px;
  padding-bottom: 6px;
  border: 1px solid #111;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

.catch-box .catch-inner h2 {
  padding: 30px 30px;
  text-align: center;
  font-size: 1.5em;
  line-height: 1.5em;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

.catch-box .catch-inner h2.en-title {
  padding: 30px 30px 10px;
  font-size: 2em;
  font-weight: normal;
}

.catch-box .catch-inner p {
  padding: 30px 0;
  font-size: 1.5em;
  line-height: 1.5em;
  text-align: center;
}

.catch-box .catch-inner .text {
  padding: 0 0 30px;
  padding-bottom: 30px;
  text-align: center;
  line-height: 1.8em;
  font-size: 1.1em;
}

h3 {
  font-size: 1.5em;
  font-weight: normal;
}

h3 img {
  margin-right: 5px;
  vertical-align: -0.3em;
}

/* ----- 簡易説明テキスト＆リンク ----- */
.quick-instruction-left {
  width: 100%;
  background: #ccc;
  position: relative;
}

.quick-instruction-left:before {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: url("../images/common/bg_washi.png");
}

.quick-instruction-left .qkin-inner {
  width: 1100px;
  margin: 0 auto;
  padding: 40px;
  position: relative;
}

.quick-instruction-left .qkin-inner .photo {
  width: 460px;
  float: left;
}

.quick-instruction-left .qkin-inner .txt-box {
  width: 500px;
  height: 300px;
  float: right;
  position: relative;
}

.quick-instruction-left .qkin-inner .txt-box .txt-inner {
  position: absolute;
  top: 50%;
  -moz-transform: translate(0, -50%);
  -ms-transform: translate(0, -50%);
  -webkit-transform: translate(0, -50%);
  transform: translate(0, -50%);
}

.quick-instruction-left .qkin-inner .txt-box .txt-inner .tit {
  margin: 0 0 10px;
  font-size: 2em;
}

.quick-instruction-left .qkin-inner .txt-box .txt-inner .txt {
  line-height: 1.8em;
  font-size: 1.1em;
}

.quick-instruction-left .qkin-inner .txt-box .txt-inner .btn {
  width: 320px;
  margin-top: 17%;
}

.quick-instruction-left .qkin-inner .txt-box .txt-inner .btn a {
  padding: 15px 20px 15px 0;
  display: block;
  background: #000;
  color: #fff;
  font-size: 1.3em;
  text-align: center;
}

.quick-instruction-left .qkin-inner .txt-box .txt-inner .btn a:hover {
  color: #ccc;
}

.quick-instruction-left .qkin-inner .txt-box .txt-inner .btn a img {
  margin-right: 10px;
  vertical-align: -0.35em;
}

.quick-instruction-right {
  width: 100%;
}

.quick-instruction-right .qkin-inner {
  width: 1100px;
  margin: 0 auto;
  padding: 40px;
}

.quick-instruction-right .qkin-inner .photo {
  width: 460px;
  float: right;
}

.quick-instruction-right .qkin-inner .txt-box {
  width: 500px;
  height: 300px;
  float: left;
  position: relative;
}

.quick-instruction-right .qkin-inner .txt-box .txt-inner {
  position: absolute;
  top: 50%;
  -moz-transform: translate(0, -50%);
  -ms-transform: translate(0, -50%);
  -webkit-transform: translate(0, -50%);
  transform: translate(0, -50%);
}

.quick-instruction-right .qkin-inner .txt-box .txt-inner .tit {
  margin: 0 0 10px;
  font-size: 2em;
}

.quick-instruction-right .qkin-inner .txt-box .txt-inner .txt {
  line-height: 1.8em;
  font-size: 1.1em;
}

.quick-instruction-right .qkin-inner .txt-box .txt-inner .btn {
  width: 320px;
  margin-top: 4%;
}

.quick-instruction-right .qkin-inner .txt-box .txt-inner .btn a {
  padding: 15px 20px 15px 0;
  display: block;
  background: #000;
  color: #fff;
  font-size: 1.3em;
  text-align: center;
}

.quick-instruction-right .qkin-inner .txt-box .txt-inner .btn a:hover {
  color: #ccc;
}

.quick-instruction-right .qkin-inner .txt-box .txt-inner .btn a img {
  margin-right: 10px;
  vertical-align: -0.35em;
}

/* ----- 和紙風背景 ----- */
.bg-washi {
  width: 100%;
  position: relative;
}

.bg-washi:before {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: url("../images/common/bg_washi.png");
}

.bg-washi .washi-inner {
  width: 1100px;
  margin: 0 auto;
  padding: 40px 0;
  position: relative;
}

.bg-glay {
  background: #ccc;
}

.bg-dark {
  background: #111;
}

/* ----- 問合せ導線リンク ----- */
.wh-border {
  width: 800px;
  margin: 7px auto 0;
  border: 1px solid #fff;
}

.wh-border .wh-border-inner {
  margin: -8px 6px 6px -7px;
  border: 1px solid #fff;
}

.wh-border .wh-border-inner .contact-box {
  overflow: hidden;
  padding: 46px 20px 30px 26px;
  text-align: center;
}

.wh-border .wh-border-inner .contact-box .cb-txt {
  color: #fff;
  font-size: 1.8em;
}

.wh-border .wh-border-inner .contact-box .btn {
  float: left;
  width: 100%;
  margin: 20px auto 0;
}

.wh-border .wh-border-inner .contact-box .btn a {
  display: block;
  padding: 15px 20px 15px 0;
  background: #906414;
  color: #fff;
  font-size: 1.3em;
  text-align: center;
}

.wh-border .wh-border-inner .contact-box .btn.btn01 a {
  background: #906414;
  margin: 10px 0 20px -20px;
}

.wh-border .wh-border-inner .contact-box .btn.btn02 a {
  /* background: #2dc100; */
  background: #906414;
  margin: 10px 0 20px 30px;
}

.wh-border .wh-border-inner .contact-box .btn a img {
  margin-right: 10px;
  vertical-align: -0.35em;
}

.contact-box .btn a {
  display: block;
  padding: 15px 20px 15px 0;
  background: #906414;
  color: #fff;
  font-size: 1.3em;
  text-align: center;
}

.contact-box .btn a img {
  margin-right: 10px;
  vertical-align: -0.35em;
}

/* ----- 実績ピックアップリスト ----- */
#top #works-list h2,
#works #works-list h2,
#works-illust #works-list h2 {
  margin: 60px 0 20px;
  text-align: center;
  font-size: 2.3em;
  color: #1e1e1e;
}

#top #works-list .works-list-inner,
#works #works-list .works-list-inner,
#works-illust #works-list .works-list-inner {
  margin: 15px 0 0;
}

#top #works-list .works-list-inner ul,
#works #works-list .works-list-inner ul,
#works-illust #works-list .works-list-inner ul {
  width: 1210px;
  margin: 0 auto;
  display: flex;
  -js-display: flex;
  flex-wrap: wrap;
}

#top #works-list .works-list-inner ul li,
#works #works-list .works-list-inner ul li,
#works-illust #works-list .works-list-inner ul li {
  width: 230px;
  margin: 0 15px 15px 0;
  padding: 20px 10px 50px;
  background: #ffdfdf;
  float: left;
  position: relative;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

#top #works-list .works-list-inner ul li:nth-child(5n),
#works #works-list .works-list-inner ul li:nth-child(5n),
#works-illust #works-list .works-list-inner ul li:nth-child(5n) {
  margin-right: 0;
}

#top #works-list .works-list-inner ul li a,
#works #works-list .works-list-inner ul li a,
#works-illust #works-list .works-list-inner ul li a {
  display: block;
  color: #039;
}

#top #works-list .works-list-inner ul li img,
#works #works-list .works-list-inner ul li img,
#works-illust #works-list .works-list-inner ul li img {
  width: 100%;
}

#top #works-list .works-list-inner ul li .client-name,
#works #works-list .works-list-inner ul li .client-name,
#works-illust #works-list .works-list-inner ul li .client-name {
  margin: 0 0 7px;
  text-align: center;
  font-size: 0.75em;
  line-height: 1.2em;
}

#top #works-list .works-list-inner ul li .title-name,
#works #works-list .works-list-inner ul li .title-name,
#works-illust #works-list .works-list-inner ul li .title-name {
  width: 230px;
  padding: 10px 0 10px;
  margin: 0 0 0 -10px;
  text-align: center;
  font-size: 0.95em;
  font-weight: bold;
  line-height: 1.3em;
}

#top #works-list .works-list-inner ul li .text,
#works #works-list .works-list-inner ul li .text,
#works-illust #works-list .works-list-inner ul li .text {
  padding: 10px 0;
  line-height: 1.5em;
  font-size: 0.8em;
  border-top: 1px solid #ccc;
}

#top #works-list .works-list-inner ul li .copyright,
#works #works-list .works-list-inner ul li .copyright,
#works-illust #works-list .works-list-inner ul li .copyright {
  width: 200px;
  padding: 5px 0 0;
  line-height: 1.2em;
  font-size: 0.65em;
  border-top: 1px dotted #ccc;
  position: absolute;
  bottom: 10px;
}

#top #works-list .works-list-inner .btn,
#works #works-list .works-list-inner .btn,
#works-illust #works-list .works-list-inner .btn {
  width: 300px;
  margin: 20px auto 0;
  text-align: center;
}

#top #works-list .works-list-inner .btn a,
#works #works-list .works-list-inner .btn a,
#works-illust #works-list .works-list-inner .btn a {
  padding: 15px;
  display: block;
  font-size: 1.3em;
  color: #e82e55;
  font-weight: bold;
  border: 1px solid #e82e55;
  border-radius: 5px;
}

#top #works-list .works-list-inner .btn a:hover,
#works #works-list .works-list-inner .btn a:hover,
#works-illust #works-list .works-list-inner .btn a:hover {
  background: #e82e55;
  color: #fff;
}

#top #works-list .works-list-inner .btn a .fa,
#works #works-list .works-list-inner .btn a .fa,
#works-illust #works-list .works-list-inner .btn a .fa {
  margin-left: 10px;
}

#top #works-list #works-list-game-sound .works-list-inner ul li,
#top #works-list #works-list-original-music .works-list-inner ul li,
#works #works-list #works-list-game-sound .works-list-inner ul li,
#works #works-list #works-list-original-music .works-list-inner ul li,
#works-illust #works-list #works-list-game-sound .works-list-inner ul li,
#works-illust #works-list #works-list-original-music .works-list-inner ul li {
  background: #ffe2c5;
}

#top #works-list #works-list-animation .works-list-inner ul li,
#top #works-list #works-list-movie .works-list-inner ul li,
#works #works-list #works-list-animation .works-list-inner ul li,
#works #works-list #works-list-movie .works-list-inner ul li,
#works-illust #works-list #works-list-animation .works-list-inner ul li,
#works-illust #works-list #works-list-movie .works-list-inner ul li {
  background: #ead3fb;
}

/* ----- 取引先企業様 ----- */
#client-logo {
  width: 100%;
  margin: 100px auto 0;
  padding: 70px 0;
  background: #fff;
}

#client-logo ul {
  width: 1220px;
  display: flex;
  flex-wrap: wrap;
  margin: 40px auto;
}

#client-logo ul li {
  margin: 0 28px 20px;
}

/* #client-logo ul li:nth-child(5n) {
  margin-right: 0;
} */
#client-logo table {
  width: 900px;
  margin: 0 auto;
}

#client-logo table tr td {
  vertical-align: middle;
}

#client-logo table tr td img {
  width: 100%;
  display: block;
  margin: 0 auto;
  padding: 10px;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

/*-- contact-list----------*/
#responsive #pankuzu .pankuzu-contact {
  width: 100%;
  padding: 0 0 10px;
  margin: 60px 0 0;
}

#responsive .contact-list {
  /* padding: 70px 10px; */
  padding: 10px 10px;
  background: #222;
}

#responsive .contact-list h2.en-title {
  color: #fff;
}

#responsive .contact-list p {
  margin: 12px 0 0;
  text-align: center;
  color: #fff;
}

#responsive .contact-list .contact-list-inner ul {
  display: flex;
  justify-content: center;
  margin: 40px 10px;
}

#responsive .contact-list .contact-list-inner ul li {
  width: 140px;
  text-align: center;
}

/* Why Choose G-angle (merit)*/
.ct-merit {
  padding: 65px 0;
  background-image: linear-gradient(to top, #efefef 0%, #ffffff 100%);
}

#illust .ct-merit {
  padding: 65px 0;
  background-image: initial;
}

.ct-merit ul {
  display: flex;
  justify-content: center;
  font-size: 1em;
  line-height: 1.7;
  text-align: center;
  padding: 60px 0 0;
}

.ct-merit ul li {
  position: relative;
  width: 370px;
}

.ct-merit ul li:nth-child(2) {
  margin: 0 35px;
}

.ct-merit ul li h3 {
  margin: 18px 0 15px;
  font-size: 1.6em;
  font-weight: bold;
  color: #f39800;
}

.ct-merit ul li h3 span {
  width: 64px;
  height: 64px;
  position: absolute;
  top: -14px;
  left: -12px;
  line-height: 64px;
  background-color: #f39700;
  border-radius: 50%;
  font-size: 0.7em;
  color: #fff;
  text-align: center;
  box-shadow: 2px 2px 5px 1px rgb(80 50 0 / 60%);
  transform: rotate(-10deg);
  -moz-transform: rotate(-10deg);
  -webkit-transform: rotate(-10deg);
  letter-spacing: 0.05em;
}

.ct-merit ul li img {
  width: 100%;
  height: auto;
}

.ct-merit ul li p {
  text-align: left;
}

/*-- kv 共通----------*/
.top-kv {
  position: relative;
}

.main-detail {
  width: 1200px;
  position: absolute;
  bottom: -12%;
  left: 0;
  right: 0;
  margin: auto;
  z-index: 1;
  padding: 30px 30px 30px 100px;
  color: #ffffff;
  background: #1e1e1eed;
}

.main-detail span {
  margin-left: 23px;
  padding: 6px 4px 6px 10px;
  letter-spacing: 4px;
  font-family: "Barlow Condensed", sans-serif;
  font-size: 1.4em;
}

.main-detail p {
  line-height: 1.5;
  font-size: 1.3em;
}

.main-detail h2 {
  display: inline-block;
  margin-bottom: 20px;
  font-size: 4.4em;
}

/*-- End_tag----------*/

#top #top-main {
  width: 100%;
  height: 600px;
  background: url("../images/top/main_visual.jpg") no-repeat;
  background-size: cover;
}

#top #top-main .tm-inner {
  width: 1100px;
  margin: 0 auto;
  position: relative;
}

#top #top-main .tm-inner .bg-circle-le {
  position: absolute;
  left: -310px;
}

#top #top-main .tm-inner .bg-circle-ri {
  position: absolute;
  right: -350px;
}

#top #top-main .tm-inner .photo {
  position: absolute;
  right: -105px;
}

#top #top-main .tm-inner .detail-box {
  width: 550px;
  padding: 64px 25px 63px;
  background: rgba(0, 0, 0, 0.6);
  color: #fff;
  text-align: center;
  position: absolute;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

#top #top-main .tm-inner .detail-box h2 {
  font-size: 2.5em;
}

#top #top-main .tm-inner .detail-box h2 span {
  font-weight: normal;
}

#top #top-main .tm-inner .detail-box .movie {
  margin: 20px 0 15px;
}

#top #top-main .tm-inner .detail-box .text {
  font-size: 1.3em;
  line-height: 1.4em;
}

#top #top-main {
  width: 100%;
  height: 600px;
  overflow: hidden;
  position: relative;
  background: #000;
}

#top #top-main .video-bg video {
  width: 100%;
  min-width: 1500px;
  position: absolute;
  bottom: -220px;
  opacity: 0.7;
}

#top #top-main .detail-box {
  width: 100%;
  height: 600px;
  color: #fff;
  position: absolute;
}

#top #top-main .detail-box .inner-wrap {
  width: 100%;
  padding: 25px 0;
  position: absolute;
  bottom: 0;
  background: rgba(0, 0, 0, 0.5);
}

#top #top-main .detail-box .inner-wrap .inner {
  width: 1130px;
  margin: 0 auto;
}

#top #top-main .detail-box .inner-wrap .inner h2 {
  margin-right: 10px;
  display: inline-block;
  font-size: 2.5em;
}

#top #top-main .detail-box .inner-wrap .inner h2 span {
  font-weight: normal;
}

#top #top-main .detail-box .inner-wrap .inner .text {
  display: inline-block;
  font-size: 1.3em;
  line-height: 1.4em;
}

#top #pr {
  width: 100%;
  max-width: 1100px;
  margin: 60px auto 0;
  font-size: 18px;
  line-height: 1.5;
  text-align: center;
  border: 3px solid #333;
}

#top #pr h2 {
  padding: 10px 0;
  font-size: 40px;
  background: #f39700;
}

#top #pr h3 {
  padding: 20px 0 10px;
  font-size: 30px;
  font-weight: bold;
}

#top #pr p {
  padding: 0 15px 30px;
}

/* who-we-are */
.who-we-are {
  padding: 50px 20px;
  background: #1e1e1e;
}

.who-we-are h2 {
  margin: 0 0 34px;
  color: #fff;
}

.who-we-are p {
  line-height: 1.7;
  text-align: center;
  color: #fff;
}

/* main-service */
#top #main-service {
  position: relative;
  width: 100%;
  padding: 70px 0;
  /* background: #EFEFEF; */
}

#top #main-service .title {
  text-align: center;
}

#top #main-service .title h2 {
  margin-bottom: 40px;
}

#top #main-service .title p {
  line-height: 1.6;
}

#top #main-service .inner {
  width: 1220px;
  margin: 50px auto 0;
}

#top #main-service .inner ul {
  display: flex;
  gap: 35px 25px;
  flex-wrap: wrap;
  justify-content: center;
  /* align-items: center; */
}

#top #main-service .inner .our_service_box {
  position: relative;
  width: 22%;
  background-color: #ddd;
  padding: 30px 45px 45px;
  margin: 0 0;
  box-sizing: border-box;
  box-shadow: rgba(0, 0, 0, 0.16) 0px 1px 4px;
}

/* before box */
#top #main-service .inner .our_service_box .box-before {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  display: flex;
  align-items: center;
  width: 100%;
  background-color: #fff;
  margin: auto;
  transform: rotateY(0deg);
  opacity: 1;
  transition-duration: 0.4s;
}

#top #main-service .inner .our_service_box .box-before img {
  display: block;
  margin: -30px auto 10px;
}

#top #main-service .inner .our_service_box .box-before p {
  margin: 0 auto;
  font-size: 17px;
  font-weight: bold;
  text-align: center;
  line-height: 1.8em;
}

/* hover */
#top #main-service .inner .our_service_box.go .box-before {
  transform: rotateY(-180deg);
  opacity: 0;
}

/* after box */
#top #main-service .inner .our_service_box .box-after {
  display: flex;
  flex-direction: column;
  transform: rotateY(-180deg);
  height: 100%;
  opacity: 0;
  transition-duration: 0.4s;
}

#top #main-service .inner .our_service_box .box-after p {
  margin: 0 0 30px;
  font-size: 16px;
  text-align: left;
  line-height: 1.8em;
}

#top #main-service .inner .our_service_box .box-after a {
  display: block;
  width: 150px;
  height: 40px;
  line-height: 40px;
  border-radius: 40px;
  color: #fff;
  text-align: center;
  background: #f39700;
  padding: 0 20px;
  margin: 0 auto;
}

#top #main-service .inner .our_service_box .box-after a:hover {
  color: #f39700;
  background: #fff;
}

#top #main-service .inner .our_service_box .box-after .btn_more {
  pointer-events: none;
  margin: auto 0 0 0 !important;
}

/* hover */
#top #main-service .inner .our_service_box.go .box-after {
  transform: rotateY(0deg);
  opacity: 1;
}

#top #main-service .inner .our_service_box.go .box-after .btn_more {
  pointer-events: initial;
}

#top #consultation {
  width: 980px;
  margin: 0 auto;
}

#top #consultation h2 {
  font-size: 2em;
  text-align: center;
}

#top #consultation ul {
  margin: 25px 0 0;
  display: flex;
}

#top #consultation ul li {
  width: 350px;
  margin-right: 25px;
  padding: 15px;
  border: 1px solid #333;
  float: left;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

#top #consultation ul li:last-child {
  margin-right: 0;
}

#top #consultation ul li h3 {
  margin-bottom: 10px;
  text-align: center;
  line-height: 1.2em;
  font-weight: bold;
}

#top #consultation ul li h3 span {
  background: linear-gradient(rgba(0, 0, 0, 0) 50%, #fff001 0%);
}

#top #consultation ul li p {
  font-size: 1.1em;
  line-height: 1.4em;
}

#top .video {
  display: none;
}

/* #top-main{
    width: 100%;
    background: url("../images/common/main_bg_left.jpg") no-repeat;
    background-position: left top;
    .tm-inner{
        width: 100%;
        background: url("../images/common/main_bg_right.jpg") no-repeat;
        background-position: right top;
        ul{
            width: 1100px;
            margin: 0 auto;
            li{
                float: left;
            }
        }
    }
}

.top-contents{
    width: 100%;
    .banner-link{
        background: #8e5b00;
        position: relative;
        &:before{
            content:"";
            display: block;
            position: absolute;
            top: 0;
            left: 0;
            right: 0;
            bottom: 0;
            background: url("../images/common/bg_washi.png");
        }
        ul{
            width: 940px;
            margin: 0 auto;
            padding: 40px 0;
            li{
                float: left;
                margin-right: 40px;
                background: #fff;
                position: relative;
                &:last-child{ margin-right: 0; }
                span{
                    position: absolute;
                    top: 0;
                    right: 40px;
                    line-height: 100px;
                    font-size: 1.5em;
                    color: #fff;
                }
            }
        }
    }
} */
/* 【works】制作実績ページ
--------------------------------------------------------- */
#works #main-visual,
#works-illust #main-visual {
  height: 600px;
  background: url("../images/works/eto_background.jpg") no-repeat;
  background-size: cover;
  background-position: center;
  position: relative;
}

#works #main-visual .mv-inner,
#works-illust #main-visual .mv-inner {
  width: 1100px;
  height: 550px;
  margin: 0 auto;
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  background: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2ZmZmZmZiIgc3RvcC1vcGFjaXR5PSIwLjciLz48c3RvcCBvZmZzZXQ9IjcxJSIgc3RvcC1jb2xvcj0iI2ZmZmZmZiIgc3RvcC1vcGFjaXR5PSIwLjciLz48c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNmZmZmZmYiLz48L2xpbmVhckdyYWRpZW50PjwvZGVmcz48cmVjdCB4PSIwIiB5PSIwIiB3aWR0aD0iMTAwJSIgaGVpZ2h0PSIxMDAlIiBmaWxsPSJ1cmwoI2dyYWQpIiAvPjwvc3ZnPiA=");
  background: -webkit-gradient(
    linear,
    50% 0%,
    50% 100%,
    color-stop(0%, rgba(255, 255, 255, 0.7)),
    color-stop(71%, rgba(255, 255, 255, 0.7)),
    color-stop(100%, #ffffff)
  );
  background: -moz-linear-gradient(
    top,
    rgba(255, 255, 255, 0.7) 0%,
    rgba(255, 255, 255, 0.7) 71%,
    #ffffff 100%
  );
  background: -webkit-linear-gradient(
    top,
    rgba(255, 255, 255, 0.7) 0%,
    rgba(255, 255, 255, 0.7) 71%,
    #ffffff 100%
  );
  background: linear-gradient(
    to bottom,
    rgba(255, 255, 255, 0.7) 0%,
    rgba(255, 255, 255, 0.7) 71%,
    #ffffff 100%
  );
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#b3ffffff', endColorstr='#ffffff', GradientType=0);
  /* IE6-9 */
}

#works #main-visual .mv-inner .box,
#works-illust #main-visual .mv-inner .box {
  width: 55%;
  padding: 95px 80px 0;
}

#works #main-visual .mv-inner .box h2,
#works-illust #main-visual .mv-inner .box h2 {
  margin: 0 0 15px;
  padding: 0;
  font-size: 4em;
}

#works #main-visual .mv-inner .box .txt,
#works-illust #main-visual .mv-inner .box .txt {
  line-height: 1.4em;
  text-align: left;
}

#works #main-visual .mv-inner .box .link-btn,
#works-illust #main-visual .mv-inner .box .link-btn {
  width: 500px;
  margin: 5px 0 15px;
}

#works #main-visual .mv-inner .box .link-btn li a,
#works-illust #main-visual .mv-inner .box .link-btn li a {
  display: block;
  min-width: 220px;
  margin: 15px 12px 0 0;
  padding: 15px 0;
  float: left;
  font-size: 16px;
  text-align: center;
  color: #e02953;
  border: 1px solid #e02953;
  border-radius: 4px;
  background-color: rgba(255, 255, 255, 0.6);
  position: relative;
  z-index: 1;
}

#works #main-visual .mv-inner .box .link-btn li a:hover,
#works-illust #main-visual .mv-inner .box .link-btn li a:hover {
  background: #e02953;
  color: #fff;
}

#works #main-visual .mv-inner .box .link-btn li a .fa,
#works-illust #main-visual .mv-inner .box .link-btn li a .fa {
  margin-left: 10px;
}

#works #main-visual .mv-inner .box .btn,
#works-illust #main-visual .mv-inner .box .btn {
  width: 380px;
  margin: 15px 0;
  position: absolute;
  z-index: 1;
}

#works #main-visual .mv-inner .box .btn a,
#works-illust #main-visual .mv-inner .box .btn a {
  padding: 20px 0;
  display: block;
  color: #fff;
  background: #e02852;
}

#works #main-visual .mv-inner .box .btn a .fa,
#works-illust #main-visual .mv-inner .box .btn a .fa {
  margin-left: 10px;
}

#works #main-visual .pict,
#works-illust #main-visual .pict {
  width: 100%;
  height: 600px;
  margin: 0 auto;
  position: relative;
  overflow: hidden;
}

#works #main-visual .pict .inner,
#works-illust #main-visual .pict .inner {
  width: 1100px;
  height: 600px;
  margin: 0 auto;
  position: relative;
}

#works #main-visual .pict .inner .chara-img,
#works-illust #main-visual .pict .inner .chara-img {
  width: 1261px;
  height: 788px;
  background: url("../images/works/eto_character.png") no-repeat;
  position: absolute;
  right: -550px;
  top: -100px;
  z-index: 0;
}

#works #main-visual .pict img,
#works-illust #main-visual .pict img {
  position: absolute;
  right: -190px;
  bottom: 0;
}

/* 【works/illust】イラスト実績ページ
--------------------------------------------------------- */
#works-illust #game-character h2 {
  margin: 50px 0 10px;
  padding: 32px 0 10px;
  font-size: 2.3em;
  text-align: center;
}

#works-illust #game-character .h-text {
  text-align: center;
  line-height: 1.4em;
}

#works-illust #game-character .game-chara-inner {
  margin: 30px 0 0;
  background: #c8e9ff;
}

#works-illust #game-character .game-chara-inner .title {
  margin: 0 0 50px;
  background: #a0d7ff;
  position: relative;
}

#works-illust #game-character .game-chara-inner .title::before {
  content: "";
  position: absolute;
  display: block;
  margin: 0 auto;
  width: 0;
  height: 0;
  left: 0;
  right: 0;
  bottom: -15px;
  border-top: 15px solid #a0d7ff;
  border-right: 15px solid transparent;
  border-left: 15px solid transparent;
}

#works-illust #game-character .game-chara-inner .title .tit-inner {
  margin: 0 auto;
  padding: 20px 0;
}

#works-illust #game-character .game-chara-inner .title .tit-inner .tit-pict {
  margin-right: 20px;
  float: left;
}

#works-illust #game-character .game-chara-inner .title .tit-inner .tit-detail {
  line-height: 1.4em;
}

#works-illust
  #game-character
  .game-chara-inner
  .title
  .tit-inner
  .tit-detail
  .game-title {
  margin: 0 0 5px;
  font-size: 1.5em;
  font-weight: bold;
}

#works-illust
  #game-character
  .game-chara-inner
  .title
  .tit-inner
  .tit-detail
  .game-title
  a {
  color: #039;
}

#works-illust
  #game-character
  .game-chara-inner
  .title
  .tit-inner
  .tit-detail
  .client
  a {
  color: #039;
}

#works-illust
  #game-character
  .game-chara-inner
  .title
  .tit-inner
  .tit-detail
  .copyright {
  font-size: 0.75em;
}

#works-illust #game-character .game-chara-inner .title.record01 .tit-inner {
  width: 670px;
}

#works-illust #game-character .game-chara-inner .title.record02 .tit-inner {
  width: 460px;
}

#works-illust #game-character .game-chara-inner .title.record03 .tit-inner {
  width: 495px;
}

#works-illust #game-character .game-chara-inner .title.record04 .tit-inner {
  width: 570px;
}

#works-illust #game-character .game-chara-inner .title.record05 .tit-inner {
  width: 455px;
}

#works-illust #game-character .game-chara-inner .title.record06 .tit-inner {
  width: 580px;
}

#works-illust #game-character .game-chara-inner .title.record07 .tit-inner {
  width: 415px;
}

#works-illust #game-character .game-chara-inner .title.record08 .tit-inner {
  text-align: center;
}

#works-illust #game-character .game-chara-inner .title.record09 .tit-inner {
  width: 500px;
}

#works-illust #game-character .game-chara-inner .title.pets .tit-inner {
  width: 535px;
}

#works-illust #game-character .game-chara-inner .pict {
  width: 1100px;
  margin: 0 auto 0;
  padding-bottom: 150px;
}

#works-illust #game-character .game-chara-inner .pict ul {
  font-size: 0;
  text-align: center;
}

#works-illust #game-character .game-chara-inner .pict ul li {
  margin: 25px 25px 0 0;
  display: inline-block;
}

#works-illust
  #game-character
  .game-chara-inner
  .pict
  ul.three
  li:nth-child(3n) {
  margin-right: 0;
}

#works-illust #game-character .game-chara-inner .pict ul.four li {
  margin-right: 20px;
}

#works-illust #game-character .game-chara-inner .pict ul.four li:nth-child(4n) {
  margin-right: 0;
}

#works-illust #game-character .game-chara-inner .pict ul.five li:nth-child(5n) {
  margin-right: 0;
}

#works-illust #ip-illust h2 {
  margin: 50px 0 10px;
  padding: 32px 0 10px;
  font-size: 2.3em;
  text-align: center;
}

#works-illust #ip-illust .h-text {
  text-align: center;
  line-height: 1.4em;
}

#works-illust #ip-illust .ip-inner {
  margin: 30px 0 0;
  background: #ffefc6;
}

#works-illust #ip-illust .ip-inner .title {
  margin: 0 0 50px;
  background: #fbc97d;
  position: relative;
}

#works-illust #ip-illust .ip-inner .title::before {
  content: "";
  position: absolute;
  display: block;
  margin: 0 auto;
  width: 0;
  height: 0;
  left: 0;
  right: 0;
  bottom: -15px;
  border-top: 15px solid #fbc97d;
  border-right: 15px solid transparent;
  border-left: 15px solid transparent;
}

#works-illust #ip-illust .ip-inner .title .tit-inner {
  margin: 0 auto;
  padding: 20px 0;
}

#works-illust #ip-illust .ip-inner .title .tit-inner .tit-pict {
  margin-right: 20px;
  float: left;
}

#works-illust #ip-illust .ip-inner .title .tit-inner .tit-detail {
  line-height: 1.4em;
}

#works-illust #ip-illust .ip-inner .title .tit-inner .tit-detail .game-title {
  margin: 0 0 5px;
  font-size: 1.5em;
  font-weight: bold;
}

#works-illust #ip-illust .ip-inner .title .tit-inner .tit-detail .game-title a {
  color: #039;
}

#works-illust #ip-illust .ip-inner .title .tit-inner .tit-detail .client a {
  color: #039;
}

#works-illust #ip-illust .ip-inner .title .tit-inner .tit-detail .copyright {
  font-size: 0.75em;
}

#works-illust #ip-illust .ip-inner .title.record01 .tit-inner,
#works-illust #ip-illust .ip-inner .title.record03 .tit-inner,
#works-illust #ip-illust .ip-inner .title.record04 .tit-inner {
  text-align: center;
}

#works-illust #ip-illust .ip-inner .title.record02 .tit-inner {
  width: 630px;
}

#works-illust #ip-illust .ip-inner .pict {
  width: 1100px;
  margin: 0 auto 0;
  padding-bottom: 150px;
}

#works-illust #ip-illust .ip-inner .pict ul li {
  float: left;
  margin: 20px 20px 0 0;
}

#works-illust #ip-illust .ip-inner .pict ul li p {
  text-align: center;
}

#works-illust #ip-illust .ip-inner .pict ul li p.tit {
  padding: 0 0 10px;
  font-size: 1.5em;
  font-weight: bold;
}

#works-illust #ip-illust .ip-inner .pict ul li p.copy {
  padding: 5px 0 10px;
  font-size: 0.75em;
}

#works-illust #ip-illust .ip-inner .pict ul.three li:nth-child(3n) {
  margin-right: 0;
}

#works-illust #ip-illust .ip-inner .pict ul.four li:nth-child(4n) {
  margin-right: 0;
}

/* add */
.note {
  font-size: 14px;
}

.works-credit {
  font-size: 12px;
  line-height: 1.4;
  margin-bottom: 16px;
  color: #747474;
}

/* .works-credit dt {
  margin-bottom: 6px;
} */
.works-credit .link {
  display: inline-block;
  margin: 10px 0;
  cursor: pointer;
  text-decoration: underline;
  color: #f39700;
}

/* Rental Studio Section */
.studio-section {
  background-color: #404040;
  padding: 75px 0 150px;
}

.studio-section__wrap {
  max-width: 1200px;
  width: auto;
  margin: auto;
}

.studio-section__wrap h2,
.studio-section__wrap h3,
.studio-section__wrap p,
.studio-section__wrap span {
  color: #fff;
  text-align: center;
  line-height: 1.7;
}

.studio-details h3 {
  border-bottom: 1px solid #a2a2a2;
}

.studio-section__wrap h2 {
  font-size: 34px;
  letter-spacing: 0.02em;
  font-weight: bold;
  text-align: center;
  padding: 0 0 35px;
}

.studio-section__wrap .sect-desc {
  letter-spacing: 0.02em;
  padding: 0 0 35px;
}

.studio-wrap {
  display: flex;
  flex-direction: column;
  gap: 35px;
}

.studio {
  display: flex;
  gap: 50px;
}

.studio .studio-details > *,
.studio .studio-img > * {
  text-align: left;
}

.studio .studio-img p {
  color: #a2a2a2;
}

.stud-left {
  flex-direction: row;
}

.stud-right {
  flex-direction: row-reverse;
}

.stud-left .studio-details {
  padding-left: 20px;
  padding-top: 20px;
}

.stud-right .studio-details {
  padding-right: 20px;
  padding-top: 20px;
}

.studio-img,
.studio-details {
  width: 50%;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  gap: 10px;
}

.studio-img img {
  width: 100%;
  object-fit: contain;
  object-position: center;
}

@media only screen and (max-width: 640px) {
  .studio-section__wrap {
    max-width: 90%;
  }

  .studio {
    gap: 20px;
  }
  .studio-section {
    background-color: #404040;
    padding: 40px 0 60px;
  }
  .studio-wrap {
    gap: 50px;
  }
  .stud-left,
  .stud-right {
    flex-direction: column-reverse;
  }

  .studio-img,
  .studio-details {
    width: 100%;
    gap: 10px;
  }
  .stud-left .studio-details,
  .stud-right .studio-details {
    padding-right: 0;
    padding-left: 0;
    padding-top: 0;
  }

  .studio .studio-details > *,
  .studio .studio-img > * {
    text-align: center;
  }

  iframe {
    pointer-events: auto;
  }

  #illust #service-illustration.col3 .inner .our_service_box .box-after {
    height: auto !important;
  }

  #illust #service-illustration.col3 .inner .our_service_box .box-before h3 {
    width: auto;
  }
}

/* #illust */
#illust .main-detail span {
  background-image: linear-gradient(to top, #4645eb 0%, #fb93aa 100%);
}

#illust #main-visual {
  width: 100%;
  height: 600px;
  background: url("../images/top/main_visual.jpg") no-repeat;
  background-size: cover;
}

/* 【character】版権・キャラクターイラスト制作
--------------------------------------------------------- */
/* 版権イラスト */
#copyright-illust ul {
  margin-top: 15px;
}

#copyright-illust ul li {
  margin-right: 20px;
  float: left;
}

#copyright-illust ul li:last-child {
  margin-right: 0;
}

#copyright-illust ul li .tit {
  margin-top: 15px;
  text-align: center;
  font-size: 1.3em;
}

#copyright-illust ul li .tit span {
  margin-top: 5px;
  display: block;
  font-size: 0.6em;
}

#copyright-illust .works-link-btn a {
  display: block;
  width: 30%;
  margin: 25px auto 0;
  padding: 17px 0;
  font-size: 1.3em;
  text-align: center;
  background: #493f9d;
  color: #fff;
  border-radius: 10px;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

#copyright-illust .works-link-btn a .fa-caret-right {
  margin-left: 10px;
}

/* サンプルイラスト */
#chara-illust ul,
#avatar-illust ul,
#weapon-item-bg-illust ul {
  width: 1100px;
}

#chara-illust ul li,
#avatar-illust ul li,
#weapon-item-bg-illust ul li {
  margin: 20px 20px 0 0;
  float: left;
}

#chara-illust ul li:nth-child(4n),
#avatar-illust ul li:nth-child(4n),
#weapon-item-bg-illust ul li:nth-child(4n) {
  margin-right: 0;
}

#chara-illust ul.nth-2n li:nth-child(2n),
#avatar-illust ul.nth-2n li:nth-child(2n),
#weapon-item-bg-illust ul.nth-2n li:nth-child(2n) {
  margin-right: 0;
}

#chara-illust .works-link-btn a,
#avatar-illust .works-link-btn a,
#weapon-item-bg-illust .works-link-btn a {
  display: block;
  width: 30%;
  margin: 25px auto 0;
  padding: 17px 0;
  font-size: 1.3em;
  text-align: center;
  background: #493f9d;
  color: #fff;
  border-radius: 10px;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

#chara-illust .works-link-btn a .fa-caret-right,
#avatar-illust .works-link-btn a .fa-caret-right,
#weapon-item-bg-illust .works-link-btn a .fa-caret-right {
  margin-left: 10px;
}

/* 武器・アイテム・背景・アバターページ */
#illust-design .box {
  padding: 60px;
  text-align: center;
}

#illust-design .box .txt {
  margin-bottom: 30px;
  font-size: 2em;
}

/* [add] Type of illustration */
#illust #service-illustration.col3 {
  width: 100%;
  /* background: #EFEFEF; */
  padding: 60px 0;
  position: relative;
}

#illust #service-illustration.col3 p {
  line-height: 1.8em;
  text-align: center;
  margin: 0 auto;
}

/* wrap */
#illust #service-illustration.col3 .inner {
  width: 1200px;
  margin: 60px auto 0;
}

#illust #service-illustration.col3 .inner ul {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}

#illust #service-illustration.col3 .inner .our_service_box {
  position: relative;
  width: 360px;
  min-height: 400px;
  background-color: #ddd;
  padding: 85px 55px 75px 58px;
  margin: 0 0 25px;
  box-sizing: border-box;
  box-shadow: rgba(0, 0, 0, 0.16) 0px 1px 4px;
}

/* before box */
#illust #service-illustration.col3 .inner .our_service_box .box-before {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
  background-color: #fff;
  padding: 0 0 35px;
  margin: auto;
  transform: rotateY(0deg);
  opacity: 1;
  transition-duration: 0.4s;
}

#illust #service-illustration.col3 .inner .our_service_box .box-before img {
  display: block;
  width: 90%;
  height: 100%;
  max-height: 300px;
  margin: auto;
  object-fit: contain;
  object-position: center;
}

#illust #service-illustration.col3 .inner .our_service_box .box-before h3 {
  position: absolute;
  bottom: 13px;
  font-size: 19px;
  font-weight: bold;
  line-height: 1.2;
  margin: 10px 0;
}

/* hover */
#illust #service-illustration.col3 .inner .our_service_box.go .box-before {
  transform: rotateY(-180deg);
  opacity: 0;
}

/* after box ------------------------------------------+ */
#illust #service-illustration.col3 .inner .our_service_box .box-after {
  display: flex;
  flex-direction: column;
  transform: rotateY(-180deg);
  height: 100%;
  opacity: 0;
  transition-duration: 0.4s;
}

#illust #service-illustration.col3 .inner .our_service_box .box-after p {
  font-size: 16px;
  text-align: left;
  margin: 0 0 30px;
}

#illust #service-illustration.col3 .inner .our_service_box .box-after a {
  display: block;
  width: 150px;
  height: 40px;
  line-height: 40px;
  border-radius: 40px;
  color: #fff;
  text-align: center;
  background: #f39700;
  padding: 0 20px;
  margin: 0 auto;
}

#illust #service-illustration.col3 .inner .our_service_box .box-after a:hover {
  color: #f39700;
  background: #fff;
}

#illust
  #service-illustration.col3
  .inner
  .our_service_box
  .box-after
  .btn_more {
  pointer-events: none;
  margin: auto 0 0 0 !important;
}

/* hover */
#illust #service-illustration.col3 .inner .our_service_box.go .box-after {
  transform: rotateY(0deg);
  opacity: 1;
}

#illust
  #service-illustration.col3
  .inner
  .our_service_box.go
  .box-after
  .btn_more {
  pointer-events: initial;
}

/* Added 04/23/2025 Illustration Price Section */

#price-illustration {
  background-color: #404040;
  padding: 75px 0 150px;
  color: white;
}

#price-illustration .inner {
  max-width: 1200px;
  width: auto;
  /* margin: auto; */
  margin: 60px auto 0;
}

#price-illustration .inner .card-list {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 100px;
}

#price-illustration .inner .card-list > li {
  display: flex;
  justify-content: center;
  gap: 50px;
  width: 100%;
}

#price-illustration .inner .card-list .card-left {
  flex-direction: row;
}

#price-illustration .inner .card-list .card-right {
  flex-direction: row-reverse;
}

#price-illustration .inner .card-list li img {
  object-fit: contain;
  object-position: center;
  width: 100%;
  max-width: 550px;
  height: 100%;
  /* aspect-ratio: 16/9; */
  /* max-height: 210px; */
}

#price-illustration .inner .card-list li iframe {
  width: 100%;
  max-width: 550px;
  height: 100%;
  aspect-ratio: 16/9;
  /* max-height: 210px; */
}

#price-illustration .inner .card-list li video {
  width: 100%;
  max-width: 550px;
  height: 100%;
  /* aspect-ratio: 16/9; */
  aspect-ratio: 45 / 32;
  /* max-height: 210px; */
  background-color: #000;
}

#price-illustration .inner .card-list li .card-details {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  gap: 30px;
  width: 100%;
}

#price-illustration .inner .card-list li .card-details .card-title {
  padding-bottom: 10px;
  border-bottom: 1px solid #fff;
  /* text-align: center; */
  /* font-size: 2.4em; */
  font-weight: 400;
}

#price-illustration .inner .card-list li .card-details .card-details__cost {
  display: flex;
  flex-direction: column;
  gap: 20px;
  width: 100%;
  margin-left: 20px;
}

#price-illustration .inner .card-list li .card-details .card-details__cost h4 {
  font-weight: normal;
  /* margin: 5px 0; */
  text-align: left;
  font-size: 1.2em;
  line-height: 1em;
}

#price-illustration
  .inner
  .card-list
  li
  .card-details
  .card-details__cost
  .service-cost {
  display: flex;
  flex-direction: column;
  gap: 5px;
}

#price-illustration
  .inner
  .card-list
  li
  .card-details
  .card-details__cost
  .service-cost
  p {
  background-color: #ac9978;
  width: fit-content;
  padding: 5px;
}

#price-illustration
  .inner
  .card-list
  li
  .card-details
  .card-details__cost
  .service-inclusion {
  display: flex;
  flex-direction: column;
  gap: 5px;
}

#price-illustration
  .inner
  .card-list
  li
  .card-details
  .card-details__cost
  .service-inclusion
  ul {
  display: flex;
  flex-direction: row;
  gap: 10px;
}

#price-illustration
  .inner
  .card-list
  li
  .card-details
  .card-details__cost
  .service-inclusion
  ul
  li {
  background-color: #b3b2b1;
  padding: 5px;
}

#illust .faq-illustration .mv-faq {
  margin: 10px 0;
  padding: 70px 10px;
  background: #222;
}

#illust .faq-illustration .en-title {
  color: #fff;
}

#illust .faq-illustration .faq-inner {
  width: 90%;
  max-width: 1200px;
  margin: auto auto 70px;
  line-height: 1.5em;
  font-size: 1.1em;
}

#illust .faq-illustration .faq-inner h2 {
  width: 100%;
  margin: 0 auto 60px;
  /* padding-bottom: 10px; */
  text-align: center;
  border-bottom: none;
  color: #000;
  font-size: 2.4em;
  font-weight: bold;
}

#illust .faq-illustration .faq-inner .faq-accordion .checkbox {
  /* display: none; */
  position: absolute;
  white-space: nowrap;
  width: 1px;
  height: 1px;
  overflow: hidden;
  border: 0;
  padding: 0;
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
  margin: -1px;
}

/*アコーディオン*/
#illust .faq-illustration .faq-inner .faq-accordion {
  width: 100%;
  max-width: 1200px;
  margin: 0 auto 14px;
}

#illust .faq-illustration .faq-inner .faq-accordion dl {
  position: relative;
}

#illust .faq-illustration .faq-inner .faq-accordion dt {
  background-color: #efefef;
  border-radius: 10px;
  padding: 16px;
}

#illust .faq-illustration .faq-inner .faq-accordion dt label::before {
  content: "Q";
  display: inline-block;
  position: absolute;
  top: 4px;
  left: 22px;
  width: 1em;
  height: 1em;
  padding: 8px;
  font-size: 1.1em;
  line-height: 1;
  font-weight: bold;
  text-align: center;
  color: #fff;
  background-color: #222222;
  border-radius: 1em;
}

#illust .faq-illustration .faq-inner .faq-accordion dt label {
  position: relative;
  display: block;
  padding: 10px 20px;
  cursor: pointer;
}

#illust .faq-illustration .faq-inner .faq-accordion dt span {
  display: inline-block;
  padding: 0 0 0 46px;
}

#illust .faq-illustration .faq-inner .faq-accordion dd span {
  display: inline-block;
  padding: 0 0 0 70px;
}

/*ラベル内の矢印の設定*/
#illust .faq-illustration .faq-inner .faq-accordion dt label::after {
  content: "";
  display: inline-block;
  position: absolute;
  top: 0.75em;
  right: 10px;
  width: 10px;
  height: 10px;
  border: solid 2px #f39700;
  border-top: 0;
  border-left: 0;
  transform: rotate(45deg);
  transition: all 0.4s ease;
}

/*表示される要素の基本設定*/
#illust .faq-illustration .faq-inner .faq-accordion dd {
  position: relative;
  height: 0;
  padding: 0 20px;
  transition: 0.4s;
  overflow: hidden;
  border: solid 2px transparent;
  margin: 14px 30px 0 0;
  opacity: 0;
  transition: max-height 0.4s ease, padding 0.4s ease, opacity 0.4s ease;
}

#illust .faq-illustration .faq-inner .faq-accordion dd::before {
  content: "A";
  position: absolute;
  top: 0;
  left: 3%;
  display: inline-block;
  padding: 8px;
  width: 1em;
  height: 1em;
  vertical-align: top;
  font-size: 1.1em;
  line-height: 1;
  font-weight: bold;
  text-align: center;
  color: #fff;
  background-color: #f39800;
  border-radius: 1em;
}

/*ラベル内の矢印のアニメーション設定*/
#illust
  .faq-illustration
  .faq-inner
  .faq-accordion
  .checkbox:checked
  ~ dl
  dt
  label::after {
  transform: rotate(-135deg);
  top: 1.2em;
}

/*表示される要素のアニメーション設定*/
#illust .faq-illustration .faq-inner .faq-accordion .checkbox:checked ~ dl dd {
  height: auto;
  opacity: 1;
  /* padding: 0 20px 20px; */
}

.contactBtn-illustration a {
  display: block;
  max-width: 330px;
  margin: 0 auto;
  padding: 1rem 3rem;
  background-color: #f39800;
  border-radius: 8px;
  box-sizing: border-box;
  transition: 0.3s;
  border: 0;
  position: relative;
  /* font-size: 20px; */
}

.contactBtn-illustration .btn-text {
  display: block;
  position: relative;
  color: #fff;
  text-align: center;
  /* padding-left: 30px; */
  font-size: 1.8em;
  /* line-height: 1.5; */
}

.contactBtn-illustration .btn-subtext {
  display: block;
  position: relative;
  color: #fff;
  text-align: center;
  /* padding-left: 30px; */
  font-size: 1em;
}

.contactBtn-illustration a:before {
  content: "";
  width: 20px;
  height: 20px;
  background: #ffffff;
  border-radius: 50%;
  position: absolute;
  top: 50%;
  left: 48px;
  /* bottom: 0; */
  margin: auto;
  transform: translateY(-50%);
}

.contactBtn-illustration a:after {
  content: "";
  width: 8px;
  height: 8px;
  border-top: 3px solid #333;
  border-right: 3px solid #333;
  box-sizing: border-box;
  transform: rotate(45deg) translateY(-50%);
  position: absolute;
  top: 50%;
  left: 51px;
  /* bottom: 0; */
  margin: auto;
  transition: 0.3s;
}

/* .contactBtn-illustration .btn-text:before {
  content: "";
  width: 20px;
  height: 20px;
  background: #ffffff;
  border-radius: 50%;
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  margin: auto;
}

.contactBtn-illustration .btn-text:after {
  content: "";
  width: 8px;
  height: 8px;
  border-top: 3px solid #333;
  border-right: 3px solid #333;
  box-sizing: border-box;
  transform: rotate(45deg);
  position: absolute;
  top: 0;
  left: 5px;
  bottom: 0;
  margin: auto;
  transition: 0.3s;
} */

/* portfolio-link */
.portfolio-link {
  background: #a9a3cf;
}

.portfolio-img {
  max-width: 1200px;
  width: 100%;
  margin: 0 auto;
}

.portfolio-img img {
  min-width: 1200px;
}

/* END[add] Type of illustration */

/* [add] portfolio */
#portfolio #pankuzu {
  padding: 0;
  margin: 10px 0 0;
}

.mv-portfolio {
  padding: 70px 10px;
  background: #1e1e1e;
  border-top: 1px solid #5a5a5a;
}

.mv-inner-pf .en-title {
  color: #fff;
}

.mv-portfolio .lead {
  color: #fff;
  text-align: center;
  margin: 60px 0 0;
}

.gallery {
  padding: 0 0 70px;
  border-bottom: 1px solid #d2d2d2;
}

.gallery-wrap {
  width: 1200px;
  margin: 100px auto 0;
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}

.gallery-wrap:after {
  content: "";
  display: block;
  width: 33%;
  height: 0;
}

.gallary-item {
  flex-basis: 33%;
}

.gallary-img {
  position: relative;
  overflow: hidden;
  padding-top: 60%;
  margin: 10px 5px;
}

.gallary-img img {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.portfolio-container {
  padding: 0 0 70px;
  border-bottom: 1px solid #d2d2d2;
}

.portfolio-heading,
.portfolio-client,
.portfolio-text {
  text-align: center;
}

.portfolio-heading {
  margin: 100px 0 30px;
  font-size: 1.6em;
  font-weight: bold;
}

.portfolio-client {
  font-weight: normal;
}

.portfolio-text {
  margin: 70px 0 60px;
}

.portfolio-copyright {
  margin: 30px 0 0;
  text-align: center;
  font-size: 0.8em;
}

.portfolio-wrap {
  width: 1200px;
  margin: 0 auto;
}

.portfolio-content {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 10px;
}

.portfolio-content::after {
  content: "";
  display: block;
  width: 32%;
  height: 0;
}

.portfolio-content img {
  width: 100%;
}

.portfolio-content .col-three {
  width: 32%;
}

.portfolio-content .col-four {
  width: 24%;
}

.portfolio-content .col-two {
  width: 49%;
}

.portfolio-content .col-unique img {
  width: auto;
  max-height: 570px;
}

.other-projects {
  margin: 70px 0 0;
}

.other-projects .gallery-wrap {
  margin: 34px auto 0;
}

.other-projects .gallary-item {
  flex-basis: 20%;
}

.other-projects .heading {
  text-align: center;
  font-weight: bold;
}

/* back-btn*/
.btn-back a {
  display: block;
  max-width: 330px;
  margin: 60px auto 0;
  padding: 1.5rem 3rem;
  background-color: #1e1e1e;
  border-radius: 8px;
  box-sizing: border-box;
  transition: 0.3s;
  border: 0;
  font-size: 20px;
}

.btn-back .btn-text {
  display: block;
  position: relative;
  color: #fff;
  text-align: center;
  padding-left: 30px;
}

.btn-back .btn-text::before {
  content: "";
  width: 20px;
  height: 20px;
  background: #ffffff;
  border-radius: 50%;
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  margin: auto;
}

.btn-back .btn-text::after {
  content: "";
  width: 8px;
  height: 8px;
  border-bottom: 3px solid #1e1e1e;
  border-left: 3px solid #1e1e1e;
  box-sizing: border-box;
  transform: rotate(45deg);
  position: absolute;
  top: 0;
  left: 7px;
  bottom: 0;
  margin: auto;
  transition: 0.3s;
}

/* END[add] portfolio */

#narration .main-detail span {
  background-image: linear-gradient(to top, #0c6418 0%, #d4fc79 100%);
}

#narration hr {
  margin: 0;
  height: 10px;
  background: #111;
  border: none;
}

#narration .studio-box {
  margin-top: 25px;
}

#narration .studio-box .studio-box-inner {
  position: absolute;
  top: 50%;
  width: 500px;
  -moz-transform: translate(0, -50%);
  -ms-transform: translate(0, -50%);
  -webkit-transform: translate(0, -50%);
  transform: translate(0, -50%);
}

#narration .studio-box .studio-box-inner h3 {
  width: 500px;
  padding-bottom: 10px;
  border-bottom: 4px solid #111;
  font-size: 1.5em;
  font-weight: normal;
}

#narration .studio-box .studio-box-inner .border-slender {
  margin: 2px 0;
  padding: 25px 0;
  border-top: 1px solid #111;
  border-bottom: 1px solid #111;
}

#narration .studio-box .studio-box-inner .border-bold {
  padding: 35px 0;
  border-bottom: 4px solid #111;
}

#narration .studio-box .f-r {
  width: 500px;
  height: 325px;
  margin-right: 20px;
  text-align: center;
  font-size: 1.1em;
  position: relative;
}

#narration #narrator-introduction .catch-box {
  margin: 40px auto 0;
}

#narration #narrator-introduction .catch-box p {
  padding: 30px 0;
  text-align: center;
  font-size: 1.1em;
  line-height: 1.8em;
}

#narration .list-box h3 {
  width: 800px;
  margin: 0 auto;
  padding-bottom: 15px;
  text-align: center;
  border-bottom: 1px solid #666;
}

#narration .list-box ul {
  width: 600px;
  margin: 20px auto 60px;
  font-size: 1.1em;
}

#narration .list-box ul li {
  width: 250px;
  margin-bottom: 10px;
  float: left;
}

#narration .list-box ul li:nth-child(2n) {
  float: right;
}

#sound .en-title {
  font-weight: bold;
}

#sound #main-visual {
  min-width: 1400px;
  background: url("../images/sound/gangle_bg.jpg") no-repeat;
  background-size: 100%;
  background-position: center;
}

/* [add] sound / narration*/
#sound .main-detail span {
  background-image: linear-gradient(to top, #feba55 0%, #ff4e50 100%);
}

/*  ################################################################
   our-service (4-column)
################################################################# */
.col4 {
  width: 100%;
  /* background: #EFEFEF; */
  padding: 55px 0 40px;
  margin: -30px 0 0;
  position: relative;
}

.col4 p {
  line-height: 1.8em;
  text-align: center;
  margin: 0 auto;
}

/* wrap */
.col4 .inner {
  width: 1220px;
  margin: 50px auto 0;
}

.col4 .inner ul {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}

.col4 .inner .our_service_box {
  position: relative;
  width: 48.5%;
  background-color: #ddd;
  padding: 85px 55px 70px 58px;
  margin: 0 0 35px;
  box-sizing: border-box;
}

/* before box ------------------------------------------+ */
.col4 .inner .our_service_box .box-before {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
  background-color: #fff;
  padding: 0 0 35px;
  margin: auto;
  transform: rotateY(0deg);
  opacity: 1;
  transition-duration: 0.4s;
  box-shadow: rgba(0, 0, 0, 0.16) 0px 1px 4px;
}

.col4 .inner .our_service_box .box-before picture {
  display: block;
  max-width: 96%;
  height: auto;
  margin: 20px auto 0;
}

.col4 .inner .our_service_box .box-before img {
  display: block;
  max-width: 100%;
  height: auto;
  margin: auto;
}

.col4 .inner .our_service_box .box-before h3 {
  position: absolute;
  bottom: 0;
  font-size: 19px;
  font-weight: bold;
  line-height: 1.2;
  margin: 4px 0 8px;
}

/* hover */
.col4 .inner .our_service_box.go .box-before {
  transform: rotateY(-180deg);
  opacity: 0;
}

/* after box ------------------------------------------+ */
.col4 .inner .our_service_box .box-after {
  display: flex;
  flex-direction: column;
  transform: rotateY(-180deg);
  height: 100%;
  min-height: 160px;
  opacity: 0;
  transition-duration: 0.4s;
}

.col4 .inner .our_service_box .box-after p {
  font-size: 16px;
  text-align: left;
  margin: 0 0 30px;
}

.col4 .inner .our_service_box .box-after a {
  display: block;
  width: 150px;
  height: 40px;
  line-height: 40px;
  border-radius: 40px;
  color: #fff;
  text-align: center;
  background: #f39700;
  padding: 0 20px;
  margin: 0 auto;
}

.col4 .inner .our_service_box .box-after a:hover {
  color: #f39700;
  background: #fff;
}

.col4 .inner .our_service_box .box-after .btn_more {
  pointer-events: none;
  margin: auto 0 0 0 !important;
}

/* hover */
.col4 .inner .our_service_box.go .box-after {
  transform: rotateY(0deg);
  opacity: 1;
}

.col4 .inner .our_service_box.go .box-after .btn_more {
  pointer-events: initial;
}

/* [add]movie */
#movie .main-detail span {
  background-image: linear-gradient(to top, #4b86ff 0%, #34ffd6 100%);
}

#movie #main-movie {
  position: relative;
  width: 100vw;
  height: 50vh;
  overflow: hidden;
}

#movie .video {
  display: none;
}

#movie #main-movie video {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translateX(-50%) translateY(-50%);
  min-width: 100%;
  min-height: 100%;
}

/* [add]promotion */
#promotion .main-detail span {
  background-image: linear-gradient(to top, #4b86ff 0%, #34ffd6 100%);
}

#promotion #main-promotion {
  position: relative;
  width: 100vw;
  height: 50vh;
  overflow: hidden;
}

#promotion .video {
  display: none;
}

#promotion #main-promotion video {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translateX(-50%) translateY(-50%);
  min-width: 100%;
  min-height: 100%;
}

#access h3 {
  width: 1000px;
  margin: 60px auto 0;
  padding-bottom: 10px;
  text-align: center;
  border-bottom: 4px solid #333;
}

#access .txt {
  width: 1000px;
  margin: 2px auto 0;
  padding: 30px 30px 0;
  font-size: 1.1em;
  line-height: 1.5em;
  border-bottom: 1px solid #333;
  border-top: 1px solid #333;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

#access .txt p {
  margin-bottom: 30px;
}

#access .guide {
  width: 1000px;
  margin: 2px auto 200px;
  border-top: 1px solid #333;
}

#access .guide dt {
  width: 800px;
  margin: 30px auto 15px;
  padding: 0 10px 10px;
  border-bottom: 1px dotted #ccc;
}

#access .guide ul {
  width: 680px;
  margin: 0 auto;
}

#access .guide ul li {
  margin-right: 40px;
  text-align: center;
  float: left;
}

#access .guide ul li:last-child {
  margin-right: 0;
}

#company .heading-company {
  background: url(../images/company/mainvisual_bg02.jpg) no-repeat;
  background-size: cover;
  background-position: center center;
  width: 100%;
  height: 520px;
  box-sizing: border-box;
  display: grid;
  place-items: center;
  color: #fff;
}

#company .mainvisual-company .heading-title {
  color: #fff;
  font-size: 3em;
  line-height: 1.4;
}

#company .company-box {
  width: 1200px;
  margin: 100px auto;
}

#company .company-box h3 {
  font-size: 1em;
  font-weight: bold;
}

#company .company-box ul {
  padding: 0 10px 20px;
  margin-bottom: 20px;
  border-bottom: 1px solid #ccc;
}

/* #company .company-box ul:last-child {
  margin-bottom: 2px;
  border-bottom: 1px solid #ccc;
} */
#company .company-box ul li {
  width: 240px;
  line-height: 1.5em;
  font-size: 1.1em;
  display: table-cell;
  vertical-align: middle;
}

#company .company-box ul li:last-child {
  width: 680px;
}

#company .company-box ul li.f-l {
  width: 300px;
}

#company .company-access {
  background: #eee;
  padding: 70px 0;
}

#company .company-accessbg {
  width: 1200px;
  margin: 0 auto;
}

#company .map-studio {
  width: 1200px;
  margin: 60px auto 0;
  background: #fff;
}

#company .map-content {
  width: 640px;
  margin: 0 auto;
  padding: 60px 0 30px;
}

#company .map-text {
  line-height: 1.4;
}

#company .map-detail {
  margin: 0 0 40px;
}

#company .map {
  margin: 20px auto 0;
}

#faq .mv-faq {
  margin: 10px 0;
  padding: 70px 10px;
  background: #222;
}

#faq .en-title {
  color: #fff;
}

#faq .faq-inner {
  width: 1000px;
  margin: 70px auto;
  line-height: 1.5em;
  font-size: 1.1em;
}

#faq .faq-inner h3 {
  width: 900px;
  margin: 0 auto 30px;
  padding-bottom: 10px;
  text-align: left;
  border-bottom: 1px solid #f39800;
  color: #f39800;
  font-size: 1.8em;
  font-weight: bold;
}

#faq #pankuzu {
  padding: 0;
}

/*チェックボックスを消す*/
.checkbox {
  /* display: none; */
  position: absolute;
  white-space: nowrap;
  width: 1px;
  height: 1px;
  overflow: hidden;
  border: 0;
  padding: 0;
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
  margin: -1px;
}

/*アコーディオン*/
.faq-accordion {
  width: 900px;
  margin: 0 auto 14px;
}

.faq-accordion dl {
  position: relative;
}

.faq-accordion dt {
  background-color: #efefef;
  border-radius: 10px;
  padding: 16px;
}

.faq-accordion dt label::before {
  content: "Q";
  display: inline-block;
  position: absolute;
  top: 4px;
  left: 22px;
  width: 1em;
  height: 1em;
  padding: 8px;
  font-size: 1.1em;
  line-height: 1;
  font-weight: bold;
  text-align: center;
  color: #fff;
  background-color: #222222;
  border-radius: 1em;
}

.faq-accordion dt label {
  position: relative;
  display: block;
  padding: 10px 20px;
  cursor: pointer;
}

.faq-accordion dt span {
  display: inline-block;
  padding: 0 0 0 46px;
}

.faq-accordion dd span {
  display: inline-block;
  padding: 0 0 0 70px;
}

/*ラベル内の矢印の設定*/
.faq-accordion dt label::after {
  content: "";
  display: inline-block;
  position: absolute;
  top: 0.75em;
  right: 10px;
  width: 10px;
  height: 10px;
  border: solid 2px #f39700;
  border-top: 0;
  border-left: 0;
  transform: rotate(45deg);
  transition: all 0.4s ease;
}

/*表示される要素の基本設定*/
.faq-accordion dd {
  position: relative;
  /* display: flex; */
  height: 0;
  transition: 0.4s;
  overflow: hidden;
  border: solid 2px transparent;
  /* padding-left: calc(1em + 5px); */
  /* text-indent: calc(-1em + -15px); */
  margin: 14px 30px 0 11px;
}

.faq-accordion dd::before {
  content: "A";
  position: absolute;
  top: 0;
  left: 3%;
  display: inline-block;
  padding: 8px;
  width: 1em;
  height: 1em;
  vertical-align: top;
  font-size: 1.1em;
  line-height: 1;
  font-weight: bold;
  text-align: center;
  color: #fff;
  background-color: #f39800;
  border-radius: 1em;
}

/*ラベル内の矢印のアニメーション設定*/
.checkbox:checked ~ dl dt label::after {
  transform: rotate(-135deg);
  top: 1.2em;
}

/*表示される要素のアニメーション設定*/
.checkbox:checked ~ dl dd {
  height: auto;
  /* padding: 14px 20px; */
}

#privacy_policy,
#contact {
  padding-bottom: 100px;
}

#privacy_policy h2.tit,
#contact h2.tit {
  padding-bottom: 0;
}

#privacy_policy h3,
#contact h3 {
  padding-bottom: 10px;
  border-bottom: 4px solid #333;
}

#privacy_policy .privacy-policy-inner,
#privacy_policy .contact-inner,
#contact .privacy-policy-inner,
#contact .contact-inner {
  width: 1020px;
  margin: 0 auto 100px;
}

#privacy_policy .privacy-policy-inner .txt,
#privacy_policy .contact-inner .txt,
#contact .privacy-policy-inner .txt,
#contact .contact-inner .txt {
  margin: 2px 0 30px;
  padding: 20px 20px 30px;
  line-height: 1.5em;
  font-size: 1.1em;
  border-top: 1px solid #333;
  border-bottom: 1px solid #333;
}

#privacy_policy .privacy-policy-inner ol,
#privacy_policy .contact-inner ol,
#contact .privacy-policy-inner ol,
#contact .contact-inner ol {
  margin-left: 30px;
  font-size: 0.9em;
}

/* 【contact】問い合わせページ
--------------------------------------------------------- */
#contact {
  padding-bottom: 0;
}

#contact .announce {
  width: 1000px;
  margin: 0 auto;
  padding: 20px;
  line-height: 1.5;
  border: 2px solid #f00;
  text-align: center;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

#contact .announce span {
  color: #f00;
  font-weight: bold;
}

#contact .wh-border {
  margin: 40px auto 10px;
}

#contact .contact-box ul {
  width: 290px;
  margin: 0 auto;
}

#contact .contact-box ul li img {
  width: 100%;
  height: auto;
}

#contact .contact-box ul li:last-child {
  margin-right: 0;
}

#contact .contact-box ul li .btn {
  width: 130px;
  margin-top: -9px;
}

#contact .contact-box ul li .btn a {
  width: 80px;
  padding: 10px;
  border-radius: 8px;
}

#contact .bg-dark h2 {
  color: #fff;
  margin-bottom: 30px;
}

#contact .bg-dark .contact-box .mail-txt {
  margin-top: 5px;
  color: #fff;
  font-size: 1.4em;
  line-height: 1.8;
}

#site-map h3 {
  width: 1100px;
  margin: 40px auto 2px;
  padding: 20px 0;
  text-align: center;
  border-top: 4px solid #333;
  border-bottom: 4px solid #333;
}

#site-map .site-map-inner {
  width: 1100px;
  margin: 0 auto 200px;
  border-top: 1px solid #333;
  border-bottom: 1px solid #333;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

#site-map .site-map-inner ul {
  padding-bottom: 30px;
}

#site-map .site-map-inner ul.map-box01 {
  border-bottom: 1px dotted #ccc;
}

#site-map .site-map-inner ul.map-box01:nth-child(2) li ul {
  width: 25% !important;
}

#site-map .site-map-inner ul.map-box01:nth-child(2) li ul:nth-child(3n + 1) {
  clear: none;
}

#site-map .site-map-inner ul.map-box01:nth-child(2) li ul:nth-child(4n + 1) {
  clear: both;
}

#site-map .site-map-inner ul li {
  width: 1000px;
  margin: 0 auto;
}

#site-map .site-map-inner ul li ul {
  width: 33%;
  margin: 20px auto 0;
  padding-bottom: 0;
  float: left;
  font-size: 1.1em;
}

#site-map .site-map-inner ul li ul:nth-child(3n + 1) {
  clear: both;
}

#site-map .site-map-inner ul li ul li {
  width: 100%;
  padding: 5px 0 0 40px;
  line-height: 1.3em;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

#site-map .site-map-inner ul li ul li:first-child a {
  line-height: 28px;
}

#site-map .site-map-inner ul li ul li:first-child {
  margin: 0;
  padding: 0;
}

#site-map .site-map-inner ul li ul li.no-link {
  color: #999;
}

#site-map .site-map-inner ul li ul li.no-link img {
  vertical-align: -0.45em;
}

#site-map .site-map-inner ul li ul li a {
  color: #000;
}

#site-map .site-map-inner ul li ul li a:hover {
  color: #8eb3ff;
}

#site-map .site-map-inner ul li ul li img {
  margin-right: 5px;
}

#not-found {
  padding: 60px 0 0;
}

#not-found .btn {
  width: 80%;
  margin: 20px auto 0;
  padding: 10px;
  background: #000;
  color: #fff;
  font-size: 1.3em;
  display: block;
}

#not-found .btn img {
  margin-right: 10px;
  vertical-align: -0.35em;
}

/* ==========================================================================
   Media Queries (max-width: 640px)
   ========================================================================== */
@media only screen and (max-width: 640px) {
  #responsive {
    min-width: 100%;
    /* SP版 > ページ骨組
    --------------------------------------------------------- */
    /* SP版 > ヘッダー
    --------------------------------------------------------- */
    /* #header{
        min-width: 100%;
        @include box-shadow(0 0 10px -2px #000);
        position: inherit;
        &:before{
            min-width: 100%;
            height: 90px;
        }
        .h-top{
            width: 100%;
            text-align: center;
        }
        .h-middle{
            height: 60px;
            .h-inner{
                width: 100%;
                height: 60px;
                .bg-flower{
                    height: 60px;
                    background-size: 100% 60px;
                }
                .logo{
                    width: 120px;
                    a{
                        width: 120px;
                        margin-top: 18px;
                        img{
                            width: 100%;
                        }
                    }
                }
            }
        }
    } */
    /* SP版 > メニュー
    --------------------------------------------------------- */
    /* SP版 > パンくずリスト
    --------------------------------------------------------- */
    /* SP版 > フッター
    --------------------------------------------------------- */
    /*-- End_tag----------*/
  }

  #responsive .sp-none {
    display: none !important;
  }

  #responsive .pc-none {
    display: inherit;
  }

  #responsive video.player {
    width: 100% !important;
    height: auto;
  }

  #responsive body {
    margin: 0;
    background: none;
    -moz-text-size-adjust: none;
    -ms-text-size-adjust: 100%;
    -webkit-text-size-adjust: 100%;
    text-size-adjust: 100%;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
  }

  #responsive #wrap {
    width: auto;
    min-width: inherit;
    margin: 0;
    padding: 0;
    position: relative;
  }

  #responsive #header {
    position: fixed !important;
    min-width: 100%;
    padding: 0;
    -moz-box-shadow: 0 0 10px -2px #000;
    -webkit-box-shadow: 0 0 10px -2px #000;
    box-shadow: 0 0 10px -2px #000;
    position: inherit;
    z-index: 10;
  }

  #responsive #header .h-top {
    width: 100%;
    text-align: center;
  }

  #responsive #header .h-top .logo {
    width: 50%;
    padding: 10px;
  }

  #responsive #header .h-top .logo img {
    width: auto;
    height: 35px;
  }

  #responsive #header .h-top h1 {
    width: 100%;
    padding: 10px 30px 8px;
    line-height: 1.4em;
    background: #1e1e1e;
    color: #fff;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
  }

  #responsive #sp-nav .drawer-hamburger {
    position: fixed;
    margin: 6px 10px 0 0;
    padding: 10px 0.75rem 21px;
    z-index: 20;
  }

  #responsive #sp-nav .drawer-nav li {
    border-bottom: 1px solid #999;
  }

  #responsive #sp-nav .drawer-nav li:first-child {
    position: relative;
  }

  #responsive #sp-nav .drawer-nav li li {
    border-top: 1px dotted #999;
    border-bottom: none;
    background: #eee;
  }

  #responsive #sp-nav .drawer-nav li li a {
    padding: 10px 10px 10px 20px;
    line-height: 1.5em;
  }

  #responsive #sp-nav .drawer-nav .coming-soon {
    color: #ccc;
  }

  #responsive #sp-nav .drawer-nav select {
    position: absolute;
    top: 17px;
    left: 80px;
    z-index: 2;
    font-size: 16px;
  }

  #responsive #pankuzu {
    width: 95%;
    margin: 10px auto;
    padding: 0;
  }

  #responsive #pankuzu .pankuzu-list {
    width: 100%;
  }

  #responsive #pankuzu .pankuzu-list li {
    float: none;
    line-height: 1.3em;
    display: inline;
  }

  #responsive #footer .site-map .sm-inner {
    width: 100%;
    background: #222;
    color: #fff;
  }

  /* #responsive #footer .site-map .sm-inner ul {
    width: 100%;
  }
  #responsive #footer .site-map .sm-inner ul li {
    margin: 0;
    float: none;
  }
  #responsive #footer .site-map .sm-inner ul li a {
    padding: 15px;
    display: block;
  }
  #responsive #footer .site-map .sm-inner ul li .coming-soon {
    padding: 15px;
  }
  #responsive #footer .site-map .sm-inner ul:nth-child(2) {
    width: 100%;
    margin: 0;
  } */
  #responsive #footer .foot-logo-area {
    width: 100%;
    background: #666;
  }

  #responsive #footer .foot-logo-area .foot-logo-inner {
    width: 100%;
    padding: 0;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
  }

  #responsive #footer .foot-logo-area .foot-logo-inner .foot-logo {
    width: 100%;
    padding: 20px 0;
    background: #111;
    float: none;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
  }

  #responsive #footer .foot-logo-area .foot-logo-inner .foot-logo a {
    width: 120px;
    margin: 0 auto;
    display: block;
  }

  #responsive #footer .foot-logo-area .foot-logo-inner .foot-logo a img {
    width: 100%;
  }

  /* #responsive #footer .foot-logo-area .foot-logo-inner .copyright {
    margin: 15px 0 45px;
  } */
  #responsive #footer .foot-sp {
    width: 250px;
    margin: 0 auto;
    padding: 10px;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
  }

  #responsive #footer .foot-sp .foot-contact {
    margin: 0;
  }

  #responsive #footer .foot-logo-area .foot-logo-inner .foot-contact a {
    width: 33%;
    padding: 20px 0;
  }

  #footer .foot-logo-area .foot-logo-inner .foot-contact {
    width: 100%;
    display: flex;
    justify-content: space-between;
    float: inherit;
  }

  #responsive #footer .foot-sp .foot-chat {
    margin: 0;
    float: left;
  }
}

/*=========================================================

■ SP版スタイルシート
 ・見出し
 ・共通デザインレイアウト
 ・共通HTMLパーツデザインレイアウト
 ・項目別共通レイアウト
 ・select input-type textarea
 ・微調節・細かい共通パーツ

=========================================================*/
@media only screen and (max-width: 640px) {
  #responsive {
    font-size: 1em;
    /* SP版 > 見出し
    --------------------------------------------------------- */
    /* ----- 大見出し ----- */
    /* SP版 > 共通デザインレイアウト
    --------------------------------------------------------- */
    /* ----- 取引先企業様 ----- */
    /* SP版 > select input-type textarea
    --------------------------------------------------------- */
    /* SP版 > 微調節・細かい共通パーツ
    --------------------------------------------------------- */
    /*-- End_tag----------*/
  }

  #responsive .big-title-box {
    padding: 30px 10px 30px;
  }

  #responsive .big-title-box h2.en-title {
    line-height: 1.2em;
  }

  #responsive .big-title-box h2.en-title span {
    line-height: 1em;
  }

  #responsive .big-title-box .tit-text {
    text-align: left;
  }

  #responsive .big-title-box .tit-text br {
    display: none;
  }

  #responsive #main-visual {
    background-size: 25%;
  }

  #responsive #main-visual h2 {
    font-size: 2em;
    padding: 15px 0;
  }

  #responsive #main-visual .mv-inner {
    background-size: 25%;
  }

  #responsive #main-visual .mv-inner p img {
    width: 100%;
    height: auto;
  }

  #responsive .sp-catch-wrap {
    padding: 10px 15px 20px 8px;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
  }

  #responsive .catch-box {
    width: 100%;
    margin: 10px auto 15px;
  }

  #responsive .catch-box .catch-inner h2 {
    padding: 10px 17px 10px 10px;
  }

  #responsive .catch-box .catch-inner h2 br {
    display: none;
  }

  #responsive .catch-box .catch-inner .text {
    padding: 0 17px 10px 10px;
    line-height: 1.5em;
    font-size: 1em;
    text-align: left;
  }

  #responsive .catch-box .catch-inner .text br {
    display: none;
  }

  #responsive .sp-whbd-wrap {
    padding: 0 2px 0 8px;
  }

  #responsive .sp-whbd-wrap .wh-border {
    width: 100%;
  }

  #responsive .sp-whbd-wrap .wh-border .wh-border-inner .contact-box {
    padding: 20px 10px 20px 16px;
  }

  #responsive .sp-whbd-wrap .wh-border .wh-border-inner .contact-box .cb-txt {
    font-size: 1.5em;
    line-height: 1.3em;
  }

  #responsive .sp-whbd-wrap .wh-border .wh-border-inner .contact-box .btn {
    width: 90%;
    margin-top: 15px;
  }

  #responsive .quick-instruction-left .qkin-inner {
    width: 100%;
    padding: 20px 10px;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
  }

  #responsive .quick-instruction-left .qkin-inner .photo {
    width: 100%;
    height: auto;
    float: none;
  }

  #responsive .quick-instruction-left .qkin-inner .photo img {
    width: 100%;
    height: auto;
  }

  #responsive .quick-instruction-left .qkin-inner .txt-box {
    width: 100%;
    height: auto;
    float: none;
    position: static;
  }

  #responsive .quick-instruction-left .qkin-inner .txt-box .txt-inner {
    position: static;
    margin-top: 10px;
    top: auto;
    -moz-transform: translate(0%, 0%);
    -ms-transform: translate(0%, 0%);
    -webkit-transform: translate(0%, 0%);
    transform: translate(0%, 0%);
  }

  #responsive .quick-instruction-left .qkin-inner .txt-box .txt-inner .tit {
    margin-bottom: 5px;
    text-align: center;
    font-size: 1.8em;
    line-height: 1.2em;
  }

  #responsive .quick-instruction-left .qkin-inner .txt-box .txt-inner .txt {
    line-height: 1.5em;
    height: auto !important;
  }

  #responsive .quick-instruction-left .qkin-inner .txt-box .txt-inner .txt br {
    display: none;
  }

  #responsive
    .quick-instruction-left
    .qkin-inner
    .txt-box
    .txt-inner
    .txt.br
    br {
    display: block;
  }

  #responsive .quick-instruction-left .qkin-inner .txt-box .txt-inner .btn {
    width: 90%;
    margin: 5px auto 0;
  }

  #responsive .quick-instruction-right .qkin-inner {
    width: 100%;
    padding: 20px 10px;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
  }

  #responsive .quick-instruction-right .qkin-inner .photo {
    width: 100%;
    float: none;
  }

  #responsive .quick-instruction-right .qkin-inner .photo img {
    width: 100%;
    height: auto;
  }

  #responsive .quick-instruction-right .qkin-inner .txt-box {
    width: 100%;
    height: auto;
    float: none;
  }

  #responsive .quick-instruction-right .qkin-inner .txt-box .txt-inner {
    position: static;
    margin-top: 10px;
    transform: translate(0, 0);
  }

  #responsive .quick-instruction-right .qkin-inner .txt-box .txt-inner .tit {
    margin-bottom: 5px;
    text-align: center;
    font-size: 1.8em;
    line-height: 1.2em;
  }

  #responsive .quick-instruction-right .qkin-inner .txt-box .txt-inner .txt {
    line-height: 1.5em;
    height: inherit !important;
  }

  #responsive .quick-instruction-right .qkin-inner .txt-box .txt-inner .txt br {
    display: none;
  }

  #responsive .quick-instruction-right .qkin-inner .txt-box .txt-inner .btn {
    width: 90%;
    margin: 5px auto 0;
  }

  #responsive .bg-washi .washi-inner {
    width: 100%;
    padding: 20px 10px;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
  }

  #illust,
  #narration,
  #sound,
  #movie,
  #promotion,
  #works,
  #faq,
  #access,
  #company,
  #privacy_policy,
  #site-map,
  #works-illust,
  #illust-character,
  #illust-design,
  #portfolio,
  .portfolio-sub {
    padding: 58px 0 0;
  }

  #responsive #pankuzu .pankuzu-contact {
    margin: 70px 0 0;
    padding: 0;
  }

  #responsive #top #works-list h2,
  #responsive #works #works-list h2,
  #responsive #works-illust #works-list h2 {
    margin: 30px 0 0;
    font-size: 2em;
  }

  #responsive #top #works-list .works-list-inner,
  #responsive #works #works-list .works-list-inner,
  #responsive #works-illust #works-list .works-list-inner {
    margin: 0;
  }

  #responsive #top #works-list .works-list-inner ul,
  #responsive #works #works-list .works-list-inner ul,
  #responsive #works-illust #works-list .works-list-inner ul {
    width: 100%;
    padding: 10px 10px 0;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
  }

  #responsive #top #works-list .works-list-inner ul li,
  #responsive #works #works-list .works-list-inner ul li,
  #responsive #works-illust #works-list .works-list-inner ul li {
    width: 49%;
    margin-right: 2%;
    padding-bottom: 0;
  }

  #responsive #top #works-list .works-list-inner ul li .client-name,
  #responsive #works #works-list .works-list-inner ul li .client-name,
  #responsive #works-illust #works-list .works-list-inner ul li .client-name {
    font-size: 0.85em;
  }

  #responsive #top #works-list .works-list-inner ul li .title-name,
  #responsive #works #works-list .works-list-inner ul li .title-name,
  #responsive #works-illust #works-list .works-list-inner ul li .title-name {
    width: 100%;
    margin: 0;
    font-size: 1em;
  }

  #responsive #top #works-list .works-list-inner ul li .copyright,
  #responsive #works #works-list .works-list-inner ul li .copyright,
  #responsive #works-illust #works-list .works-list-inner ul li .copyright {
    width: 100%;
    padding: 10px 0;
    position: static;
    overflow-wrap: break-word;
    word-wrap: break-word;
  }

  #responsive #top #works-list .works-list-inner ul li:nth-child(5n),
  #responsive #works #works-list .works-list-inner ul li:nth-child(5n),
  #responsive #works-illust #works-list .works-list-inner ul li:nth-child(5n) {
    margin-right: 2%;
  }

  #responsive #top #works-list .works-list-inner ul li:nth-child(2n),
  #responsive #works #works-list .works-list-inner ul li:nth-child(2n),
  #responsive #works-illust #works-list .works-list-inner ul li:nth-child(2n) {
    margin-right: 0;
  }

  #responsive #top #works-list .works-list-inner ul li a,
  #responsive #works #works-list .works-list-inner ul li a,
  #responsive #works-illust #works-list .works-list-inner ul li a {
    overflow-wrap: break-word;
    word-wrap: break-word;
  }

  #responsive #top #works-list .works-list-inner input,
  #responsive #works #works-list .works-list-inner input,
  #responsive #works-illust #works-list .works-list-inner input {
    width: 70%;
    margin: 0 auto;
    padding: 15px 0;
    background: #fff;
    border-radius: 10px;
    font-size: 1em;
    border: 1px solid;
    -webkit-appearance: none;
  }

  #responsive #top #works-list .works-list-inner input:hover,
  #responsive #works #works-list .works-list-inner input:hover,
  #responsive #works-illust #works-list .works-list-inner input:hover {
    cursor: pointer;
  }

  #responsive #top #works-list .works-list-inner input#illust-more,
  #responsive #works #works-list .works-list-inner input#illust-more,
  #responsive #works-illust #works-list .works-list-inner input#illust-more {
    border-color: #e02953;
    color: #e02953;
  }

  #responsive #top #works-list .works-list-inner input#game-sound-more,
  #responsive #top #works-list .works-list-inner input#original-music-more,
  #responsive #works #works-list .works-list-inner input#game-sound-more,
  #responsive #works #works-list .works-list-inner input#original-music-more,
  #responsive #works-illust #works-list .works-list-inner input#game-sound-more,
  #responsive
    #works-illust
    #works-list
    .works-list-inner
    input#original-music-more {
    border-color: #d37b1c;
    color: #d37b1c;
  }

  #responsive #top #works-list .works-list-inner input#animation-more,
  #responsive #top #works-list .works-list-inner input#movie-more,
  #responsive #works #works-list .works-list-inner input#animation-more,
  #responsive #works #works-list .works-list-inner input#movie-more,
  #responsive #works-illust #works-list .works-list-inner input#animation-more,
  #responsive #works-illust #works-list .works-list-inner input#movie-more {
    border-color: #8567b2;
    color: #8567b2;
  }

  #responsive #top #works-list .works-list-inner .btn,
  #responsive #works #works-list .works-list-inner .btn,
  #responsive #works-illust #works-list .works-list-inner .btn {
    width: 80%;
    margin: 5px auto 0;
  }

  #responsive #client-logo {
    padding: 40px 0;
  }

  #responsive #client-logo ul {
    width: 90%;
  }

  #responsive #client-logo ul li {
    width: 32%;
    margin: 0 2% 2% 0;
  }

  #responsive #client-logo ul li img {
    width: 100%;
  }

  #responsive #client-logo ul li:nth-child(5n) {
    margin-right: 2%;
  }

  #responsive #client-logo ul li:nth-child(3n) {
    margin-right: 0;
  }

  #responsive #client-logo table {
    width: 100%;
  }

  #responsive #client-logo table tr td img {
    padding: 5px 10px;
  }

  #responsive #client-list {
    margin: 0;
  }

  #responsive #client-list .client-list-inner {
    width: 100%;
    padding: 20px 10px;
    background: url("../images/sound/sp_catch_bg.jpg");
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
  }

  #responsive #client-list .client-list-inner .list-box {
    width: 100%;
    margin-top: 15px;
    padding: 10px;
  }

  #responsive #client-list .client-list-inner .list-box ul {
    width: 100%;
  }

  #responsive #client-list .client-list-inner .list-box ul li {
    width: 100%;
  }

  /* add */
  h2.en-title {
    font-size: 1.8em;
  }

  /* Why Choose G-angle  (merit---sp) */
  #responsive .ct-merit ul {
    display: block;
    padding: 50px 0 0;
  }

  #responsive .ct-merit ul li {
    width: 90%;
    margin: 0 auto 40px;
  }

  #responsive .ct-merit ul li p {
    text-align: left;
  }

  #responsive .ct-merit {
    padding: 40px 0 40px;
  }

  #responsive .ct-merit ul li h3 {
    margin: 10px 0;
    font-size: 1.4em;
  }

  #responsive #illust .illustration-works {
    padding: 40px 0;
  }

  /* kv sp */
  #responsive .main-detail {
    width: 100%;
    position: initial;
    padding: 30px 20px;
  }

  #responsive .main-detail h2 {
    display: block;
    font-size: 2.2em;
    margin-bottom: 10px;
    text-align: center;
  }

  #responsive .main-detail span {
    width: 180px;
    display: block;
    margin: 0 auto 20px;
    padding: 4px 4px 4px 10px;
    text-align: center;
    letter-spacing: 4px;
    font-size: 1em;
  }

  #responsive .main-detail p {
    font-size: 1em;
    text-align: left;
    line-height: 1.6;
  }

  #responsive #top #top-main {
    height: auto;
  }

  #responsive #top #top-main .tm-inner {
    width: 100%;
  }

  #responsive #top #top-main .tm-inner .bg-circle-le,
  #responsive #top #top-main .tm-inner .bg-circle-ri,
  #responsive #top #top-main .tm-inner .photo {
    display: none;
  }

  #responsive #top #top-main .tm-inner .detail-box {
    width: 100%;
    padding: 30px 10px;
    position: static;
  }

  #responsive #top #top-main .tm-inner .detail-box h2 {
    font-size: 2em;
  }

  #responsive #top #top-main .tm-inner .detail-box .movie {
    margin: 10px 0;
  }

  #responsive #top #top-main .tm-inner .detail-box .movie img {
    width: 100%;
    height: auto;
  }

  #responsive #top #top-main .tm-inner .detail-box .text {
    font-size: 1.2em;
    text-align: left;
  }

  #responsive #top #top-main .tm-inner .detail-box .text br {
    display: none;
  }

  #responsive #top #top-main {
    height: auto;
    overflow: initial;
  }

  #responsive #top #top-main .video-bg video {
    min-width: initial;
    position: initial;
    opacity: initial;
  }

  #responsive #top #top-main .detail-box {
    height: auto;
    position: initial;
  }

  #responsive #top #top-main .detail-box .inner-wrap {
    position: initial;
    padding: 10px;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
  }

  #responsive #top #top-main .detail-box .inner-wrap .inner {
    width: 100%;
  }

  #responsive #top #top-main .detail-box .inner-wrap .inner h2 {
    margin: 0;
    font-size: 2em;
    text-align: center;
    display: block;
  }

  #responsive #top #top-main .detail-box .inner-wrap .inner .text {
    margin-top: 10px;
    font-size: 1em;
    display: block;
  }

  #responsive #top #top-main .detail-box .inner-wrap .inner .text br {
    display: none;
  }

  #responsive #top #pr {
    width: 94%;
    margin: 20px auto;
    font-size: 16px;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
  }

  #responsive #top #pr h2 {
    padding: 5px 0;
    font-size: 30px;
  }

  #responsive #top #pr h3 {
    padding: 10px 0 5px;
  }

  #responsive #top #pr p {
    padding: 0 10px 15px;
    text-align: left;
  }

  #responsive #top #pr p br {
    display: none;
  }

  #responsive #top #main-service {
    height: auto;
    padding: 40px 0;
  }

  #responsive #top #main-service .title {
    margin: 0 10px;
  }

  #responsive #top #main-service .title h2 {
    font-size: 1.8em;
  }

  #responsive #top #main-service .title p br {
    display: block;
  }

  #responsive #top #main-service .inner {
    width: 100%;
    margin: 50px auto 0;
  }

  #responsive #top #main-service .inner ul {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
  }

  #responsive #top #main-service .inner .our_service_box {
    width: 90%;
    min-height: 280px;
    padding: 15px 0 40px;
    margin: 0 0 25px;
  }

  #responsive #top #main-service .inner .our_service_box .box-after p {
    padding: 20px 20px 0;
  }

  #responsive .contact-list .contact-list-inner ul {
    display: flex;
    justify-content: center;
    margin: 30px 0 0;
    flex-wrap: wrap;
  }

  #responsive .contact-list .contact-list-inner ul li {
    margin: 10px 0;
  }

  #responsive .contact-list {
    padding: 50px 10px;
  }

  #responsive #works #main-visual,
  #responsive #works-illust #main-visual {
    height: auto;
    background: none;
  }

  #responsive #works #main-visual .sp-mein-pict,
  #responsive #works-illust #main-visual .sp-mein-pict {
    width: 100%;
  }

  #responsive #works #main-visual .sp-mein-pict img,
  #responsive #works-illust #main-visual .sp-mein-pict img {
    width: 100%;
  }

  #responsive #works #main-visual .mv-inner,
  #responsive #works-illust #main-visual .mv-inner {
    width: 100%;
    height: auto;
    position: static;
  }

  #responsive #works #main-visual .mv-inner .box,
  #responsive #works-illust #main-visual .mv-inner .box {
    width: 100%;
    margin: 0 !important;
    padding: 10px;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
  }

  #responsive #works #main-visual .mv-inner .box h2,
  #responsive #works-illust #main-visual .mv-inner .box h2 {
    margin: 0 0 10px;
    font-size: 2em;
    text-align: center;
  }

  #responsive #works #main-visual .mv-inner .box .txt br,
  #responsive #works-illust #main-visual .mv-inner .box .txt br {
    display: none;
  }

  #responsive #works #main-visual .mv-inner .box .link-btn,
  #responsive #works-illust #main-visual .mv-inner .box .link-btn {
    width: 100%;
    margin: 10px 0 0;
    border-bottom: 1px solid #e02953;
  }

  #responsive #works #main-visual .mv-inner .box .link-btn li a,
  #responsive #works-illust #main-visual .mv-inner .box .link-btn li a {
    float: none;
    margin: 0;
    padding: 22px 0;
    text-align: center;
    border-bottom: none;
    border-radius: 0;
  }

  #responsive #works #main-visual .mv-inner .box .btn,
  #responsive #works-illust #main-visual .mv-inner .box .btn {
    width: 100%;
    margin: 10px 0;
    position: static;
  }

  #responsive #works-illust #game-character h2 {
    margin: 50px 10px 10px;
    font-size: 2em;
  }

  #responsive #works-illust #game-character .h-text {
    margin: 0 10px;
    text-align: left;
  }

  #responsive #works-illust #game-character .h-text br {
    display: none;
  }

  #responsive #works-illust #game-character .game-chara-inner {
    margin: 20px 0;
  }

  #responsive #works-illust #game-character .game-chara-inner .title {
    margin: 0 0 30px;
    padding: 10px;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
  }

  #responsive
    #works-illust
    #game-character
    .game-chara-inner
    .title
    .tit-inner {
    width: 100% !important;
    padding: 5px 0;
  }

  #responsive
    #works-illust
    #game-character
    .game-chara-inner
    .title
    .tit-inner
    .tit-pict {
    width: 100%;
    margin: 0 auto;
    float: none;
  }

  #responsive
    #works-illust
    #game-character
    .game-chara-inner
    .title
    .tit-inner
    .tit-pict
    img {
    width: 100%;
  }

  #responsive
    #works-illust
    #game-character
    .game-chara-inner
    .title
    .tit-inner
    .tit-detail {
    text-align: center;
  }

  #responsive
    #works-illust
    #game-character
    .game-chara-inner
    .title
    .tit-inner
    .tit-detail
    .game-title {
    margin: 15px 0 0 !important;
  }

  #responsive
    #works-illust
    #game-character
    .game-chara-inner
    .title
    .tit-inner
    .tit-detail
    .client {
    margin-bottom: 5px;
  }

  #responsive
    #works-illust
    #game-character
    .game-chara-inner
    .title
    .tit-inner
    .tit-detail
    .copyright {
    margin-top: 5px;
    padding-top: 5px;
    line-height: 1.2em;
    border-top: 1px dotted #64c5ff;
  }

  #responsive #works-illust #game-character .game-chara-inner .pict {
    width: 100%;
    padding: 0 10px 30px;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
  }

  #responsive #works-illust #game-character .game-chara-inner .pict ul li {
    width: 48%;
    margin: 10px 0 0 !important;
  }

  #responsive #works-illust #game-character .game-chara-inner .pict ul li img {
    width: 100%;
    height: auto;
  }

  #responsive
    #works-illust
    #game-character
    .game-chara-inner
    .pict
    ul
    li:nth-child(2n) {
    float: right;
  }

  #responsive
    #works-illust
    #game-character
    .game-chara-inner
    .pict
    ul.three
    li {
    width: 100%;
    margin: 10px 0 0;
    float: none;
  }

  #responsive
    #works-illust
    #game-character
    .game-chara-inner
    .pict
    ul.three
    li
    img {
    width: 100%;
    height: auto;
  }

  #responsive
    #works-illust
    #game-character
    .game-chara-inner
    .pict
    ul.three
    li:nth-child(2n) {
    float: none;
  }

  #responsive
    #works-illust
    #game-character
    .game-chara-inner
    .pict.record04
    ul.three
    li,
  #responsive
    #works-illust
    #game-character
    .game-chara-inner
    .pict.record05
    ul.three
    li,
  #responsive
    #works-illust
    #game-character
    .game-chara-inner
    .pict.record06
    ul.three
    li,
  #responsive
    #works-illust
    #game-character
    .game-chara-inner
    .pict.record07
    ul.three
    li,
  #responsive
    #works-illust
    #game-character
    .game-chara-inner
    .pict.record08
    ul.three
    li,
  #responsive
    #works-illust
    #game-character
    .game-chara-inner
    .pict.record09
    ul.three
    li {
    width: 48%;
    float: left;
  }

  #responsive
    #works-illust
    #game-character
    .game-chara-inner
    .pict.record04
    ul.three
    li:nth-child(2n),
  #responsive
    #works-illust
    #game-character
    .game-chara-inner
    .pict.record05
    ul.three
    li:nth-child(2n),
  #responsive
    #works-illust
    #game-character
    .game-chara-inner
    .pict.record06
    ul.three
    li:nth-child(2n),
  #responsive
    #works-illust
    #game-character
    .game-chara-inner
    .pict.record07
    ul.three
    li:nth-child(2n),
  #responsive
    #works-illust
    #game-character
    .game-chara-inner
    .pict.record08
    ul.three
    li:nth-child(2n),
  #responsive
    #works-illust
    #game-character
    .game-chara-inner
    .pict.record09
    ul.three
    li:nth-child(2n) {
    float: right;
  }

  #responsive #works-illust #ip-illust h2 {
    margin: 30px 10px 10px;
    font-size: 2em;
  }

  #responsive #works-illust #ip-illust .h-text {
    margin: 0 10px 0;
    text-align: left;
  }

  #responsive #works-illust #ip-illust .h-text br {
    display: none;
  }

  #responsive #works-illust #ip-illust .ip-inner {
    margin: 20px 0 0;
  }

  #responsive #works-illust #ip-illust .ip-inner .title {
    margin: 0;
    padding: 10px;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
  }

  #responsive #works-illust #ip-illust .ip-inner .title .tit-inner {
    width: 100% !important;
    padding: 5px 0;
  }

  #responsive #works-illust #ip-illust .ip-inner .title .tit-inner .tit-pict {
    width: 100%;
    margin: 0 auto;
    float: none;
  }

  #responsive
    #works-illust
    #ip-illust
    .ip-inner
    .title
    .tit-inner
    .tit-pict
    img {
    width: 100%;
  }

  #responsive #works-illust #ip-illust .ip-inner .title .tit-inner .tit-detail {
    text-align: center;
  }

  #responsive
    #works-illust
    #ip-illust
    .ip-inner
    .title
    .tit-inner
    .tit-detail
    .game-title {
    margin: 15px 0 0 !important;
  }

  #responsive
    #works-illust
    #ip-illust
    .ip-inner
    .title
    .tit-inner
    .tit-detail
    .client {
    margin-bottom: 5px;
  }

  #responsive
    #works-illust
    #ip-illust
    .ip-inner
    .title
    .tit-inner
    .tit-detail
    .copyright {
    margin-top: 5px;
    padding-top: 5px;
    line-height: 1.2em;
    border-top: 1px dotted #da8e1b;
  }

  #responsive #works-illust #ip-illust .ip-inner .pict {
    width: 100%;
    padding: 20px 10px 30px;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
  }

  #responsive #works-illust #ip-illust .ip-inner .pict ul li {
    width: 100%;
    margin: 10px 0 0 !important;
    float: none;
  }

  #responsive #works-illust #ip-illust .ip-inner .pict ul li img {
    width: 100%;
    height: auto;
  }

  #responsive #works-illust #ip-illust .ip-inner .pict.record01 ul li,
  #responsive #works-illust #ip-illust .ip-inner .pict.record02 ul li,
  #responsive #works-illust #ip-illust .ip-inner .pict.record03 ul li {
    width: 48%;
    float: left;
  }

  #responsive
    #works-illust
    #ip-illust
    .ip-inner
    .pict.record01
    ul
    li:nth-child(2n),
  #responsive
    #works-illust
    #ip-illust
    .ip-inner
    .pict.record02
    ul
    li:nth-child(2n),
  #responsive
    #works-illust
    #ip-illust
    .ip-inner
    .pict.record03
    ul
    li:nth-child(2n) {
    float: right;
  }

  #responsive #illust #main-visual {
    width: 100%;
    height: auto;
    background-size: cover;
  }

  #responsive #illust #main-visual .tm-inner {
    width: 100%;
  }

  #responsive #illust #main-visual .tm-inner .bg-circle-le,
  #responsive #illust #main-visual .tm-inner .bg-circle-ri {
    display: none;
  }

  #responsive #illust #main-visual .tm-inner .photo {
    width: 80%;
    margin: 0 auto;
    position: initial;
  }

  #responsive #illust #main-visual .tm-inner .photo img {
    width: 100%;
    height: auto;
  }

  #responsive #illust #main-visual .tm-inner .detail-box {
    width: 100%;
    height: auto;
    padding: 15px 10px;
    background: #1e1e1e;
    position: initial;
  }

  #responsive #illust #main-visual .tm-inner .detail-box h2 {
    padding: 0 0 10px;
    font-size: 2em;
  }

  #responsive #illust #main-visual .tm-inner .detail-box h2 span {
    margin: 5px 0 0;
    font-size: 0.7em;
  }

  #responsive #illust #main-visual .tm-inner .detail-box h2 span.en {
    font-family: inherit;
    font-size: 1em;
  }

  #responsive #illust #main-visual .tm-inner .link-btn a {
    width: 100%;
    font-size: 1.3em;
    padding: 15px 0;
  }

  #responsive #illust .works-link-btn {
    margin: 0;
    padding: 0;
  }

  #responsive #illust .works-link-btn a {
    display: block;
    width: 80%;
    margin: 5px auto 20px;
    padding: 10px 0;
    font-size: 0.85em;
    color: #fff;
    background: #e82e55;
    text-align: center;
    border-radius: 10px;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
  }

  #responsive #illust .works-link-btn a .fa-caret-right {
    margin-left: 10px;
  }

  #responsive #copyright-illust ul {
    width: 100%;
  }

  #responsive #copyright-illust ul li {
    width: 48%;
    margin-right: 4%;
  }

  #responsive #copyright-illust ul li:nth-child(2n) {
    margin-right: 0;
  }

  #responsive #copyright-illust ul li .photo img {
    width: 100%;
    height: initial;
  }

  #responsive #copyright-illust ul li .tit {
    margin: 10px 0 25px;
  }

  #responsive #copyright-illust .works-link-btn a {
    width: 100%;
    margin-top: 0;
  }

  #responsive #chara-illust ul li,
  #responsive #avatar-illust ul li,
  #responsive #weapon-item-bg-illust ul li {
    margin-top: 4%;
    margin-right: 4%;
  }

  #responsive #chara-illust ul li:nth-child(2n),
  #responsive #avatar-illust ul li:nth-child(2n),
  #responsive #weapon-item-bg-illust ul li:nth-child(2n) {
    margin-right: 0;
  }

  #responsive #chara-illust .works-link-btn a,
  #responsive #avatar-illust .works-link-btn a,
  #responsive #weapon-item-bg-illust .works-link-btn a {
    width: 100%;
    margin-top: 15px;
  }

  #responsive #chara-illust ul,
  #responsive #avatar-illust ul,
  #responsive #weapon-item-bg-illust ul {
    width: 100%;
  }

  #responsive #chara-illust ul li,
  #responsive #avatar-illust ul li,
  #responsive #weapon-item-bg-illust ul li {
    width: 48%;
  }

  #responsive #chara-illust ul li img,
  #responsive #avatar-illust ul li img,
  #responsive #weapon-item-bg-illust ul li img {
    width: 100%;
    height: inherit;
  }

  #responsive #illust-design .box {
    padding: 25px 10px;
  }

  #responsive #illust-design .box .txt {
    margin-bottom: 25px;
    font-size: 1.5em;
  }

  #responsive #illust-design .box img {
    width: 100%;
    height: inherit;
  }

  /*[add] #illust*/
  #responsive #illust #service-illustration.col3 {
    width: 100%;
    padding: 40px 0;
    margin: 0;
  }

  #responsive #illust #service-illustration.col3 .inner {
    width: 100%;
    margin: 40px auto 0;
  }

  #responsive #illust #service-illustration.col3 .inner ul {
    display: block;
    width: 90%;
    margin: 0 auto;
  }

  #responsive #illust #service-illustration.col3 .inner .our_service_box {
    width: 100%;
    margin: 0 0 25px;
  }

  #responsive #illust .illustration-works ul {
    width: 95%;
    margin: 40px auto 0;
    justify-content: space-around;
  }

  #responsive #illust .illustration-works img {
    width: 100%;
    height: auto;
  }

  #responsive #illust .illustration-works ul li {
    margin: 0 0 16px;
    width: 46%;
  }

  #responsive .portfolio-img img {
    width: 100%;
    min-width: 100%;
  }

  /*END[add] #illust*/

  /* [add] portfolio sp*/
  #responsive .portfolio-header {
    width: 90%;
    margin: 0 auto;
  }

  #responsive .gallery-wrap {
    width: 90%;
    margin: 50px auto 0;
  }

  #responsive .gallery {
    padding: 0 0 40px;
  }

  .gallary-item {
    flex-basis: 50%;
  }

  #responsive .portfolio-container {
    padding: 0 0 40px;
  }

  #responsive .portfolio-wrap {
    width: 90%;
    flex-direction: column;
  }

  #responsive .portfolio-text {
    margin: 40px 0 30px;
  }

  #responsive .portfolio-content .col-three,
  #responsive .portfolio-content .col-four,
  #responsive .portfolio-content .col-two,
  #responsive .portfolio-content .col-unique {
    width: 48%;
  }

  #responsive .portfolio-heading {
    margin: 40px 0 20px;
    font-size: 1.5em;
  }

  .btn-back a {
    max-width: 90%;
    margin: 30px auto 0;
    padding: 1rem 2rem;
    font-size: 16px;
  }

  /* [add] sound */
  #responsive .our_service {
    width: 100%;
    margin: 0 0;
    background: #efefef;
    padding: 60px 0 30px;
    margin: 0;
  }

  #responsive .our_service h3 {
    text-align: center;
    margin: 0 0 50px;
  }

  #responsive .our_service p {
    padding: 0 30px 10px;
  }

  /* wrap */
  #responsive .our_service .inner {
    width: 100%;
    margin: 40px 0 auto;
  }

  #responsive .our_service .inner ul {
    display: block;
  }

  #responsive .our_service .inner .our_service_box {
    overflow: hidden;
    width: 90%;
    background-color: #ddd;
    padding: 0;
    margin: 0 auto 30px;
    box-sizing: border-box;
  }

  /* before box ------------------------------------------+ */
  #responsive .our_service .inner .our_service_box .box-before {
    bottom: inherit;
    display: block;
    width: 100%;
    height: 100%;
    background-color: #fff;
    margin: auto;
    transform: rotateY(0deg);
    opacity: 1;
    transition-duration: 0.4s;
  }

  #responsive .our_service .inner .our_service_box .box-before img {
    display: block;
    width: 88%;
    max-width: 88%;
    height: auto;
    margin: 7% auto 5%;
  }

  #responsive .our_service .inner .our_service_box .box-before h3 {
    position: initial;
    display: block;
    font-size: 17px;
    font-weight: bold;
    margin: 0 auto;
  }

  /* hover */
  #responsive .our_service .inner .our_service_box.go .box-before {
    transform: rotateY(-180deg);
    opacity: 0;
  }

  /* after box ------------------------------------------+ */
  #responsive .our_service .inner .our_service_box .box-after {
    display: flex;
    align-items: center;
    flex-direction: column;
    min-height: 80vw;
    transform: rotateY(-180deg);
    opacity: 0;
    transition-duration: 0.4s;
    height: auto;
  }

  #responsive .our_service .inner .our_service_box .box-after p {
    font-size: 16px;
    text-align: left;
    margin: auto;
    padding-top: 8px;
  }

  #responsive .our_service .inner .our_service_box .box-after a {
    display: block;
    width: 150px;
    height: 40px;
    line-height: 40px;
    border-radius: 40px;
    color: #fff;
    text-align: center;
    background: #f39700;
    padding: 0 20px;
    margin: 15px auto 0;
  }

  #responsive .our_service .inner .our_service_box .box-after a:hover {
    color: #f39700;
    background: #fff;
  }

  #responsive .our_service .inner .our_service_box .box-after .btn_more {
    margin: auto 0 0 0 !important;
    pointer-events: none;
  }

  /* hover */
  #responsive .our_service .inner .our_service_box.go .box-after {
    transform: rotateY(0deg);
    opacity: 1;
  }

  #responsive .our_service .inner .our_service_box.go .box-after .btn_more {
    display: block;
    pointer-events: initial;
  }

  /* END[add] sound */

  #responsive #narration .catch-inner h2 {
    text-align: left;
  }

  #responsive #narration .studio-box {
    margin-top: 15px;
  }

  #responsive #narration .studio-box img {
    width: 100%;
    height: inherit;
  }

  #responsive #narration .studio-box .f-l,
  #responsive #narration .studio-box .f-r {
    float: none;
  }

  #responsive #narration .studio-box .f-r {
    width: 100%;
    padding-bottom: 30px;
    height: initial;
  }

  #responsive #narration .studio-box .studio-box-inner {
    width: 100%;
    margin-top: 10px;
    position: initial;
    transform: initial;
  }

  #responsive #narration .studio-box .studio-box-inner h3 {
    width: 100%;
  }

  #responsive #narration .studio-box .studio-box-inner .border-slender {
    padding: 15px 0;
  }

  #responsive #narration .studio-box .studio-box-inner .border-bold {
    padding: 20px 0;
    line-height: 1.5em;
  }

  #responsive #narration #narrator-introduction .catch-box {
    margin: 0 auto;
  }

  #responsive #narration #narrator-introduction .catch-box p {
    padding: 10px 17px 10px 10px;
    text-align: left;
  }

  #responsive #narration #narrator-introduction .catch-box p br {
    display: none;
  }

  #responsive #narration .list-box h3 {
    width: 100%;
  }

  #responsive #narration .list-box ul {
    width: 100%;
  }

  #responsive #narration .list-box ul li {
    width: 90%;
    margin: 0 auto 10px;
    float: none;
  }

  #responsive #narration .list-box ul li:nth-child(2n) {
    float: none;
  }

  #responsive #sound .mt100 {
    margin-top: 30px !important;
  }

  #responsive #sound #main-visual {
    width: 100%;
    min-width: 100%;
    background-size: cover;
  }

  #responsive #sound #main-visual .mv-inner {
    background: none;
  }

  #responsive #sound #main-visual .mv-inner .box {
    height: auto;
    padding: 10px;
    background: none;
  }

  #responsive #sound #main-visual .mv-inner .box .box-inner {
    width: 100%;
    padding: 10px;
  }

  #responsive #sound #main-visual .mv-inner .box .box-inner h2 {
    font-size: 1.3em;
    text-align: left;
  }

  #responsive #sound #main-visual .mv-inner .box .box-inner h2 br {
    display: none;
  }

  #responsive #sound #main-visual .mv-inner .box .box-inner p {
    text-align: left;
    font-size: 1em;
  }

  #responsive #sound #main-visual .mv-inner .box .box-inner p br {
    display: none;
  }

  /* [add]movie sp */
  #responsive #movie #main-movie {
    height: auto;
    overflow: initial;
    border-top: 0;
    border-bottom: 0;
  }

  #responsive #movie .pc-none {
    display: inherit;
    border-top: 2px solid #1e1e1e;
    border-bottom: 2px solid #1e1e1f;
  }

  #responsive #movie video {
    vertical-align: bottom;
  }

  #responsive #movie video.player {
    width: 100% !important;
    height: auto !important;
  }

  #responsive #company .mainvisual-company .heading-title {
    padding: 0 10px;
    text-align: center;
    font-size: 1.4em;
    line-height: 1.2;
  }

  #responsive #company .heading-company {
    height: 220px;
  }

  #responsive #company .company-box {
    width: 90%;
    margin: 20px auto 0;
    padding: 0 0 30px;
  }

  #responsive #company .company-box ul {
    padding-bottom: 10px;
  }

  #responsive #company .company-box ul li {
    width: 100%;
    margin-bottom: 5px;
    display: block;
  }

  #responsive #company .map-content {
    width: 95%;
    padding: 30px 0;
  }

  #responsive #company .company-access {
    padding: 40px 0;
  }

  #responsive #company .company-accessbg {
    width: 90%;
  }

  #responsive #company .map-studio {
    width: 100%;
    margin: 30px auto 0;
  }

  #responsive #company .map-text {
    line-height: 1.4;
    font-size: 0.9em;
  }

  #responsive #access .mt30 {
    margin-top: 10px !important;
  }

  #responsive #access .mt30 img {
    width: 95%;
    height: initial;
  }

  #responsive #access h3 {
    width: 100%;
    margin: 15px 0 2px;
  }

  #responsive #access .txt {
    width: 100%;
    margin: 0 auto 0;
    padding: 10px;
    border-bottom: none;
  }

  #responsive #access .guide {
    width: 100%;
    margin: 2px auto 0;
    border-bottom: 4px solid #333;
  }

  #responsive #access .guide dt {
    width: 100%;
    margin: 10px 0;
    line-height: 1.5em;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
  }

  #responsive #access .guide dd {
    margin-bottom: 25px;
    padding: 0 10px;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
  }

  #responsive #access .guide dd ul {
    width: 100%;
  }

  #responsive #access .guide dd ul li {
    margin: 0 0 10px 0;
    float: none;
  }

  #responsive #access .guide dd ul li img {
    width: 100%;
    height: initial;
  }

  #responsive #access .guide dd:last-child {
    margin-bottom: 2px;
    padding-bottom: 60px;
    border-bottom: 1px solid #333;
  }

  #responsive #privacy_policy h3,
  #responsive #contact h3 {
    padding: 0 10px 10px;
    text-align: center;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
  }

  #responsive #privacy_policy .privacy-policy-inner,
  #responsive #privacy_policy .contact-inner,
  #responsive #contact .privacy-policy-inner,
  #responsive #contact .contact-inner {
    width: 100%;
    margin-bottom: 10px;
  }

  #responsive #privacy_policy .privacy-policy-inner .txt,
  #responsive #privacy_policy .contact-inner .txt,
  #responsive #contact .privacy-policy-inner .txt,
  #responsive #contact .contact-inner .txt {
    padding: 10px 10px 0;
    border-bottom: none;
  }

  #responsive #contact .announce {
    width: 95%;
    margin: 0 auto 30px;
  }

  #responsive #contact .wh-border {
    margin: 35px auto 10px;
  }

  #responsive #contact .contact-box ul {
    width: 268px;
  }

  #responsive #contact .contact-box ul li img {
    width: 100%;
    height: auto;
  }

  #responsive #contact .contact-box ul li .btn {
    width: 127px;
    margin-top: 9px;
  }

  #responsive #contact .contact-box ul li .btn a {
    width: 80px;
    padding: 0px;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
  }

  #responsive #contact .contact-box ul li .btn a img {
    width: 100%;
    margin: 0;
  }

  #responsive #contact .contact-box ul li:last-child {
    margin-right: 0;
  }

  #responsive #contact .contact-box .mail-txt {
    font-size: 1.25em;
    line-height: 1.8em;
    margin-bottom: 1px;
  }

  #faq .mv-faq {
    padding: 40px 10px;
  }

  #responsive #faq .catch-inner p {
    padding: 10px;
    text-align: left;
    font-size: 1.2em;
  }

  #responsive #faq .faq-inner {
    width: 90%;
    margin: 40px auto;
  }

  #faq .faq-inner h3 {
    width: 100%;
    margin: 0 auto 20px;
    font-size: 1.4em;
  }

  #responsive #faq .faq-accordion {
    width: 100%;
    margin: 0 auto;
  }

  #responsive #faq .faq-accordion dt label {
    font-size: 0.9em;
    padding: 0;
  }

  #responsive #faq .faq-accordion dt label::before,
  #responsive #faq .faq-accordion dd label::before {
    top: 0;
    left: 0;
  }

  #responsive #faq .faq-accordion dt label::after {
    right: 0;
    width: 8px;
    height: 8px;
  }

  #responsive #faq .faq-accordion dt span,
  #responsive #faq .faq-accordion dd span {
    padding: 0 12px 0 44px;
  }

  #responsive #faq .faq-accordion dd {
    margin: 7px 30px 7px 9px;
    font-size: 0.8em;
  }

  .faq-accordion dd::before {
    left: 2%;
  }

  #responsive #site-map h3 {
    width: 100%;
    margin: 15px auto 2px;
    padding: 15px 0;
  }

  #responsive #site-map .site-map-inner {
    width: 100%;
    margin: 0;
  }

  #responsive #site-map .site-map-inner ul {
    padding-bottom: 2px;
    border-bottom: 4px solid #333;
  }

  #responsive #site-map .site-map-inner ul.map-box01:nth-child(2) li ul {
    width: 100% !important;
  }

  #responsive #site-map .site-map-inner ul li {
    width: 100%;
  }

  #responsive #site-map .site-map-inner ul li ul {
    width: 100%;
    margin: 0;
    padding: 0;
    border: none;
  }

  #responsive #site-map .site-map-inner ul li ul li {
    padding: 0;
    border-bottom: 1px solid #333;
  }

  #responsive #site-map .site-map-inner ul li ul li:not(:first-child) {
    margin: 0;
    padding-left: 10px;
    border-bottom: 1px dotted #999;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
  }

  #responsive #site-map .site-map-inner ul li ul li:last-child {
    border-bottom: 1px solid #333;
  }

  #responsive #site-map .site-map-inner ul li ul li.no-link {
    padding: 10px;
    border-color: #333 !important;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
  }

  #responsive #site-map .site-map-inner ul li ul li a {
    padding: 10px;
    display: block;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
  }

  #responsive #not-found br {
    display: initial !important;
  }

  #responsive #not-found .catch-box .catch-inner .text {
    text-align: center;
  }

  #responsive #not-found .btn {
    margin: 15px auto 10px;
  }

  #responsive #not-found .top-contents {
    padding-bottom: 80px;
  }
}

/*	########################################################
	【MainVisual Override】illust,narration,studio,voice　!works　@20201214
######################################################### */
@media screen and (min-width: 641px) {
  /* [PC] common --------------------------------------+ */
  /* wrap */
  #main-visual-r2 {
    width: 100%;
    height: 520px;
    box-sizing: border-box;
    padding: 50px 0 0;
  }

  #main-visual-r2 * {
    box-sizing: border-box;
  }

  #main-visual-r2 .kv img,
  .main-visual-r3 .kv img {
    display: none;
  }

  /* inner */
  #main-visual-r2 .inner {
    width: 100%;
    height: 420px;
    background-color: rgba(0, 0, 0, 0.8);
  }

  /* detail */
  #main-visual-r2 .detail {
    position: relative;
    width: 1100px;
    height: 100%;
    color: #fff;
    padding: 0 18px;
    margin: 0 auto;
  }

  #main-visual-r2 h2 {
    font-size: 2.8em;
    letter-spacing: 0.07em;
    line-height: 1.1;
    padding: 31px 0 32px;
  }

  #main-visual-r2 p {
    font-size: 1.25em;
    line-height: 1.5;
    padding: 0 0 0 17px;
  }

  /* btn (link) */
  #main-visual-r2 .btn-link a {
    display: inline-block;
    font-size: 1.1em;
    color: #fff;
    background: #e82e54;
    border-radius: 4px;
    padding: 13px 23px;
    margin: 29px 0 0 0;
  }

  #main-visual-r2 .btn-link a .fa {
    margin-left: 10px;
    vertical-align: baseline;
  }

  /* contact */
  #main-visual-r2 .contact-box {
    position: absolute;
    left: 26px;
    bottom: 32px;
    display: flex;
  }

  /* list */
  #main-visual-r2 .contact-box li {
    margin: 0 28px 0 0;
  }

  /* btn (img) */
  #main-visual-r2 .contact-box a img {
    width: 84px;
    padding: 12px;
    height: auto;
    background: #f39700;
    border-radius: 6px;
  }

  /* btn (contact) */
  #main-visual-r2 .btn-contact a {
    display: inline-block;
    font-size: 1.1em;
    font-weight: bold;
    text-align: center;
    width: 84px;
    height: 84px;
    line-height: 86px;
    color: #fff;
    background: #f39700;
    border-radius: 6px;
  }

  /* [add] illust --------------------------------------+ */
  #illust .main-visual-r3 {
    background: url("../images/illust/illustration_kv.jpg") top center / cover
      no-repeat;
  }

  .main-visual-r3 {
    width: 100%;
    height: 520px;
    box-sizing: border-box;
    padding: 50px 0 0;
    background: #1e1e1e;
  }

  .main-visual-r3 * {
    box-sizing: border-box;
  }

  /* [add] narration / voice / studio --------------------------------------+ */
  #narration #main-visual-r2 {
    background: url("../images/narration/main_visual-r2.jpg") center center /
      cover no-repeat;
  }

  #narration .main-visual-r3 {
    background: url("../images/narration/main_visual-r3.jpg") center center /
      cover no-repeat;
  }

  /* #narration .main-visual-r3 .detail .sym {display:none;} */

  /* [add] sound --------------------------------------+ */
  #sound .main-visual-r3 {
    background: url("../images/sound/sound_kv.jpg") center center / cover
      no-repeat;
  }

  /* [add] promotion --------------------------------------+ */
  #promotion .main-visual-r3 {
    background: url("../images/top/promotion_mv.jpg") center center / cover
      no-repeat;
  }

  /* #sound .main-visual-r3 .detail .sym {display:none;} */

  /* [add] movie --------------------------------------+ */
  /* #movie #main-visual-r2 h2 {
  font-size: 2.8em;
  letter-spacing:0.07em;
  padding:31px 0 24px;
}
#movie #main-visual-r2 {background:url("../images/movie/main_visual-r2.jpg") center center / cover no-repeat;}
#movie #main-visual-r2 .detail .sym {
  display:block;
  position:absolute;
  right:-30px;
  bottom:-50px;
} */
}

/* MediaQueries */

@media only screen and (max-width: 640px) {
  /* [SP] common --------------------------------------+ */
  /* wrap */
  #main-visual-r2 {
    box-sizing: border-box;
    padding: 0;
  }

  #main-visual-r2 * {
    box-sizing: border-box;
  }

  #main-visual-r2 .kv img,
  .main-visual-r3 .kv img {
    display: block;
    width: 100%;
    height: auto;
  }

  /* inner */
  #main-visual-r2 .inner {
    background-color: rgba(0, 0, 0, 0.82);
  }

  /* detail */
  #main-visual-r2 .detail {
    position: relative;
    color: #fff;
    padding: 0 15px;
    margin: 0 auto;
  }

  #main-visual-r2 h2 {
    font-size: 1.9em;
    line-height: 1.2;
    letter-spacing: 0.08em;
    text-align: center;
    padding: 30px 0 25px;
  }

  #main-visual-r2 h2 span {
    display: inline-block;
  }

  #main-visual-r2 p {
    font-size: 1.1em;
    line-height: 1.7;
  }

  /* btn (link) */
  #main-visual-r2 .btn-link a {
    display: block;
    width: 92%;
    font-size: 1.2em;
    text-align: center;
    color: #fff;
    background: #e82e54;
    border-radius: 4px;
    padding: 16px 1em;
    margin: 28px auto 8px;
  }

  /* contact */
  #main-visual-r2 .contact-box {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    padding: 30px 0 0;
  }

  /* list */
  #main-visual-r2 .contact-box li {
    margin: 8px 9% 45px;
  }

  #main-visual-r2 .contact-box li:last-child {
    width: 100%;
    margin: 0 4% 50px;
  }

  /* btn (img) */
  #main-visual-r2 .contact-box a img {
    width: 90px;
    padding: 15px;
    height: auto;
    border-radius: 4px;
    background: #f39700;
  }

  /* btn (contact) */
  #main-visual-r2 .btn-contact a {
    display: inline-block;
    font-size: 1.3em;
    text-align: center;
    width: 100%;
    padding: 21px 1em;
    color: #fff;
    background: #f39700;
    border-radius: 4px;
  }

  /* [add] all --------------------------------------+ */
  #main-visual-r2 .detail .sym {
    display: none;
  }

  /* [add] illust --------------------------------------+ */
  #illust .main-visual-r3 {
    background: url("../images/illust/illustration_kv.jpg") center center /
      cover no-repeat;
  }

  /* [add] narration --------------------------------------+ */
  #narration .main-visual-r3 {
    background: url("../images/narration/main_visual-sp-r3.jpg") center center /
      cover no-repeat;
  }

  /* [add] sound --------------------------------------+ */
  #sound #main-visual-r2 {
    background: url("../images/sound/main_visual-sp-r2.jpg") center center /
      cover no-repeat;
  }

  /* [add] movie --------------------------------------+ */
  #movie #main-visual-r2 {
    background: url("../images/movie/main_visual-sp-r2.jpg") center center /
      cover no-repeat;
  }

  /* [add] promostion --------------------------------------+ */
  #promotion #main-visual-r2 {
    background: url("../images/movie/main_visual-sp-r2.jpg") center center /
      cover no-repeat;
  }

  /* Added 04/23/2025 Illustration Price Section */

  #price-illustration {
    padding: 40px 0 40px;
  }

  #price-illustration .inner {
    max-width: 90%;
    margin: 50px auto 0;
  }

  #price-illustration .inner .card-list {
    gap: 40px;
  }

  #price-illustration .inner .card-list > li {
    gap: 20px;
  }

  #price-illustration .inner .card-list .card-left,
  #price-illustration .inner .card-list .card-right {
    flex-direction: column;
  }

  /* #price-illustration .inner .card-list li img {
    object-fit: contain;
    object-position: center;
    width: 100%;
    max-width: 550px;
    height: 100%;
    aspect-ratio: 16/9;
  } */

  #price-illustration .inner .card-list li .card-details {
    gap: 20px;
  }

  /* #price-illustration .inner .card-list li .card-details .card-title {
    padding-bottom: 10px;
    border-bottom: 1px solid #fff;
    font-weight: 400;
  } */

  #price-illustration .inner .card-list li .card-details .card-details__cost {
    gap: 10px;
  }

  /* #price-illustration
    .inner
    .card-list
    li
    .card-details
    .card-details__cost
    h4 {
    font-weight: normal;
    text-align: left;
    font-size: 1.2em;
    line-height: 1em;
  } */

  /* #price-illustration
    .inner
    .card-list
    li
    .card-details
    .card-details__cost
    .service-cost {
    display: flex;
    flex-direction: column;
    gap: 5px;
  } */

  /* #price-illustration
    .inner
    .card-list
    li
    .card-details
    .card-details__cost
    .service-cost
    p {
    background-color: #ac9978;
    width: fit-content;
    padding: 5px;
  } */

  /* #price-illustration
    .inner
    .card-list
    li
    .card-details
    .card-details__cost
    .service-inclusion {
    display: flex;
    flex-direction: column;
    gap: 5px;
  } */

  #price-illustration
    .inner
    .card-list
    li
    .card-details
    .card-details__cost
    .service-inclusion
    ul {
    flex-wrap: wrap;
  }

  /* #price-illustration
    .inner
    .card-list
    li
    .card-details
    .card-details__cost
    .service-inclusion
    ul
    li {
    background-color: #b3b2b1;
    padding: 5px;
  } */

  /* #illust .faq-illustration .mv-faq {
    margin: 10px 0;
    padding: 70px 10px;
    background: #222;
  } */

  /* #illust .faq-illustration .en-title {
    color: #fff;
  } */
  #faq.faq-illustration {
    padding: 40px 0;
  }
  #illust .faq-illustration .faq-inner {
    max-width: 90%;
    margin: auto !important;
  }

  #illust .faq-illustration .faq-inner h3 {
    width: 100%;
    margin: 0 auto 30px;
    font-size: 1.8em;
  }

  /* #illust .faq-illustration .faq-inner .faq-accordion .checkbox {
    position: absolute;
    white-space: nowrap;
    width: 1px;
    height: 1px;
    overflow: hidden;
    border: 0;
    padding: 0;
    clip: rect(0 0 0 0);
    clip-path: inset(50%);
    margin: -1px;
  } */

  /*アコーディオン*/
  #illust .faq-illustration .faq-inner .faq-accordion {
    width: 100%;
    max-width: 100%;
    margin: 0 auto;
  }

  /* #illust .faq-illustration .faq-inner .faq-accordion dl {
    position: relative;
  } */

  /* #illust .faq-illustration .faq-inner .faq-accordion dt {
    background-color: #efefef;
    border-radius: 10px;
    padding: 16px;
  } */

  #illust .faq-illustration .faq-inner .faq-accordion dt label::before {
    top: 0;
    left: 0;
  }

  #illust .faq-illustration .faq-inner .faq-accordion dt label {
    font-size: 0.9em;
    padding: 0;
  }

  #illust .faq-illustration .faq-inner .faq-accordion dt span {
    display: inline-block;
    padding: 0 0 0 46px;
  }

  #illust .faq-illustration .faq-inner .faq-accordion dd span {
    padding: 0 12px 0 44px;
  }

  /*ラベル内の矢印の設定*/
  #illust .faq-illustration .faq-inner .faq-accordion dt label::after {
    right: 0;
    width: 8px;
    height: 8px;
  }

  /*表示される要素の基本設定*/
  #illust .faq-illustration .faq-inner .faq-accordion dd {
    margin: auto !important;
    font-size: 0.8em;
    border: none;
  }

  #illust .faq-illustration .faq-inner .faq-accordion dd::before {
    top: 0;
    left: 16px;
  }

  /*ラベル内の矢印のアニメーション設定*/
  /* #illust
    .faq-illustration
    .faq-inner
    .faq-accordion
    .checkbox:checked
    ~ dl
    dt
    label::after {
    transform: rotate(-135deg);
    top: 1.2em;
  } */

  /*表示される要素のアニメーション設定*/
  #illust
    .faq-illustration
    .faq-inner
    .faq-accordion
    .checkbox:checked
    ~ dl
    dd {
    height: auto;
    opacity: 1;
    /* padding: 0 20px 20px; */
  }
  .contactBtn-illustration {
    padding: 40px 0;
  }

  .contactBtn-illustration a {
    display: block;
    width: 90%;
    max-width: 90%;
    margin: 0 auto;
    padding: 1rem 3rem;
    background-color: #f39800;
    border-radius: 8px;
    box-sizing: border-box;
    transition: 0.3s;
    border: 0;
    position: relative;
    /* font-size: 20px; */
  }

  .contactBtn-illustration .btn-text {
    display: block;
    position: relative;
    color: #fff;
    text-align: center;
    /* padding-left: 30px; */
    font-size: 1.1em;
    /* line-height: 1.5; */
  }

  .contactBtn-illustration .btn-subtext {
    display: block;
    position: relative;
    color: #fff;
    text-align: center;
    /* padding-left: 30px; */
    font-size: 0.7em;
  }

  .contactBtn-illustration a:before {
    content: "";
    width: 20px;
    height: 20px;
    background: #ffffff;
    border-radius: 50%;
    position: absolute;
    top: 50%;
    left: 48px;
    /* bottom: 0; */
    margin: auto;
    transform: translateY(-50%);
  }

  .contactBtn-illustration a:after {
    content: "";
    width: 8px;
    height: 8px;
    border-top: 3px solid #333;
    border-right: 3px solid #333;
    box-sizing: border-box;
    transform: rotate(45deg) translateY(-50%);
    position: absolute;
    top: 50%;
    left: 51px;
    /* bottom: 0; */
    margin: auto;
    transition: 0.3s;
  }
  /* .contactBtn-illustration .btn-text:before {
    content: "";
    width: 20px;
    height: 20px;
    background: #ffffff;
    border-radius: 50%;
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    margin: auto;
  }

  .contactBtn-illustration .btn-text:after {
    content: "";
    width: 8px;
    height: 8px;
    border-top: 3px solid #333;
    border-right: 3px solid #333;
    box-sizing: border-box;
    transform: rotate(45deg);
    position: absolute;
    top: 0;
    left: 5px;
    bottom: 0;
    margin: auto;
    transition: 0.3s;
  } */
}

/* MediaQueries */

/*  ###############################
  Works > slider
################################# */
/* common */
.slider-box .color-illustration {
  background: #cb4647;
}

.slider-box .color-video {
  background: #273565;
}

.slider-box .color-localization {
  background: #008b6a;
}

.slider-box .color-narration {
  background: #ec631f;
}

.slider-box .color-sound {
  background: #962bac;
}

.works_wrap li.swiper-slide {
  height: 550px;
}

/* SP layout media queries -----------------------------------------------------------+ */
@media only screen and (max-width: 640px) {
  /* wrap */
  .slider-box * {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -ms-box-sizing: border-box;
    -o-box-sizing: border-box;
    box-sizing: border-box;
  }

  .slider-box {
    position: relative;
    background: #fff;
    margin: 0;
    padding: 40px 0;
    z-index: 0;
  }

  /* h2 */
  .slider-box h2 {
    font-size: 29px;
    letter-spacing: 0.02em;
    font-weight: bold;
    text-align: center;
    padding: 0 0 16px;
  }

  /* wrap (slider) */
  .works_wrap {
    background: #fff;
    margin: 0;
  }

  /* box (slider) */
  .works_wrap ul {
    width: 90%;
    margin: 10px auto 0;
  }

  /* list */
  .works_wrap li {
    position: relative;
    width: 100%;
    height: auto;
    margin: 0 0 22px;
    text-align: center;
    word-wrap: break-word;
    border: 1px solid #d2d2d2;
    background: #fff;
  }

  /* tmb */
  .slider-box .tmb {
    min-height: 220px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition-duration: 0.3s;
  }

  .slider-box .tmb {
    width: 86%;
    margin: 15px auto 0;
  }

  .slider-box .tmb img {
    max-width: 100%;
    height: auto;
    max-height: 190px;
    width: auto;
    backface-visibility: hidden;
    margin-top: 30px;
  }

  /* client */
  .slider-box .client {
    font-size: 14px;
    line-height: 1.5;
    letter-spacing: normal;
    margin: 17px 0 17px;
    padding: 0 2em;
  }

  /* ttl */
  .slider-box h3 {
    font-size: 18px;
    margin: 0 0 14px;
    font-weight: bold;
    line-height: 1.4;
    letter-spacing: 0.02em;
    padding: 0 2em;
  }

  /* copy */
  .slider-box .copy {
    font-size: 11px;
    padding: 10px 2em 60px;
  }

  /* cat */
  .slider-box .category {
    position: absolute;
    /* top: 0; */
    width: 100%;
    background: #222;
    color: #fff;
    font-size: 12px;
    line-height: 1.5;
    letter-spacing: 0.05em;
    font-weight: bold;
    padding: 6px 1em 5px;
    transition-duration: 0.3s;
    box-sizing: border-box;
    bottom: 0;
  }

  /* btn (works arch) */
  .btn-works {
    text-align: center;
    padding: 0 0 0;
  }

  .btn-works a {
    display: block;
    color: #333;
    font-size: 18px;
    width: 80%;
    height: 48px;
    line-height: 48px;
    font-weight: bold;
    background: #fff;
    border: 1px solid #333;
    border-radius: 4px;
    margin: 50px auto 0;
  }

  .btn-works a i {
    display: inline-block;
    margin: -4px 0 0 11px;
  }

  .btn-works a:hover {
    color: #fff;
    border-color: #e82e55;
    background: #e82e55;
  }

  #top .btn-works a,
  #illust .btn-works a,
  #sound .btn-works a,
  #movie .btn-works a,
  #promotion .btn-works a {
    display: block;
    width: 90%;
    padding: 0;
    margin: 30px auto 0;
    background-color: #f39800;
    border-radius: 8px;
    box-sizing: border-box;
    transition: 0.3s;
    border: 0;
  }

  #top .btn-works .btn-text,
  #illust .btn-works .btn-text,
  #sound .btn-works .btn-text,
  #movie .btn-works .btn-text,
  #promotion .btn-works .btn-text {
    display: block;
    position: relative;
    color: #fff;
    text-align: center;
    padding-left: 30px;
    font-size: 16px;
  }

  #top .btn-works .btn-text:before,
  #illust .btn-works .btn-text:before,
  #sound .btn-works .btn-text:before,
  #movie .btn-works .btn-text:before,
  #promotion .btn-works .btn-text:before {
    content: "";
    width: 16px;
    height: 16px;
    background: #ffffff;
    border-radius: 50%;
    position: absolute;
    top: 0;
    left: 4.1rem;
    bottom: 0;
    margin: auto;
  }

  #top .btn-works .btn-text:after,
  #illust .btn-works .btn-text:after,
  #sound .btn-works .btn-text:after,
  #movie .btn-works .btn-text:after,
  #promotion .btn-works .btn-text:after {
    content: "";
    width: 8px;
    height: 8px;
    border-top: 3px solid #333;
    border-right: 3px solid #333;
    box-sizing: border-box;
    transform: rotate(45deg);
    position: absolute;
    top: 0;
    left: 4.25rem;
    bottom: 0;
    margin: auto;
    transition: 0.3s;
  }
}

/* end - SP layout media queries */

/* PC layout media queries -----------------------------------------------------------+ */
@media only screen and (min-width: 641px) {
  /* wrap */
  .slider-box * {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -ms-box-sizing: border-box;
    -o-box-sizing: border-box;
    box-sizing: border-box;
  }

  .slider-box {
    position: relative;
    margin: 0;
    padding: 0;
    z-index: 0;
  }

  /* h2 */
  .slider-box h2 {
    font-size: 34px;
    letter-spacing: 0.02em;
    font-weight: bold;
    text-align: center;
    padding: 75px 0 35px;
  }

  /* wrap (slider) */
  .works_table {
    /* background: #fff; */
    background: #efefef;
    padding: 0 0 60px;
  }

  .works_wrap {
    padding: 25px 0;
  }

  /* box (slider) */
  .works_wrap ul {
    /* overflow: hidden;
    display: flex;
    flex-wrap: wrap; */
    justify-content: space-between;
    width: 1200px;
    text-align: center;
    margin: 0 auto;
    height: auto;
  }

  /* 最後のコンテンツを左寄せにする指定 */
  .works_wrap ul:after {
    content: "";
    display: block;
    width: 360px;
    height: 0;
  }

  /* list */
  .works_wrap li {
    position: relative;
    width: 360px;
    /* height:100%; */
    margin: 0 0 32px;
    word-wrap: break-word;
    text-align: center;
    border: 1px solid #d2d2d2;
    background: #fff;
  }

  .works_wrap li a {
    color: #000;
  }

  /* tmb */
  .slider-box .tmb {
    min-height: 240px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition-duration: 0.3s;
  }

  .slider-box .tmb {
    width: 87%;
    margin: 34px auto 0;
  }

  .slider-box .tmb img {
    max-width: 100%;
    height: auto;
    max-height: 230px;
    width: auto;
    backface-visibility: hidden;
  }

  /* client */
  .slider-box .client {
    font-size: 14px;
    line-height: 1.3;
    letter-spacing: 0.02em;
    margin: 20px 0 19px;
    padding: 0 1em;
  }

  /* ttl */
  .slider-box h3 {
    font-size: 21px;
    letter-spacing: 0.03em;
    margin: 0 0 20px;
    font-weight: bold;
    line-height: 1.35;
    padding: 0 1.5em;
  }

  /* copy */
  .slider-box .copy {
    font-size: 12px;
    line-height: 1.4;
    letter-spacing: 0.02em;
    line-height: 1.5;
    padding: 0 1em 48px;
  }

  /* cat */
  .slider-box .category {
    position: absolute;
    /* top: 0; */
    width: 100%;
    background: #222;
    color: #fff;
    font-size: 15px;
    line-height: 1.4;
    letter-spacing: 0.06em;
    padding: 7px 1em 6px;
    transition-duration: 0.3s;
    box-sizing: border-box;
    bottom: 0;
  }

  /* btn (works arch) */
  /* .btn-works {
	text-align:center;
}
.btn-works a {
	display: block;
  width: 500px;
  font-size: 21px;
  font-weight: normal;
  color: #333;
  border: 2px solid #222;
  border-radius: 4px;
  padding: 19px 0 17px;
  margin: 60px auto;
}
.btn-works a {
  background: #fff;
  padding: 19px 0 17px;
  margin: 0 auto
}
.btn-works a i {
	display:inline-block;
	margin:-4px 0 0 11px;
} */
  .btn-works a:hover {
    color: #fff;
    border-color: #f39700;
    background: #f39700;
  }

  .btn-works a {
    display: block;
    max-width: 330px;
    margin: 0 auto;
    padding: 1.5rem 3rem;
    background-color: #f39800;
    border-radius: 8px;
    box-sizing: border-box;
    transition: 0.3s;
    border: 0;
    font-size: 20px;
  }

  .btn-works .btn-text {
    display: block;
    position: relative;
    color: #fff;
    text-align: center;
    padding-left: 30px;
  }

  .btn-works .btn-text:before {
    content: "";
    width: 20px;
    height: 20px;
    background: #ffffff;
    border-radius: 50%;
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    margin: auto;
  }

  .btn-works .btn-text:after {
    content: "";
    width: 8px;
    height: 8px;
    border-top: 3px solid #333;
    border-right: 3px solid #333;
    box-sizing: border-box;
    transform: rotate(45deg);
    position: absolute;
    top: 0;
    left: 5px;
    bottom: 0;
    margin: auto;
    transition: 0.3s;
  }
}

/* end - PC layout media queries */

/*  ###############################
  Works > Archive (../works) (!../works/illust)
################################# */

/* SP layout media queries -----------------------------------------------------------+ */
@media only screen and (max-width: 640px) {
  /* h2 */
  #service-works .works h2 {
    font-size: 30px !important;
    letter-spacing: 0.02em !important;
    font-weight: bold;
    text-align: center;
    padding: 25px 0 30px !important;
    margin: 30px 0 0;
  }

  /*  works list */
  #service-works .works ul {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    overflow: hidden;
    width: 94%;
    text-align: center;
    margin: 0 auto 20px;
  }

  #service-works #works-list-movie {
    margin: 0 0 70px;
  }

  /* list */
  #service-works .works ul li {
    display: flex;
    flex-wrap: wrap;
    flex-direction: column;
    position: relative;
    width: calc(48.6% - 2px);
    margin: 0 0 18px;
    letter-spacing: 0.05em;
    border: 1px solid #d2d2d2;
  }

  /* tmb */
  #service-works .works .tmb {
    width: 90%;
    max-height: 130px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition-duration: 0.3s;
    margin: 15px auto 15px;
  }

  #service-works .works .tmb img {
    width: auto;
    height: auto;
    max-width: 100%;
    max-height: 130px;
    backface-visibility: hidden;
  }

  /* client */
  #service-works .works .client {
    font-size: 13px;
    line-height: 1.3;
    letter-spacing: 0.02em;
    padding: 0 1em;
    margin: 0 0 16px;
  }

  /* title */
  #service-works .works h3 {
    font-size: 15px;
    line-height: 1.3;
    font-weight: bold;
    letter-spacing: 0.02em;
    padding: 0 0.6em;
    margin: 0 0 20px;
  }

  /* copyright */
  #service-works .works .copy {
    font-size: 10px;
    line-height: 1.3;
    letter-spacing: 0.02em;
    padding: 0 1em 55px;
    margin: auto 0 0 0;
  }

  /* category */
  #service-works .works .category {
    position: absolute;
    bottom: 0;
    width: 100%;
    background: #222;
    color: #fff;
    font-size: 11px;
    line-height: 1.3;
    letter-spacing: 0.05em;
    font-weight: bold;
    padding: 7px 0 6px;
    transition-duration: 0.3s;
    margin: auto 0 0 0;
  }

  /* add */
  .works-credit {
    width: 100%;
    font-size: 10px;
    line-height: 1.3;
    letter-spacing: 0.02em;
    padding: 16px 1em;
    margin: auto 0 0 0;
  }

  .works-credit .link {
    padding: 0 1em;
    overflow-wrap: anywhere;
  }

  .slider-box .swiper-button-prev,
  .slider-box .swiper-button-next {
    /* top: 190px; */
    width: 40px;
    height: 101px;
  }

  .slider-box .swiper-button-prev,
  .slider-box .swiper-button-next {
    transition-duration: 0.3s;
    background-size: contain;
  }

  .slider-box .swiper-button-prev {
    left: 0;
    background-image: url("../images/common/slide_btn-prev.png");
  }

  .slider-box .swiper-button-next {
    right: 0;
    background-image: url("../images/common/slide_btn-next.png");
  }

  .slider-box .works_wrap:hover .swiper-button-prev {
    left: 0px;
    background-image: url("../images/common/slide_btn-prev.png");
  }

  .slider-box .works_wrap:hover .swiper-button-next {
    right: 0px;
    background-image: url("../images/common/slide_btn-next.png");
  }

  .slider-box .works_wrap:hover .swiper-button-prev:hover {
    background-image: url("../images/common/slide_btn-prev_over.png");
  }

  .slider-box .works_wrap:hover .swiper-button-next:hover {
    background-image: url("../images/common/slide_btn-next_over.png");
  }

  .works_wrap .swiper-button-prev::after,
  .works_wrap .swiper-button-next::after {
    content: "" !important;
  }

  /* more, max */
  #narration-more,
  #narration-max,
  #sound-more,
  #sound-max,
  #illust-more,
  #illust-max,
  #movie-more,
  #movie-max {
    display: block;
    width: 70%;
    text-align: center;
    font-size: 17px;
    color: #e02953;
    border: 1px solid #e02953;
    border-radius: 4px;
    padding: 17px 0;
    margin: 0 auto;
  }
}

/* end - sp layout media queries */

/* PC layout media queries -----------------------------------------------------------+ */
@media only screen and (min-width: 641px) {
  /* h2 */
  #service-works .works h2 {
    font-size: 34px !important;
    letter-spacing: 0.02em;
    font-weight: bold;
    text-align: center;
    padding: 36px 0 39px !important;
    margin: 35px 0 0;
  }

  /* works list */
  #service-works .works ul {
    overflow: hidden;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    max-width: 1920px;
    text-align: center;
    margin: 0 auto 50px;
  }

  #service-works #works-list-movie {
    margin: 0 0 110px;
  }

  /* list */
  #service-works .works li {
    display: flex;
    flex-wrap: wrap;
    flex-direction: column;
    width: 330px;
    word-wrap: break-word;
    text-align: center;
    border: 1px solid #d2d2d2;
    background: #fff;
    margin: 0 7px 17px;
  }

  /* tmb */
  #service-works .works .tmb {
    min-height: 248px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition-duration: 0.3s;
  }

  #service-works .works .tmb {
    width: 90%;
    margin: 17px auto 0;
  }

  #service-works .works .tmb img {
    max-width: 100%;
    height: auto;
    max-height: 238px;
    width: auto;
    backface-visibility: hidden;
  }

  /* client */
  #service-works .works .client {
    font-size: 14px;
    line-height: 1.3;
    letter-spacing: 0.02em;
    margin: 20px 0 20px;
    padding: 0 1em;
  }

  /* ttl */
  #service-works .works h3 {
    font-size: 21px;
    letter-spacing: 0.03em;
    margin: 0 0 20px;
    line-height: 1.35;
    padding: 0 1.5em 2px;
  }

  /* copy */
  #service-works .works .copy {
    font-size: 12px;
    line-height: 1.4;
    letter-spacing: 0.02em;
    line-height: 1.5;
    padding: 0px 1em 16px;
    margin: auto 0 0 0 !important;
  }

  /* cat */
  #service-works .works .category {
    width: 100%;
    background: #222;
    color: #fff;
    font-size: 15px;
    line-height: 1.4;
    letter-spacing: 0.06em;
    padding: 7px 1em 6px;
    transition-duration: 0.3s;
    box-sizing: border-box;
    margin: auto 0 0 0 !important;
  }
}

/* end - PC layout media queries */

/* #narration キャスト数 ---------------------------------- */
.voice-about-num_casts {
  width: calc(100% - 80px);
  max-width: 1200px;
  margin: 30px auto -11px;
}

@media only screen and (max-width: 640px) {
  .voice-about-num_casts {
    width: 96%;
    margin: 25px auto 8px;
  }
}

.voice-about-num_casts h2 {
  position: relative;
  font-size: 25px;
  line-height: 1.6;
  letter-spacing: 0.06em;
  color: #fff;
  text-align: center;
  background-color: #f39700;
  padding: 14px 0 12px;
}

.voice-about-num_casts h2 span {
  font-size: 33px;
  text-decoration: underline;
  padding: 0 13px 0 15px;
}

@media only screen and (max-width: 641px) {
  .voice-about-num_casts h2 {
    font-size: 21px;
    letter-spacing: 0.06em;
    line-height: 1.4;
    padding: 20px 0 15px;
  }

  .voice-about-num_casts h2::after {
    top: -23px;
    border-width: 0 24px 24px 24px;
  }

  .voice-about-num_casts h2 span {
    font-size: 22px;
    padding: 0 6px 0 8px;
  }
}

.voice-about-num_casts ul {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: space-between;
}

.voice-about-num_casts ul.first {
  border-left: 1px solid #999;
  border-right: 1px solid #999;
  padding: 17px 15px 14px 15px;
}

.voice-about-num_casts ul.sec {
  border: none;
  padding: 0 15px 15px;
  margin: -14px 0 0;
}

.voice-about-num_casts ul li {
  font-family: "游ゴシック Medium", "游ゴシック体", "Yu Gothic Medium", YuGothic,
    "ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo,
    "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  width: 24%;
  font-size: 0.7em;
  line-height: 1.7;
}

.voice-about-num_casts .content {
  border-left: 1px solid #999;
  border-right: 1px solid #999;
}

.voice-about-num_casts .content .button {
  position: relative;
  display: block;
  font-size: 14px;
  letter-spacing: 0.06em;
  line-height: 1;
  color: #fff;
  text-align: center;
  background-color: #222;
  padding: 11px 0;
  cursor: pointer;
}

.voice-about-num_casts .content .button::after {
  position: absolute;
  content: "";
  display: block;
  position: absolute;
  top: -36px;
  left: 0;
  width: 100%;
  height: 36px;
  background: linear-gradient(
    to top,
    rgba(255, 255, 255, 1),
    90%,
    rgba(0, 0, 0, 0)
  );
}

.voice-about-num_casts .content .button.close::after {
  position: absolute;
  content: "";
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 0;
}

@media only screen and (max-width: 641px) {
  .voice-about-num_casts ul.first,
  .voice-about-num_casts ul.sec {
    padding: 14px 11px;
  }

  .voice-about-num_casts ul li {
    width: 100%;
    font-size: 0.9em;
    line-height: 1.55;
  }

  .voice-about-num_casts .content .button {
    padding: 20px 0;
  }
}