@charset "UTF-8";

/* -----------------------------------------------

index：トップページ

------------------------------------------------ */
/* メインビジュアル */
#index > .firstview {
    position: relative;
}
#index > .firstview .mainvisual {
    background-color: #000000;
}
#index > .firstview .mainvisual::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    display: block;
    width: 100%;
    height: 100%;
    background-color: rgba(0,0,0,.4);
}
#index > .firstview .mainvisual * {
    height: 680px;
}
#index > .firstview .mainvisual .slick-list .slick-track .slick-slide:nth-child(1) {
    background: url("../images/index/mainvisual-1.jpg") center center no-repeat;
    background-size: cover;
}
#index > .firstview .mainvisual .slick-list .slick-track .slick-slide:nth-child(2) {
    background: url("../images/index/mainvisual-2.jpg") center center no-repeat;
    background-size: cover;
}
#index > .firstview .mainvisual .slick-list .slick-track .slick-slide:nth-child(3) {
    background: url("../images/index/mainvisual-3.jpg") center center no-repeat;
    background-size: cover;
}
/* イメージ */
#index > .firstview .image {
    position: absolute;
    top: 150px;
    left: 50%;
    margin-left: -65px;
}
#index > .firstview .image li {
    opacity: 0;
    transition: all 1s;
}
#index > .firstview .image li:nth-child(2) {
    margin: -33px 0 0 -55px;
}
#index > .firstview .image li:nth-child(3) {
    margin: -130px 0 0 55px;
}
#index > .firstview .image li.show {
    opacity: 1;
}
#index > .firstview .image li img {
    width: 130px;
    height: 130px;
}
/* キャッチコピー */
#index > .firstview .catchcopy {
    position: absolute;
    top: 410px;
    left: 50%;
    margin-left: -228px;
    opacity: 0;
    transition: all 1s;
}
#index > .firstview .catchcopy.show {
    opacity: 1;
}
#index > .firstview .catchcopy img {
    width: auto;
    height: 37px;
}
#index > .firstview .catchcopy img:first-child {
    margin-right: 36px;
}
/* 新着情報 */
#index > .topics {
    display: flex;
    padding: 16px;
    margin-top: -75px;
    background-color: #ffffff;
    border: 3px solid #35a77c;
    box-sizing: border-box;
    position: relative;
}
#index > .topics h2 {
    font-size: 20px;
    margin-right: 20px;
}
#index > .topics h2 span {
    display: block;
    font-size: 12px;
    line-height: 12px;
    text-align: center;
}
#index > .topics dl dt {
    float: left;
    font-size: 12px;
    padding: 0px 10px;
    color: #ffffff;
    background-color: #35a77c;
    border-radius: 5px;
}
#index > .topics dl dd {
    margin-left: 100px;
}
#index > .topics dl dt:nth-of-type(n + 2),
#index > .topics dl dd:nth-of-type(n + 2) {
    margin-top: 15px;
}
/* 説明 */
#index > .description {
    font-family: "游明朝","YuMincho","ＭＳ Ｐ明朝","ＭＳ 明朝",serif;
    font-weight: bold;
    font-size: 30px;
    text-align: center;
    margin-top: 50px;
    line-height: 1.1;
}
#index > .description br {
    display: none;
}
/* メインコンテンツ */
/* メインコンテンツ：型枠大工とは */
#index > .maincontents .katawaku {
    position: relative;
}
#index > .maincontents .katawaku h2 {
    width: 350px;
    text-align: center;
    font-family: "ns-b";
    font-size: 24px;
    padding: 16px 0;
    color: #ffffff;
    background-color: #35a77c;
    border-radius: 5px;
    position: absolute;
    top: 50px;
    left: -10px;
    z-index: 20;
    opacity: 0;
    transition: all .8s ease 0s;
}
#index > .maincontents .katawaku h2.move {
    left: 0px;
    opacity: 1;
}
#index > .maincontents .katawaku .img {
    position: absolute;
    top: 70px;
    left: 40px;
    z-index: 10;
    width: 460px;
    height: 480px;
    background: url("../images/index/main-contents-1.jpg") -30px center no-repeat;
    background-size: cover;
    opacity: 0;
    transition: all .8s ease .2s;
}
#index > .maincontents .katawaku .img.move {
   left: 50px;
   opacity: 1;
}
#index > .maincontents .katawaku .description {
    width: 540px;
    height: 440px;
    text-align: justify;
    text-justify:inter-ideograph;
    padding: 18px 23px 18px 73px;
    margin-top: 140px;
    float: right;
    box-sizing: border-box;
    position: relative;
}
#index > .maincontents .katawaku .description span {
    color: #35a77c;
}
#index > .maincontents .katawaku .description .button {
    position: absolute;
    bottom: 18px;
    left: 150px;
}
#index > .maincontents .katawaku .description .button a {
    width: 300px;
    font-family: "ns-b";
    font-size: 20px;
    text-indent: 36px;
    padding: 12px 0;
    border: 3px solid #b3b3b3;
    border-radius: 5px;
    position: relative;
    transition: all .3s;
}
#index > .maincontents .katawaku .description .button a::after {
    content: "";
    display: block;
    position: absolute;
    top: 50%;
    right: 42px;
    z-index: 10;
    width: 12px;
    height: 12px;
    margin-top: -6px;
    border-top: 2px solid #000000;
    border-right: 2px solid #000000;
    transform: rotate(45deg) skewY(-5deg) skewX(-5deg);
}
#index > .maincontents .katawaku .description .button a:hover {
    border: 3px solid #35a77c;
}
#index > .maincontents .katawaku .description .line {
    position: absolute;
    background-color: #35a77c;
}
#index > .maincontents .katawaku .description .line-top {
    top: 0;
    left: 0;
    width: 0%;
    height: 3px;
    transition: all .4s ease 0s;
}
#index > .maincontents .katawaku .description .line-right {
    top: 0;
    right: 0;
    width: 3px;
    height: 0%;
    transition: all .4s ease .5s;
}
#index > .maincontents .katawaku .description .line-bottom {
    bottom: 0;
    right: 0;
    width: 0%;
    height: 3px;
    transition: all .4s ease 1s;
}
#index > .maincontents .katawaku .description .line-left {
    bottom: 0;
    left: 0;
    width: 3px;
    height: 0%;
    transition: all .4s ease 1.5s;
}
#index > .maincontents .katawaku .description .line-top.move,
#index > .maincontents .katawaku .description .line-bottom.move {
    width: 100%;
}
#index > .maincontents .katawaku .description .line-right.move,
#index > .maincontents .katawaku .description .line-left.move {
    height: 100%;
}
/* メインコンテンツ：施工実績 */
#index > .maincontents .performance {
    position: relative;
}
#index > .maincontents .performance h2 {
    width: 200px;
    text-align: center;
    font-family: "ns-b";
    font-size: 24px;
    padding: 16px 0;
    color: #ffffff;
    background-color: #35a77c;
    border-radius: 5px;
    position: absolute;
    top: 90px;
    left: -10px;
    z-index: 20;
    opacity: 0;
    transition: all .8s ease 0s;
}
#index > .maincontents .performance h2.move {
    left: 0px;
    opacity: 1;
}
#index > .maincontents .performance .img {
    position: absolute;
    top: 50px;
    right: -10px;
    z-index: 10;
    width: 510px;
    height: 370px;
    background: url("../images/index/main-contents-2.jpg") left center no-repeat;
    background-size: cover;
    opacity: 0;
    transition: all .8s ease .2s;
}
#index > .maincontents .performance .img.move {
   right: 0;
   opacity: 1;
}
#index > .maincontents .performance .description {
    width: 540px;
    height: 330px;
    text-align: justify;
    text-justify: inter-ideograph;
    padding: 42px 73px 18px 23px;
    margin-top: 120px;
    margin-left: 40px;
    float: left;
    box-sizing: border-box;
    position: relative;
}
#index > .maincontents .performance .description .button {
    position: absolute;
    bottom: 18px;
    left: 80px;
}
#index > .maincontents .performance .description .button a {
    width: 300px;
    font-family: "ns-b";
    font-size: 20px;
    text-indent: 46px;
    padding: 12px 0;
    border: 3px solid #b3b3b3;
    border-radius: 5px;
    position: relative;
    transition: all .3s;
}
#index > .maincontents .performance .description .button a::after {
    content: "";
    display: block;
    position: absolute;
    top: 50%;
    right: 52px;
    z-index: 10;
    width: 12px;
    height: 12px;
    margin-top: -6px;
    border-top: 2px solid #000000;
    border-right: 2px solid #000000;
    transform: rotate(45deg) skewY(-5deg) skewX(-5deg);
}
#index > .maincontents .performance .description .button a:hover {
    border: 3px solid #35a77c;
}
#index > .maincontents .performance .description .line {
    position: absolute;
    background-color: #35a77c;
}
#index > .maincontents .performance .description .line-top {
    top: 0;
    right: 0;
    width: 0%;
    height: 3px;
    transition: all .4s ease 0s;
}
#index > .maincontents .performance .description .line-left {
    top: 0;
    left: 0;
    width: 3px;
    height: 0%;
    transition: all .4s ease .5s;
}
#index > .maincontents .performance .description .line-bottom {
    bottom: 0;
    left: 0;
    width: 0%;
    height: 3px;
    transition: all .4s ease 1s;
}
#index > .maincontents .performance .description .line-right {
    bottom: 0;
    right: 0;
    width: 3px;
    height: 0%;
    transition: all .4s ease 1.5s;
}
#index > .maincontents .performance .description .line-top.move,
#index > .maincontents .performance .description .line-bottom.move {
    width: 100%;
}
#index > .maincontents .performance .description .line-right.move,
#index > .maincontents .performance .description .line-left.move {
    height: 100%;
}
/* バナー */
#index > .banner {
    margin-top: 50px;
}
#index > .banner div:nth-child(n + 2){
    margin-top: 10px;
}
#index > .banner div a {
    transition: all .3s;
}
#index > .banner div a:hover {
    opacity: .6;
}
#index > .banner div a img {
    width: 100%;
}
/* お問い合わせ */
#index > .contact {
    margin: 50px auto;
}
#index > .contact h3 {
    line-height: 70px;
    font-family: "ns-b";
    font-size: 24px;
    color: #ffffff;
    text-align: center;
    background-color: #5c5c5c;
}
#index > .contact .wrap {
    display: flex;
    padding: 10px;
    border: 3px solid #5c5c5c;
}
/* お電話でのお問い合わせ */
#index > .contact .wrap .telephone {
    width: 50%;
    padding: 10px;
}
#index > .contact .wrap .telephone h4 {
    font-family: "ns-b";
    font-size: 24px;
    text-align: center;
    color: #35a77c;
}
#index > .contact .wrap .telephone .number {
    font-size: 24px;
    margin-top: 30px;
    text-indent: 135px;
    position: relative;
}
#index > .contact .wrap .telephone .number::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 70px;
    z-index: 10;
    display: block;
    width: 50px;
    height: 40px;
    margin-top: -20px;
    background: url("../images/common/tel-bk.png") center center no-repeat;
    background-size: contain;
}
#index > .contact .wrap .telephone .number div {
    display: inline;
}
#index > .contact .wrap .telephone .number a {
    font-family: "ns-b";
    font-size: 30px;
    display: inline;
}
#index > .contact .wrap .telephone .responsible {
    text-align: center;
    margin-top: 14px;
}
#index > .contact .wrap .telephone .responsible br {
    display: none;
}
/* メールでのお問い合わせ */
#index > .contact .wrap .mailform {
    width: calc(50% - 2px);
    padding: 10px;
    border-left: 2px solid #5c5c5c;
}
#index > .contact .wrap .mailform h4 {
    font-family: "ns-b";
    font-size: 24px;
    text-align: center;
    color: #35a77c;
}
#index > .contact .wrap .mailform .button {
    padding-left: 130px;
    margin-top: 20px;
    position: relative;
}
#index > .contact .wrap .mailform .button::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 60px;
    z-index: 10;
    display: block;
    width: 50px;
    height: 34px;
    margin-top: -17px;
    background: url("../images/common/mail-bk.png") center center no-repeat;
    background-size: contain;
}
#index > .contact .wrap .mailform .button a {
    width: 270px;
    font-family: "ns-b";
    font-size: 30px;
    text-indent: 14px;
    padding: 14px 0;
    border: 3px solid #b3b3b3;
    border-radius: 10px;
    position: relative;
    transition: all .3s;
}
#index > .contact .wrap .mailform .button a::after {
    content: "";
    display: block;
    position: absolute;
    top: 50%;
    right: 16px;
    z-index: 10;
    width: 18px;
    height: 18px;
    margin-top: -9px;
    border-top: 3px solid #000000;
    border-right: 3px solid #000000;
    transform: rotate(45deg) skewY(-5deg) skewX(-5deg);
}
#index > .contact .wrap .mailform .button a:hover {
    border: 3px solid #35a77c;
}

/* -----------------------------------------------

entry：エントリーフォーム

------------------------------------------------ */
/* 見出し2 */
#entry > .head2 {
    background: url("../images/head/entry.jpg") center center no-repeat;
    background-size: cover;
}
/* フォーム */
#entry > .form dl {
    display: flex;
    flex-wrap: wrap;
    width: 700px;
    margin: auto;
}
#entry > .form dl dt {
    width: 200px;
    line-height: 40px;
    margin-top: 10px;
    font-family: "ns-b";
}
#entry > .form dl dd {
    width: 500px;
    margin-top: 10px;
}
#entry > .form dl dd:first-of-type {
    line-height: 40px;
}
#entry > .form dl dd input[type=text],
#entry > .form dl dd input[type=tel],
#entry > .form dl dd input[type=email],
#entry > .form dl dd textarea {
    width: 100%;
    box-sizing: border-box;
    padding: 7px;
}
#entry > .form dl dd input[type=text]:focus,
#entry > .form dl dd input[type=tel]:focus,
#entry > .form dl dd input[type=email]:focus,
#entry > .form dl dd textarea:focus {
    border: 1px solid #35a77c;
}
#entry > .form dl dd textarea {
    height: 10em;
    min-height: 2em;
    resize: vertical;
}
/* プライバシーポリシー */
#entry > .form .privacypolicy {
    margin-top: 30px;
}
#entry > .form .privacypolicy h4 {
    font-family: "ns-b";
    font-size: 24px;
    text-align: center;
}
#entry > .form .privacypolicy .letter {
    text-align: center;
    margin-top: 30px;
}
/* 概要 */
#entry > .form .privacypolicy .overview {
    height: 210px;
    padding: 20px;
    overflow: auto;
    margin-top: 10px;
    border: 1px solid #b3b3b3;
}
#entry > .form .privacypolicy .overview h5 {
    font-family: "ns-b";
    font-size: 16px;
    text-align: center;
    padding-bottom: 5px;
    margin: 40px 0 10px;
    border-bottom: 2px solid #35a77c;
}
#entry > .form .privacypolicy .overview h5:first-child {
    margin: 0 0 10px;
}
#entry > .form .privacypolicy .overview p {
    text-align: justify;
    text-justify: inter-ideograph;
}
#entry > .form .privacypolicy .overview p a {
    text-decoration: underline;
}
#entry > .form .privacypolicy .consent {
    text-align: center;
    margin-top: 20px;
}
#entry > .form .privacypolicy .consent label {
    padding: 4px 8px;
    border-radius: 20px;
}
/* ボタン */
#entry > .form .button {
    text-align: center;
    margin-top: 20px;
}
#entry > .form .button button {
    width: 300px;
    font-family: "ns-b";
    font-size: 20px;
    text-indent: -25px;
    padding: 12px 0;
    border: 3px solid #b3b3b3;
    border-radius: 5px;
    position: relative;
    transition: all .3s;
}
#entry > .form .button button::after {
    content: "";
    display: block;
    position: absolute;
    top: 50%;
    right: 50px;
    z-index: 10;
    width: 12px;
    height: 12px;
    margin-top: -6px;
    border-top: 2px solid #000000;
    border-right: 2px solid #000000;
    transform: rotate(45deg) skewY(-5deg) skewX(-5deg);
}
#entry > .form .button button:hover {
    border: 3px solid #35a77c;
}

/* -----------------------------------------------

contact：お問い合わせ

------------------------------------------------ */
/* 見出し2 */
#contact > .head2 {
    background: url("../images/head/entry.jpg") center center no-repeat;
    background-size: cover;
}
/* お電話でのお問い合わせ */
#contact > .telephone .number {
    text-align: center;
}
#contact > .telephone .number a {
    font-family: "ns-b";
    font-size: 30px;
    text-indent: 60px;
    position: relative;
}
#contact > .telephone .number a::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 0;
    z-index: 10;
    display: block;
    width: 50px;
    height: 40px;
    margin-top: -20px;
    background: url("../images/common/tel-bk.png") center center no-repeat;
    background-size: contain;
}
#contact > .telephone .responsible {
    text-align: center;
    margin-top: 14px;
}
#contact > .telephone .responsible br {
    display: none;
}
/* メールでのお問い合わせ */
#contact > .mailform dl {
    display: flex;
    flex-wrap: wrap;
    width: 700px;
    margin: auto;
}
#contact > .mailform dl dt {
    width: 200px;
    line-height: 40px;
    margin-top: 10px;
    font-family: "ns-b";
}
#contact > .mailform dl dd {
    width: 500px;
    margin-top: 10px;
}
#contact > .mailform dl dd input[type=text],
#contact > .mailform dl dd input[type=date],
#contact > .mailform dl dd input[type=tel],
#contact > .mailform dl dd input[type=email],
#contact > .mailform dl dd textarea {
    width: 100%;
    padding: 7px;
    box-sizing: border-box;
}
#contact > .mailform dl dd input[type=text]:focus,
#contact > .mailform dl dd input[type=date]:focus,
#contact > .mailform dl dd input[type=tel]:focus,
#contact > .mailform dl dd input[type=email]:focus,
#contact > .mailform dl dd textarea:focus {
    border: 1px solid #35a77c;
}
#contact > .mailform dl dd textarea {
    height: 10em;
    min-height: 2em;
    resize: vertical;
}
/* プライバシーポリシー */
#contact > .mailform .privacypolicy {
    margin-top: 30px;
}
#contact > .mailform .privacypolicy h4 {
    font-family: "ns-b";
    font-size: 24px;
    text-align: center;
}
#contact > .mailform .privacypolicy .letter {
    text-align: center;
    margin-top: 30px;
}
/* 概要 */
#contact > .mailform .privacypolicy .overview {
    height: 210px;
    padding: 20px;
    overflow: auto;
    margin-top: 10px;
    border: 1px solid #b3b3b3;
}
#contact > .mailform .privacypolicy .overview h5 {
    font-family: "ns-b";
    font-size: 16px;
    text-align: center;
    padding-bottom: 5px;
    margin: 40px 0 10px;
    border-bottom: 2px solid #35a77c;
}
#contact > .mailform .privacypolicy .overview h5:first-child {
    margin: 0 0 10px;
}
#contact > .mailform .privacypolicy .overview p {
    text-align: justify;
    text-justify: inter-ideograph;
}
#contact > .mailform .privacypolicy .overview p a {
    text-decoration: underline;
}
#contact > .mailform .privacypolicy .consent {
    text-align: center;
    margin-top: 20px;
}
#contact > .mailform .privacypolicy .consent label {
    padding: 4px 8px;
    border-radius: 20px;
}
/* ボタン */
#contact > .mailform .button {
    text-align: center;
    margin-top: 20px;
}
#contact > .mailform .button button {
    width: 300px;
    font-family: "ns-b";
    font-size: 20px;
    text-indent: -25px;
    padding: 12px 0;
    border: 3px solid #b3b3b3;
    border-radius: 5px;
    position: relative;
    transition: all .3s;
}
#contact > .mailform .button button::after {
    content: "";
    display: block;
    position: absolute;
    top: 50%;
    right: 50px;
    z-index: 10;
    width: 12px;
    height: 12px;
    margin-top: -6px;
    border-top: 2px solid #000000;
    border-right: 2px solid #000000;
    transform: rotate(45deg) skewY(-5deg) skewX(-5deg);
}
#contact > .mailform .button button:hover {
    border: 3px solid #35a77c;
}

/* -----------------------------------------------

company：企業情報

------------------------------------------------ */
/* 見出し2 */
#company > .head2 {
    background: url("../images/head/company.jpg") center center no-repeat;
    background-size: cover;
}
#company > .philosophy h4 {
    font-family: "ns-b";
    font-size: 24px;
    text-align: center;
}
#company > .philosophy h4:nth-child(n + 2) {
    margin-top: 10px;
}
/* 行動指針 */
#company > .philosophy .wrap {
    display: flex;
    justify-content: space-between;
    margin-top: 24px;
}
#company > .philosophy .wrap .guidelines {
    width: 48%;
    border: 3px solid #35a77c;
    border-top: none;
}
#company > .philosophy .wrap .guidelines h5 {
    line-height: 54px;
    font-family: "ns-b";
    font-size: 20px;
    text-align: center;
    color: #ffffff;
    background-color: #35a77c;
}
#company > .philosophy .wrap .guidelines dl {
    padding: 20px 0 30px;
    text-align: center;
}
#company > .philosophy .wrap .guidelines dl dt {
    margin-top: 24px;
}
#company > .philosophy .wrap .guidelines dl dt:first-child {
    margin-top: 0;
}
/* 行動姿勢 */
#company > .philosophy .wrap .attitude {
    width: 48%;
    border: 3px solid #35a77c;
    border-top: none;
}
#company > .philosophy .wrap .attitude h5 {
    line-height: 54px;
    font-family: "ns-b";
    font-size: 20px;
    text-align: center;
    color: #ffffff;
    background-color: #35a77c;
}
#company > .philosophy .wrap .attitude ul {
    padding: 20px 0 30px;
    text-align: center;
}
#company > .profile > table {
    width: 100%;
    table-layout: fixed;
    border: 2px solid #35a77c;
}
#company > .profile > table > tbody > tr > th {
    width: 180px;
    padding: 8px 20px;
    text-align: left;
    color: #ffffff;
    font-weight: normal;
    background-color: #35a77c;
    border-top: 2px solid #ffffff;
    border-bottom: 2px solid #ffffff;
    border-right: 2px solid #35a77c;
    border-left: 2px solid #35a77c;
}
#company > .profile > table > tbody > tr:first-child > th {
    border-top: 2px solid #35a77c;
}
#company > .profile > table > tbody > tr:last-child > th {
    border-bottom: 2px solid #35a77c;
}
#company > .profile > table > tbody > tr > td {
    padding: 8px 20px;
    border: 2px solid #35a77c;
}
#company > .profile > table > tbody > tr > td > table.supplier > tbody > tr > th {
    font-weight: normal;
    text-align: left;
}
#company > .profile > table > tbody > tr > td > table.supplier > tbody > tr > td {
    text-align: left;
    padding-left: 1em;
    vertical-align: middle;
}
#company > .profile > table > tbody > tr > td > table.supplier > tbody > tr > th > br {
    display: none;
}
#company > .access .ggmap {
    height: 0;
    padding-bottom: 300px;
    margin-top: 30px;
    position: relative;
    overflow: hidden;
}
#company > .access .ggmap iframe,
#company > .access .ggmap object,
#company > .access .ggmap embed{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

/* -----------------------------------------------

katawaku：型枠大工とは？

------------------------------------------------ */
/* 見出し2 */
#katawaku > .head2 {
    background: url("../images/head/katawaku.jpg") center center no-repeat;
    background-size: cover;
}
/* 文章 */
#katawaku > .letter {
    text-align: justify;
    text-justify:inter-ideograph;
}
#katawaku > .letter span {
    color: #35a77c;
}
/* 型枠工事の流れ */
#katawaku > .flow ul {
    display: flex;
    flex-wrap: wrap;
}
#katawaku > .flow ul li {
    width: 33.3%;
    height: 33vw;
    max-height: 360px;
    position: relative;
    opacity: 0;
    transition: all .3s;;
}
#katawaku > .flow ul li.move {
    opacity: 1;
}
#katawaku > .flow ul li div {
    display: flex;
    align-items: center;
    position: absolute;
    bottom: -1px;
    left: 0;
    width: 100%;
    height: 40px;
    text-indent: 10px;
    color: #ffffff;
}
#katawaku > .flow ul li:nth-child(1) {
    background: url("../images/katawaku/img-1.jpg") top center no-repeat;
    background-size: cover;
}
#katawaku > .flow ul li:nth-child(1) div {
    background: url("../images/katawaku/arrow-pc-1.png") left top no-repeat;
    background-size: contain;
}
#katawaku > .flow ul li:nth-child(2) {
    background: url("../images/katawaku/img-2.jpg") top center no-repeat;
    background-size: cover;
}
#katawaku > .flow ul li:nth-child(2) div {
    background: url("../images/katawaku/arrow-pc-2.png") left top no-repeat;
    background-size: contain;
}
#katawaku > .flow ul li:nth-child(3) {
    background: url("../images/katawaku/img-3.jpg?") top center no-repeat;
    background-size: cover;
}
#katawaku > .flow ul li:nth-child(3) div {
    width: 104.5%;
    background: url("../images/katawaku/arrow-pc-3.png") left top no-repeat;
    background-size: contain;
}
#katawaku > .flow ul li:nth-child(4) {
    background: url("../images/katawaku/img-4.jpg?") top center no-repeat;
    background-size: cover;
}
#katawaku > .flow ul li:nth-child(4) div {
    background: url("../images/katawaku/arrow-pc-4.png") left top no-repeat;
    background-size: contain;
}
#katawaku > .flow ul li:nth-child(5) {
    background: url("../images/katawaku/img-5.jpg") top center no-repeat;
    background-size: cover;
}
#katawaku > .flow ul li:nth-child(5) div {
    background: url("../images/katawaku/arrow-pc-5.png") left top no-repeat;
    background-size: contain;
}
#katawaku > .flow ul li:nth-child(6) {
    background: url("../images/katawaku/img-6.jpg") top center no-repeat;
    background-size: cover;
}
#katawaku > .flow ul li:nth-child(6) div {
    width: 104.5%;
    background: url("../images/katawaku/arrow-pc-6.png") left top no-repeat;
    background-size: contain;
}
#katawaku > .flow ul li:nth-child(7) {
    background: url("../images/katawaku/img-7.jpg") top center no-repeat;
    background-size: cover;
}
#katawaku > .flow ul li:nth-child(7) div {
    background: url("../images/katawaku/arrow-pc-7.png") left top no-repeat;
    background-size: contain;
}
#katawaku > .flow ul li:nth-child(8) {
    background: url("../images/katawaku/img-8.jpg") top center no-repeat;
    background-size: cover;
}
#katawaku > .flow ul li:nth-child(8) div {
    background: url("../images/katawaku/arrow-pc-8.png") left top no-repeat;
    background-size: contain;
}
#katawaku > .flow ul li:nth-child(9) {
    background: url("../images/katawaku/img-9.jpg") top center no-repeat;
    background-size: cover;
}
#katawaku > .flow ul li:nth-child(9) div {
    width: 104.5%;
    background: url("../images/katawaku/arrow-pc-9.png") left top no-repeat;
    background-size: contain;
}
#katawaku > .flow ul li:nth-child(10) {
    background: url("../images/katawaku/img-10.jpg") top center no-repeat;
    background-size: cover;
}
#katawaku > .flow ul li:nth-child(10) div {
    background: url("../images/katawaku/arrow-pc-10.png") left top no-repeat;
    background-size: contain;
}
#katawaku > .flow ul li:nth-child(11) {
    width: 66.6%;
    background: url("../images/katawaku/img-11.jpg") top center no-repeat;
    background-size: cover;
}
#katawaku > .flow ul li:nth-child(11) div {
    width: 100%;
    background: url("../images/katawaku/arrow-pc-11.png") left top no-repeat;
    background-size: contain;
}
#katawaku > .flow ul li div span {
    font-family: "ns-b";
    font-size: 38px;
    margin-right: 10px;
}

/* -----------------------------------------------

recruit：採用情報

------------------------------------------------ */
/* 見出し2 */
#recruit > .head2 {
    background: url("../images/head/recruit.jpg") center center no-repeat;
    background-size: cover;
}
/* 募集要項 */
#recruit > .requirement table {
    width: 100%;
    table-layout: fixed;
    border: 2px solid #35a77c;
}
#recruit > .requirement table tbody tr th {
    width: 180px;
    padding: 8px 20px;
    text-align: left;
    color: #ffffff;
    font-weight: normal;
    background-color: #35a77c;
    border-top: 2px solid #ffffff;
    border-bottom: 2px solid #ffffff;
    border-right: 2px solid #35a77c;
    border-left: 2px solid #35a77c;
}
#recruit > .requirement table tbody tr:first-child th {
    border-top: 2px solid #35a77c;
}
#recruit > .requirement table tbody tr:last-child th {
    border-bottom: 2px solid #35a77c;
}
#recruit > .requirement table tbody tr td {
    padding: 8px 20px;
    border: 2px solid #35a77c;
}
#recruit > .requirement table tbody tr.working_hour td br {
    display: none;
}
/* 若手社員 */
#recruit > .comment .young {
    display: flex;
    justify-content: space-between;
}
#recruit > .comment .young li {
    width: 32%;
}
#recruit > .comment .young li h4 {
    line-height: 40px;
    font-family: "ns-b";
    font-size: 20px;
    text-align: center;
    color: #ffffff;
    background-color: #35a77c;
    border-radius: 10px;
}
#recruit > .comment .young li .img {
    text-align: center;
    margin-top: 10px;
}
#recruit > .comment .young li .img img {
    width: 200px;
    height: 200px;
}
#recruit > .comment .young li .name {
    text-align: center;
    font-family: "ns-b";
    margin-top: 10px;
}
#recruit > .comment .young li .letter {
    text-align: justify;
    text-justify:inter-ideograph;
}
/* 超ベテラン職長 */
#recruit > .comment .veteran {
    display: flex;
    justify-content: space-between;
    margin-top: 30px;
}
#recruit > .comment .veteran.rookie .right{
    display: flex;
    align-items: center;
}
#recruit > .comment .veteran .left {
    width: 320px;
}
#recruit > .comment .veteran .left h4 {
    line-height: 40px;
    font-size: 20px;
    text-align: center;
    color: #ffffff;
    background-color: #35a77c;
    border-radius: 10px;
}
#recruit > .comment .veteran .left .img {
    text-align: center;
    margin-top: 10px;
}
#recruit > .comment .veteran .left .img img {
    width: 200px;
    height: 200px;
}
#recruit > .comment .veteran .left .name {
    text-align: center;
    font-family: "ns-b";
    margin-top: 10px;
}
#recruit > .comment .veteran .left .letter {
    text-align: center;
}
#recruit > .comment .veteran .right {
    width: 630px;
    margin-left: 10px;
    font-size: 14px;
    border: 3px solid #35a77c;
    border-radius: 10px;
    position: relative;
}
#recruit > .comment .veteran .right:before {
    content: "";
    display: block;
    position: absolute;
    top: 115px;
    left: -29px;
    z-index: 10;
    width: 50px;
    height: 50px;
    border-top: 3px solid #35a77c;
    border-right: 3px solid #35a77c;
    transform: rotate(-135deg) skewY(-5deg) skewX(-5deg);
    background-color: #ffffff;
}
#recruit > .comment .veteran .right:before { /* 一時的に削除 */
    display: none;
}
#recruit > .comment .veteran .right h5 {
    line-height: 50px;
    font-family: "ns-b";
    font-size: 16px;
    text-align: center;
    color: white;
    background-color: #4af7b6;
    border-radius: 6px 6px 0 0;
}
#recruit > .comment .veteran .right .wrap {
    padding: 6px 14px;
    text-align: justify;
    text-justify:inter-ideograph;
}
#recruit > .comment .veteran .right .wrap ul {
    padding-left: 1.6em;
}
#recruit > .comment .veteran .right .wrap ul li {
    margin-top: 10px;
    list-style: disc;
    line-height: 24px;
}
/* ボタン回り */
#recruit > .comment  .introduction {
    text-align: center;
    margin-top: 50px
}
#recruit > .comment > .button {
    margin-top: 30px;
}
#recruit > .comment > .button a {
    width: 300px;
    display: block;
    margin: auto;
    font-family: "ns-b";
    font-size: 20px;
    text-indent: 68px;
    padding: 12px 0;
    border: 3px solid #b3b3b3;
    border-radius: 5px;
    position: relative;
    transition: all .3s;
}
#recruit > .comment .button a::after {
    content: "";
    display: block;
    position: absolute;
    top: 50%;
    right: 70px;
    z-index: 10;
    width: 12px;
    height: 12px;
    margin-top: -6px;
    border-top: 2px solid #000000;
    border-right: 2px solid #000000;
    transform: rotate(45deg) skewY(-5deg) skewX(-5deg);
}
#recruit > .comment .button a:hover {
    border: 3px solid #35a77c;
}
/* お問い合わせ */
#recruit > .comment .contact {
    margin: 50px auto 0;
}
#recruit > .comment .contact h3 {
    line-height: 70px;
    font-family: "ns-b";
    font-size: 24px;
    color: #ffffff;
    text-align: center;
    background-color: #5c5c5c;
}
#recruit > .comment .contact .wrap {
    display: flex;
    padding: 10px;
    border: 3px solid #5c5c5c;
}
/* お電話でのお問い合わせ */
#recruit > .comment .contact .wrap .telephone {
    width: 50%;
    padding: 10px;
}
#recruit > .comment .contact .wrap .telephone h4 {
    font-family: "ns-b";
    font-size: 24px;
    text-align: center;
    color: #35a77c;
}
#recruit > .comment .contact .wrap .telephone .number {
    font-size: 24px;
    margin-top: 30px;
    text-indent: 135px;
    position: relative;
}
#recruit > .comment .contact .wrap .telephone .number::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 70px;
    z-index: 10;
    display: block;
    width: 50px;
    height: 40px;
    margin-top: -20px;
    background: url("../images/common/tel-bk.png") center center no-repeat;
    background-size: contain;
}
#recruit > .comment .contact .wrap .telephone .number div {
    display: inline;
}
#recruit > .comment .contact .wrap .telephone .number a {
    font-family: "ns-b";
    font-size: 30px;
    display: inline;
}
#recruit > .comment .contact .wrap .telephone .responsible {
    text-align: center;
    margin-top: 14px;
}
#recruit > .comment .contact .wrap .telephone .responsible br {
    display: none;
}
/* メールでのお問い合わせ */
#recruit > .comment .contact .wrap .entryform {
    width: calc(50% - 2px);
    padding: 10px;
    border-left: 2px solid #5c5c5c;
}
#recruit > .comment .contact .wrap .entryform h4 {
    font-family: "ns-b";
    font-size: 24px;
    text-align: center;
    color: #35a77c;
}
#recruit > .comment .contact .wrap .entryform .button {
    margin-top: 20px;
    position: relative;
}
#recruit > .comment .contact .wrap .entryform .button a {
    width: 350px;
    display: block;
    margin: auto;
    font-family: "ns-b";
    font-size: 30px;
    text-indent: 24px;
    padding: 14px 0;
    border: 3px solid #b3b3b3;
    border-radius: 10px;
    position: relative;
    transition: all .3s;
}
#recruit > .comment .contact .wrap .entryform .button a::after {
    content: "";
    display: block;
    position: absolute;
    top: 50%;
    right: 30px;
    z-index: 10;
    width: 18px;
    height: 18px;
    margin-top: -9px;
    border-top: 3px solid #000000;
    border-right: 3px solid #000000;
    transform: rotate(45deg) skewY(-5deg) skewX(-5deg);
}
#recruit > .comment .contact .wrap .entryform .button a:hover {
    border: 3px solid #35a77c;
}
#recruit > .comment .contact .wrap .entryform p {
    text-align: center;
    margin-top: 10px;
}
#recruit > .comment .contact .wrap .entryform p a {
    text-decoration: underline;
    transition: all .3s;
}
#recruit > .comment .contact .wrap .entryform p a:hover {
    color: #35a77c;
}

/* -----------------------------------------------

works：施工実績

------------------------------------------------ */
/* 見出し2 */
#works > .head2 {
    background: url("../images/head/works.jpg") center center no-repeat;
    background-size: cover;
}
/* 施工事例 */
#works > .example ul {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}
#works > .example ul li:nth-child(n + 4) {
    margin-top: 50px;
}
#works > .example ul li {
    width: 32%;
}
#works > .example ul li .img {
    height: 30vw;
    max-height: 320px;
}
#works > .example ul li .img a {
    width: 100%;
    height: 30vw;
    max-height: 320px;
    overflow: hidden;
    position: relative;
}
#works > .example ul li .img a::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    z-index: 10;
    display: block;
    width: 100%;
    height: 100%;
    transition: all .3s;
}
#works > .example ul li:nth-child(1) .img a::before {
    background: url("../images/works/example-1-1.jpg") center center no-repeat;
    background-size: cover;
}
#works > .example ul li:nth-child(2) .img a::before {
    background: url("../images/works/example-2-1.jpg") center center no-repeat;
    background-size: cover;
}
#works > .example ul li:nth-child(3) .img a::before {
    background: url("../images/works/example-3-1.jpg") center center no-repeat;
    background-size: cover;
}
#works > .example ul li:nth-child(4) .img a::before {
    background: url("../images/works/example-4-1.jpg") center center no-repeat;
    background-size: cover;
}
#works > .example ul li:nth-child(5) .img a::before {
    background: url("../images/works/example-5-1.jpg") center center no-repeat;
    background-size: cover;
}
#works > .example ul li:nth-child(6) .img a::before {
    background: url("../images/works/example-6-1.jpg") center center no-repeat;
    background-size: cover;
}
#works > .example ul li:nth-child(7) .img a::before {
    background: url("../images/works/example-7-1.jpg") center center no-repeat;
    background-size: cover;
}
#works > .example ul li:nth-child(8) .img a::before {
    background: url("../images/works/example-8-1.jpg") center center no-repeat;
    background-size: cover;
}
#works > .example ul li:nth-child(9) .img a::before {
    background: url("../images/works/example-9-1.jpg") center center no-repeat;
    background-size: cover;
}
#works > .example ul li:nth-child(10) .img a::before {
    background: url("../images/works/example-10-1.jpg") center center no-repeat;
    background-size: cover;
}
#works > .example ul li:nth-child(11) .img a::before {
    background: url("../images/works/example-11-1.jpg") center center no-repeat;
    background-size: cover;
}
#works > .example ul li:nth-child(12) .img a::before {
    background: url("../images/works/example-12-1.jpg") center center no-repeat;
    background-size: cover;
}
#works > .example ul li:nth-child(13) .img a::before {
    background: url("../images/works/example-13-1.jpg") center center no-repeat;
    background-size: cover;
}
#works > .example ul li:nth-child(14) .img a::before {
    background: url("../images/works/example-14-1.jpg") center center no-repeat;
    background-size: cover;
}
#works > .example ul li:nth-child(15) .img a::before {
    background: url("../images/works/example-15-1.jpg") center center no-repeat;
    background-size: cover;
}
#works > .example ul li:nth-child(16) .img a::before {
    background: url("../images/works/example-16-1.jpg") center center no-repeat;
    background-size: cover;
}
#works > .example ul li:nth-child(17) .img a::before {
    background: url("../images/works/example-17-1.jpg") center center no-repeat;
    background-size: cover;
}
#works > .example ul li:nth-child(18) .img a::before {
    background: url("../images/works/example-18-1.jpg") center center no-repeat;
    background-size: cover;
}
#works > .example ul li .img a:hover::before {
    transform: scale(1.05);
}
#works > .example ul li .img a::after {
    content: "";
    position: absolute;
    bottom: -42px;
    right: -17px;
    z-index: 20;
    display: block;
    width: 70px;
    height: 120px;
    transform: rotate(45deg);
    background-color: #35a77c;
}
#works > .example ul li .img a .more {
    position: absolute;
    bottom: 3px;
    right: 10px;
    z-index: 30;
    color: #ffffff;
}
#works > .example ul li .img a .more::before {
    content: "";
    display: block;
    position: absolute;
    bottom: 23px;
    right: 14px;
    z-index: 30;
    width: 10px;
    height: 10px;
    border-top: 2px solid #ffffff;
    border-right: 2px solid #ffffff;
    transform: rotate(45deg) skewY(-5deg) skewX(-5deg);
}
#works > .example ul li .none {
    display: none;
}
#works > .example ul li .category {
    width: 110px;
    font-size: 12px;
    margin-top: 20px;
    text-indent: 10px;
    color: #ffffff;
    background-color: #35a77c;
    border-radius: 5px;
}
#works > .example ul li .address {
    margin-top: 4px;
}
/* 職長の声 */
#works > .foreman .episode {
    text-align: center;
}
#works > .foreman ul {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    margin-top: 40px;
}
#works > .foreman ul li {
    width: 150px;
}
#works > .foreman ul li a .img img {
    width: 100%;
    height: auto;
}
#works > .foreman ul li a .button {
    width: 100%;
    text-indent: 30px;
    margin-top: 10px;
    border: 3px solid #b3b3b3;
    border-radius: 10px;
    box-sizing: border-box;
    position: relative;
    transition: all .3s;
}
#works > .foreman ul li:nth-child(2) a .button {
    text-indent: 38px;
}
#works > .foreman ul li a .button::after {
    content: "";
    display: block;
    position: absolute;
    top: 50%;
    right: 30px;
    z-index: 10;
    width: 10px;
    height: 10px;
    margin-top: -5px;
    border-top: 2px solid #000000;
    border-right: 2px solid #000000;
    transform: rotate(45deg) skewY(-5deg) skewX(-5deg);
}
#works > .foreman ul li:nth-child(2) a .button::after {
    right: 38px;
}
#works > .foreman ul li a:hover .button {
    border: 3px solid #35a77c;
}
#works > .foreman .detail {
    display: none;
}
.works_episode_inner {
    width: 1000px;
    padding: 80px 0 30px 40px;
    border: 3px solid #35a77c;
    box-sizing: border-box;
    position: relative;
}
.works_episode_inner .construction {
    position: absolute;
    top: 30px;
    left: 80px;
}
.works_episode_inner .construction img {
    width: 200px;
}
.works_episode_inner .comment {
    width: 540px;
    min-height: 250px;
    margin: auto;
    padding: 30px 50px;
    border: 2px solid #b3b3b3;
    box-sizing: border-box;
}
.works_episode_inner .comment .head {
    font-family: "ns-b";
}
.works_episode_inner .comment .letter {
    margin-top: 20px;
    line-height: 22px;
    text-align: justify;
    text-justify: inter-ideograph;
}
.works_episode_inner .athlete_grandprix {
    text-align: center;
    padding: 30px 10px 0px 10px;
    margin-left: -40px;
}
.works_episode_inner .athlete_grandprix .letter {
    font-family: "ns-b";
}
.works_episode_inner .athlete_grandprix video {
    width: 100%;
    max-width: 670px;
    margin-top: 10px;
}
.works_episode_inner .img {
    position: absolute;
    top: 80px;
    right: 80px;
    width: 110px;
    text-align: center;
}
.works_episode_inner .img div img {
    width: 100%;
}
.works_episode_inner .img p {
    margin-top: 4px;
}

/* -----------------------------------------------

contact_conf：お問い合わせ内容確認

------------------------------------------------ */
/* 見出し2 */
#contact_conf > .head2 {
    background: url("../images/head/entry.jpg") center center no-repeat;
    background-size: cover;
}
/* お問い合わせ内容確認 */
#contact_conf > .conf .letter {
    text-align: center;
    padding-bottom: 50px;
    border-bottom: 2px solid #35a77c;
}
#contact_conf > .conf dl {
    display: flex;
    flex-wrap: wrap;
    width: 700px;
    margin: auto;
    padding: 14px 0 24px;
}
#contact_conf > .conf dl dt {
    width: 200px;
    line-height: 40px;
    margin-top: 10px;
    font-family: "ns-b";
}
#contact_conf > .conf dl dd {
    width: 500px;
    margin-top: 10px;
}
#contact_conf > .conf dl dd input[type=text],
#contact_conf > .conf dl dd input[type=date],
#contact_conf > .conf dl dd input[type=tel],
#contact_conf > .conf dl dd input[type=email],
#contact_conf > .conf dl dd textarea {
    width: 100%;
    padding: 7px;
    box-sizing: border-box;
    border: 1px solid transparent;
}
#contact_conf > .conf dl dd textarea {
    min-height: 2em;
    resize: vertical;
}
#contact_conf > .conf .button {
    padding-top: 50px;
    border-top: 2px solid #35a77c;
}
/* ボタン */
#contact_conf > .conf .button {
    text-align: center;
}
#contact_conf > .conf .button button {
    width: 300px;
    font-family: "ns-b";
    font-size: 20px;
    padding: 12px 0;
    border: 3px solid #b3b3b3;
    border-radius: 5px;
    position: relative;
    transition: all .3s;
}
#contact_conf > .conf .button button.prev {
    text-indent: 25px;
    margin-right: 20px;
}
#contact_conf > .conf .button button.next {
    text-indent: -25px;
}
#contact_conf > .conf .button button::after {
    content: "";
    display: block;
    position: absolute;
    top: 50%;
    z-index: 10;
    width: 12px;
    height: 12px;
    margin-top: -6px;
    border-top: 2px solid #000000;
    border-right: 2px solid #000000;
}
#contact_conf > .conf .button button.prev::after {
    left: 60px;
    transform: rotate(-135deg) skewY(-5deg) skewX(-5deg);
}
#contact_conf > .conf .button button.next::after {
    right: 100px;
    transform: rotate(45deg) skewY(-5deg) skewX(-5deg);
}
#contact_conf > .conf .button button:hover {
    border: 3px solid #35a77c;
}

/* -----------------------------------------------

contact_send：お問い合わせ送信完了

------------------------------------------------ */
/* 見出し2 */
#contact_send > .head2 {
    background: url("../images/head/entry.jpg") center center no-repeat;
    background-size: cover;
}
/* お問い合わせ送信完了 */
#contact_send > .send .letter {
    text-align: center;
}
#contact_send > .send .button {
    margin-top: 20px;
}
#contact_send > .send .button a {
    width: 300px;
    display: block;
    margin: auto;
    font-family: "ns-b";
    font-size: 20px;
    text-indent: 50px;
    padding: 12px 0;
    border: 3px solid #b3b3b3;
    border-radius: 5px;
    position: relative;
    transition: all .3s;
}
#contact_send > .send .button a::after {
    content: "";
    display: block;
    position: absolute;
    top: 50%;
    right: 50px;
    z-index: 10;
    width: 12px;
    height: 12px;
    margin-top: -6px;
    border-top: 2px solid #000000;
    border-right: 2px solid #000000;
    transform: rotate(45deg) skewY(-5deg) skewX(-5deg);
}
#contact_send > .send .button a:hover {
    border: 3px solid #35a77c;
}

/* -----------------------------------------------

entry_conf：エントリー内容確認

------------------------------------------------ */
/* 見出し2 */
#entry_conf > .head2 {
    background: url("../images/head/entry.jpg") center center no-repeat;
    background-size: cover;
}
/* お問い合わせ内容確認 */
#entry_conf > .conf .letter {
    text-align: center;
    padding-bottom: 50px;
    border-bottom: 2px solid #35a77c;
}
#entry_conf > .conf dl {
    display: flex;
    flex-wrap: wrap;
    width: 700px;
    margin: auto;
    padding: 14px 0 24px;
}
#entry_conf > .conf dl dt {
    width: 200px;
    line-height: 40px;
    margin-top: 10px;
    font-family: "ns-b";
}
#entry_conf > .conf dl dd:first-of-type {
    line-height: 40px;
}
#entry_conf > .conf dl dd {
    width: 500px;
    margin-top: 10px;
}
#entry_conf > .conf dl dd input[type=text],
#entry_conf > .conf dl dd input[type=tel],
#entry_conf > .conf dl dd input[type=email],
#entry_conf > .conf dl dd textarea {
    width: 100%;
    padding: 7px;
    border: 1px solid transparent;
}
#entry_conf > .conf dl dd textarea {
    height: 2em !important;
    min-height: 2em;
    resize: vertical;
}
#entry_conf > .conf .button {
    padding-top: 50px;
    border-top: 2px solid #35a77c;
}
/* ボタン */
#entry_conf > .conf .button {
    text-align: center;
}
#entry_conf > .conf .button button {
    width: 300px;
    font-family: "ns-b";
    font-size: 20px;
    padding: 12px 0;
    border: 3px solid #b3b3b3;
    border-radius: 5px;
    position: relative;
    transition: all .3s;
}
#entry_conf > .conf .button button.prev {
    text-indent: 25px;
    margin-right: 20px;
}
#entry_conf > .conf .button button.next {
    text-indent: -25px;
}
#entry_conf > .conf .button button::after {
    content: "";
    display: block;
    position: absolute;
    top: 50%;
    z-index: 10;
    width: 12px;
    height: 12px;
    margin-top: -6px;
    border-top: 2px solid #000000;
    border-right: 2px solid #000000;
}
#entry_conf > .conf .button button.prev::after {
    left: 60px;
    transform: rotate(-135deg) skewY(-5deg) skewX(-5deg);
}
#entry_conf > .conf .button button.next::after {
    right: 100px;
    transform: rotate(45deg) skewY(-5deg) skewX(-5deg);
}
#entry_conf > .conf .button button:hover {
    border: 3px solid #35a77c;
}

/* -----------------------------------------------

entry_send：エントリー応募完了

------------------------------------------------ */
/* 見出し2 */
#entry_send > .head2 {
    background: url("../images/head/entry.jpg") center center no-repeat;
    background-size: cover;
}
/* エントリー応募完了 */
#entry_send > .send .letter {
    text-align: center;
}
#entry_send > .send .button {
    margin-top: 20px;
}
#entry_send > .send .button a {
    width: 300px;
    display: block;
    margin: auto;
    font-family: "ns-b";
    font-size: 20px;
    text-indent: 50px;
    padding: 12px 0;
    border: 3px solid #b3b3b3;
    border-radius: 5px;
    position: relative;
    transition: all .3s;
}
#entry_send > .send .button a::after {
    content: "";
    display: block;
    position: absolute;
    top: 50%;
    right: 50px;
    z-index: 10;
    width: 12px;
    height: 12px;
    margin-top: -6px;
    border-top: 2px solid #000000;
    border-right: 2px solid #000000;
    transform: rotate(45deg) skewY(-5deg) skewX(-5deg);
}
#entry_send > .send .button a:hover {
    border: 3px solid #35a77c;
}

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

リサイズ用：index

=============================================== */
@media screen and (max-width:1080px) {
    #index > .topics {
        display: block;
    }
    #index > .topics h2 {
        margin: 0 0 10px 0;
        text-align: center;
    }
    #index > .maincontents .katawaku h2,
    #index > .maincontents .performance h2 {
        top: 50px;
        left: 50%;
        margin-left: -360px;
    }
    #index > .maincontents .katawaku h2.move,
    #index > .maincontents .performance h2.move {
        top: 50px;
        left: 50%;
        margin-left: -340px;
    }
    #index > .maincontents .katawaku .img {
        width: 650px;
        height: 470px;
        top: 70px;
        left: 48%;
        margin-left: -325px;
        background: url("../images/index/main-contents-1.jpg") center center no-repeat;
        background-size: cover;
    }
    #index > .maincontents .performance .img {
        width: 650px;
        height: 470px;
        top: 70px;
        left: 48%;
        margin-left: -325px;
        background: url("../images/index/main-contents-2.jpg") center center no-repeat;
        background-size: cover;
    }
    #index > .maincontents .katawaku .img.move,
    #index > .maincontents .performance .img.move {
        top: 70px;
        left: 50%;
    }
    #index > .maincontents .katawaku .description,
    #index > .maincontents .performance .description {
        width: 100%;
        height: auto;
        padding: 430px 20px 20px 20px;
        margin: 130px 0 0 0;
    }
    #index > .maincontents .katawaku .description .button,
    #index > .maincontents .performance .description .button {
        position: static;
        text-align: center;
        margin-top: 20px;
    }
    #index > .maincontents .katawaku .description .button a,
    #index > .maincontents .performance .description .button a {
        text-align: left;
    }
    #index > .contact .wrap {
        display: block;
    }
    #index > .contact .wrap .telephone,
    #index > .contact .wrap .mailform {
        width: 100%;
        padding: 10px 0 10px 0;
    }
    #index > .contact .wrap .telephone .number {
        width: 270px;
        padding-left: 60px;
        margin-left: auto;
        margin-right: auto;
        text-indent: 0px;
    }
    #index > .contact .wrap .telephone .number::before {
        left: 0;
    }
    #index > .contact .wrap .mailform {
        border-left: none;
        border-top: 2px solid #5c5c5c;
    }
    #index > .contact .wrap .mailform .button {
        width: 270px;
        padding-left: 60px;
        margin-left: auto;
        margin-right: auto;
    }
    #index > .contact .wrap .mailform .button::before {
        left: 0;
    }
    #index > .contact .wrap .mailform .button a {
        text-indent: 8px;
    }
}
@media screen and (max-width:780px) {
    #index > .firstview .mainvisual * {
        height: 560px;
    }
    #index > .firstview .image {
        top: 70px;
        margin-left: -48px;
    }
    #index > .firstview .image li img {
        width: 101px;
        height: 101px;
    }
    #index > .firstview .image li:nth-child(2) {
        margin: -24px 0 0 -42px;
    }
    #index > .firstview .image li:nth-child(3) {
        margin: -102px 0 0 42px;
    }
    #index > .firstview .catchcopy {
        top: 276px;
        margin-left: -116px;
    }
    #index > .firstview .catchcopy img {
        height: 26px;
    }
    #index > .firstview .catchcopy img:first-child {
        display: block;
        margin-right: 0;
        margin: 0 auto 20px;
    }
    #index > .description {
        margin-top: 20px;
        font-size: 20px;
        line-height: 2;
    }
    #index > .maincontents .katawaku h2,
    #index > .maincontents .performance h2 {
        top: 30px;
        left: 0;
        margin-left: 0;
    }
    #index > .maincontents .katawaku h2.move,
    #index > .maincontents .performance h2.move {
        left: 0;
        margin-left: 0;
    }
    #index > .maincontents .katawaku .img,
    #index > .maincontents .performance .img {
        top: 50px;
        left: 0;
        width: 90%;
        height: 61vw;
        margin: 0 5%;
    }
    #index > .maincontents .katawaku .img.move,
    #index > .maincontents .performance .img.move {
        left: 0;
        margin: 0 5%;
    }
    #index > .maincontents .katawaku .description,
    #index > .maincontents .performance .description {
        padding-top: 54vw;
    }
    #index > .banner {
        margin-top: 30px;
    }
    #index > .banner div a {
        width: 100%;
        height: 51vw;
        background: url("../images/index/banner-recruit-sp.jpg") center center no-repeat;
        background-size: cover;
    }
    #index > .banner div a img {
        opacity: 0;
    }
    #index > .contact .wrap .telephone .responsible br {
        display: block;
    }
    #index > .contact .wrap .telephone .number {
        width: 270px;
    }
    #index > .contact .wrap .telephone .number::before {
        left: 0;
        margin-top: -28px;
    }
    #index > .contact .wrap .telephone .number div {
        position: absolute;
        bottom: -6px;
        left: 10px;
        text-indent: 0;
        font-size: 15px;
    }
    #index > .contact .wrap .telephone .number a {
        width: 260px;
        display: inline-block;
        text-indent: 8px;
        padding: 14px 0;
        border: 3px solid #b3b3b3;
        border-radius: 10px;
        position: relative;
        transition: all .3s;
    }
    #index > .contact .wrap .telephone .number a::after {
        content: "";
        display: block;
        position: absolute;
        top: 50%;
        right: 16px;
        z-index: 10;
        width: 18px;
        height: 18px;
        margin-top: -9px;
        border-top: 3px solid #000000;
        border-right: 3px solid #000000;
        transform: rotate(45deg) skewY(-5deg) skewX(-5deg);
    }
    #index > .contact .wrap .telephone .number a:hover {
        border: 3px solid #35a77c;
    }
    #index > .contact .wrap .mailform .button a {
        width: 260px;
    }
}
@media screen and (max-width:590px) {
    #index > .description br {
        display: block;
    }
    #index > .maincontents .katawaku h2,
    #index > .maincontents .performance h2 {
        width: auto;
        font-size: 24px;
        padding-left: 10px; 
        padding-right: 10px; 
    }
}

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

リサイズ用：katawaku

=============================================== */
@media screen and (max-width:1080px) {
    #katawaku > .flow ul li {
        height: 33vw;
    }
    #katawaku > .flow ul li div {
        height: 3.65vw;
    }
}
@media screen and (max-width:780px) {
    #katawaku > .flow {
        padding: 30px 0;
    }
    #katawaku > .flow ul li {
        width: 70%;
        height: 70vw;
        max-height: initial;
        max-height: auto;
        margin: auto;
    }
    #katawaku > .flow ul li:nth-child(11) {
        width: 70%;
    }
    #katawaku > .flow ul {
        margin-top: 10vw;
    }
    #katawaku > .flow ul li div {
        height: 17%;
        padding-top: 4.5vw;
        align-items: start;
        justify-content: center;
        top: -10vw;
        z-index: 10;
    }
    #katawaku > .flow ul li:nth-child(1) div {
        background: url(../images/katawaku/arrow-sp-1.png) left top no-repeat;
        background-size: cover;
    }
    #katawaku > .flow ul li:nth-child(2) div {
        background: url(../images/katawaku/arrow-sp-2.png) left top no-repeat;
        background-size: cover;
    }
    #katawaku > .flow ul li:nth-child(3) div {
        width: 100%;
        background: url(../images/katawaku/arrow-sp-3.png) left top no-repeat;
        background-size: cover;
    }
    #katawaku > .flow ul li:nth-child(4) div {
        background: url(../images/katawaku/arrow-sp-4.png) left top no-repeat;
        background-size: cover;
    }
    #katawaku > .flow ul li:nth-child(5) div {
        background: url(../images/katawaku/arrow-sp-5.png) left top no-repeat;
        background-size: cover;
    }
    #katawaku > .flow ul li:nth-child(6) div {
        width: 100%;
        background: url(../images/katawaku/arrow-sp-6.png) left top no-repeat;
        background-size: cover;
    }
    #katawaku > .flow ul li:nth-child(7) div {
        background: url(../images/katawaku/arrow-sp-7.png) left top no-repeat;
        background-size: cover;
    }
    #katawaku > .flow ul li:nth-child(8) div {
        background: url(../images/katawaku/arrow-sp-8.png) left top no-repeat;
        background-size: cover;
    }
    #katawaku > .flow ul li:nth-child(9) div {
        width: 100%;
        background: url(../images/katawaku/arrow-sp-9.png) left top no-repeat;
        background-size: cover;
    }
    #katawaku > .flow ul li:nth-child(10) div {
        background: url(../images/katawaku/arrow-sp-10.png) left top no-repeat;
        background-size: cover;
    }
    #katawaku > .flow ul li:nth-child(11) div {
        width: 100%;
        height: 14.5vw;
        padding-top: 0;
        align-items: center;
        background: url(../images/katawaku/arrow-sp-11.png) left top no-repeat;
        background-size: cover;
    }
}
@media screen and (max-width:590px) {
    #katawaku > .head2 h2 {
        letter-spacing: 3px;
    }
    #katawaku > .head2 h2 span {
        margin-right: -3px;
    }
    #katawaku > .flow ul li {
        width: 100%;
        height: 100vw;
        margin: auto;
    }
    #katawaku > .flow ul li:nth-child(11) {
        width: 100%;
    }
    #katawaku > .flow ul li div {
        height: 20%;
    }
}

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

リサイズ用：company

=============================================== */
@media screen and (max-width:780px) {
    #company > .philosophy h4:nth-child(n + 2) {
        line-height: 1.5em;
    }
    #company > .philosophy .wrap {
        display: block;
    }
    #company > .philosophy .wrap .guidelines,
    #company > .philosophy .wrap .attitude {
        width: 100%;
    }
    #company > .philosophy .wrap .guidelines {
        margin-bottom: 20px;
    }
    #company > .philosophy .wrap .guidelines dl,
    #company > .philosophy .wrap .attitude ul {
        padding: 10px 10px 16px;
    }
    #company > .profile > table {
        border: none;
    }
    #company > .profile > table > tbody > tr > th,
    #company > .profile > table > tbody > tr > td {
        display: block;
        width: 100%;
        padding: 2px 10px;
        box-sizing: border-box;
    }
    #company > .profile > table > tbody > tr > th {
        border-top: 2px solid #35a77c;
        border-bottom: 2px solid #35a77c;
    }
    #company > .profile > table > tbody > tr > td > table.supplier > tbody > tr > th > br {
        display: block;
    }
    #company > .profile > table > tbody > tr > td > table.supplier > tbody > tr.hasekou > th {
        line-height: 18px;
        padding: 6px 0;
    }
}

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

リサイズ用：contact

=============================================== */
@media screen and (max-width:780px) {
    #contact > .telephone .responsible br {
        display: block;
    }
    #contact > .mailform dl {
        display: block;
        width: 100%;
    }
    #contact > .mailform dl dt {
        width: auto;
        text-align: center;
    }
    #contact > .mailform dl dd {
        width: auto;
        margin-top: 0;
    }
    #contact > .mailform dl dd input,
    #contact > .mailform dl dd textarea {
        text-align: center;
    }
    #contact > .mailform .privacypolicy {
        margin-top: 20px;
    }
    #contact > .mailform .privacypolicy .letter {
        margin-top: 6px;
    }
    #contact > .mailform .privacypolicy .letter br {
        display: none;
    }
}

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

リサイズ用：contact_conf

=============================================== */
@media screen and (max-width:780px) {
    #contact_conf > .conf .letter {
        padding-bottom: 20px;
    }
    #contact_conf > .conf dl {
        display: block;
        width: auto;
        padding: 0px 0 14px;
    }
    #contact_conf > .conf dl dt {
        width: auto;
        text-align: center;
    }
    #contact_conf > .conf dl dd {
        width: auto;
        margin-top: 0;
    }
    #contact_conf > .conf dl dd input,
    #contact_conf > .conf dl dd textarea {
        text-align: center;
        padding: 0 !important;
    }
    #contact_conf > .conf .button {
        padding-top: 20px;
    }
    #contact_conf > .conf .button button {
        display: block;
        margin: auto;
    }
    #contact_conf > .conf .button button.prev {
        margin-right: auto;
        margin-bottom: 20px;
    }
}

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

リサイズ用：entry

=============================================== */
@media screen and (max-width:780px) {
    #entry > .form dl {
        display: block;
        width: 100%;
    }
    #entry > .form dl dt {
        width: auto;
        text-align: center;
    }
    #entry > .form dl dd {
        width: auto;
        margin-top: 0;
        text-align: center;
    }
    #entry > .form dl dd input,
    #entry > .form dl dd textarea {
        text-align: center;
    }
    #entry > .form .privacypolicy {
        margin-top: 20px;
    }
    #entry > .form .privacypolicy .letter {
        margin-top: 6px;
    }
    #entry > .form .privacypolicy .letter br {
        display: none;
    }
}
@media screen and (max-width:590px) {
    #entry > .head2 h2 {
        letter-spacing: 14px;
    }
    #entry > .head2 h2 span {
        margin-right: -14px;
    }
}

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

リサイズ用：entry_conf

=============================================== */
@media screen and (max-width:780px) {
    #entry_conf > .conf dl {
        display: block;
        width: 100%;
    }
    #entry_conf > .conf dl dt {
        width: auto;
        text-align: center;
    }
    #entry_conf > .conf dl dd {
        width: auto;
        margin-top: 0;
        text-align: center;
    }
    #entry_conf > .conf dl dd input,
    #entry_conf > .conf dl dd textarea {
        text-align: center;
        padding: 0 !important;
    }
    #entry_conf > .conf .button {
        padding-top: 20px;
    }
    #entry_conf > .conf .button button {
        display: block;
        margin: auto;
    }
    #entry_conf > .conf .button button.prev {
        margin-right: auto;
        margin-bottom: 20px;
    }
}
@media screen and (max-width:590px) {
    #entry_conf > .head2 h2 {
        letter-spacing: 14px;
    }
    #entry_conf > .head2 h2 span {
        margin-right: -14px;
    }
}

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

リサイズ用：entry_send

=============================================== */
@media screen and (max-width:590px) {
    #entry_send > .head2 h2 {
        letter-spacing: 14px;
    }
    #entry_send > .head2 h2 span {
        margin-right: -14px;
    }
}

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

リサイズ用：recruit

=============================================== */
@media screen and (max-width:1080px) {
    #recruit > .comment .contact .wrap {
        display: block;
    }
    #recruit > .comment .contact .wrap .telephone,
    #recruit > .comment .contact .wrap .entryform {
        width: 100%;
        padding: 10px 0 10px 0;
    }
    #recruit > .comment .contact .wrap .telephone .number {
        width: 270px;
        padding-left: 60px;
        margin-left: auto;
        margin-right: auto;
        text-indent: 0px;
    }
    #recruit > .comment .contact .wrap .telephone .number::before {
        left: 0;
    }
    #recruit > .comment .contact .wrap .entryform {
        border-left: none;
        border-top: 2px solid #5c5c5c;
    }
    #recruit > .comment .contact .wrap .entryform .button {
        margin-left: auto;
        margin-right: auto;
    }
    #recruit > .comment .contact .wrap .entryform .button::before {
        left: 0;
    }
}
@media screen and (max-width:780px) {
    #recruit > .requirement table {
        border: none;
    }
    #recruit > .requirement table tbody tr th,
    #recruit > .requirement table tbody tr td {
        display: block;
        width: 100%;
        padding: 2px 10px;
        box-sizing: border-box;
    }
    #recruit > .requirement table tbody tr th {
        border-top: 2px solid #35a77c;
        border-bottom: 2px solid #35a77c;
    }
    #recruit > .comment .young {
        display: block;
    }
    #recruit > .comment .young li {
        width: 70%;
        margin: auto;
    }
    #recruit > .comment .young li:nth-child(n + 2) {
        margin-top: 20px;
    }
    #recruit > .comment .young li .img img {
        width: 300px;
        height: 300px;
    }
    #recruit > .comment .veteran {
        display: block;
        width: 70%;
        margin: auto;
        margin-top: 20px;
    }
    #recruit > .comment .veteran .left {
        width: auto;
    }
    #recruit > .comment .veteran .left .img img {
        width: 300px;
        height: 300px;
    }
    #recruit > .comment .veteran .right {
        width: auto;
        margin: 40px auto 0;
    }
    #recruit > .comment .veteran .right:before {
        top: -20px;
        left: 50%;
        margin-left: -26px;
        transform: rotate(-45deg) skewY(-5deg) skewX(-5deg);
        background-color: #4af7b6;
    }
    #recruit > .comment .veteran .right h5 {
        position: relative;
        z-index: 10;
    }
    #recruit > .comment .introduction {
        margin-top: 20px;
    }
    #recruit > .comment .contact {
            margin: 30px auto 0;
    }
    #recruit > .comment .contact .wrap .telephone .responsible br {
        display: block;
    }
    #recruit > .comment .contact .wrap .telephone .number::before {
        left: 0;
        margin-top: -28px;
    }
    #recruit > .comment .contact .wrap .telephone .number div {
        position: absolute;
        bottom: -6px;
        left: 10px;
        text-indent: 0;
        font-size: 15px;
    }
    #recruit > .comment .contact .wrap .telephone .number a {
        font-size: 28px;
        width: 244px;
        display: inline-block;
        text-indent: 8px;
        padding: 14px 0;
        border: 3px solid #b3b3b3;
        border-radius: 10px;
        position: relative;
        transition: all .3s;
    }
    #recruit > .comment .contact .wrap .telephone .number a::after {
        content: "";
        display: block;
        position: absolute;
        top: 50%;
        right: 14px;
        z-index: 10;
        width: 18px;
        height: 18px;
        margin-top: -9px;
        border-top: 3px solid #000000;
        border-right: 3px solid #000000;
        transform: rotate(45deg) skewY(-5deg) skewX(-5deg);
    }
    #recruit > .comment .contact .wrap .telephone .number a:hover {
        border: 3px solid #35a77c;
    }
    #recruit > .comment .contact .wrap .entryform .button a {
        width: 304px;
        font-size: 28px;
        text-indent: 8px;
    }
    #recruit > .comment .contact .wrap .entryform .button a::after {
        right: 14px;
    }
}
@media screen and (max-width:590px) {
    #recruit > .comment .young li {
        width: auto;
    }
    #recruit > .comment .young li .img img {
        width: 60%;
        height: 60%;
    }
    #recruit > .comment .veteran {
        width: auto;
    }
    #recruit > .comment .veteran .left .img img {
        width: 60%;
        height: 60%
    }
}

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

リサイズ用：works

=============================================== */
@media screen and (max-width:1080px) {
    #works > .foreman ul {
        width: 590px;
        margin-left: auto;
        margin-right: auto;
        justify-content: center;
    }
    #works > .foreman ul li {
        width: 30%;
    }
    #works > .foreman ul li:nth-child(n + 4) {
        margin-top: 20px;
    }
    #works > .foreman ul li:nth-child(2),
    #works > .foreman ul li:nth-child(3),
    #works > .foreman ul li:nth-child(5) {
        margin-left: 5%;
    }
    #works > .foreman ul li a .button {
        text-indent: 44px;
    }
    #works > .foreman ul li a .button::after {
        right: 40px;
    }
    #works > .foreman ul li:nth-child(2) a .button {
        text-indent: 55px;
    }
    #works > .foreman ul li:nth-child(2) a .button::after {
        right: 46px;
    }
    .works_episode_inner {
        width: auto;
        padding: 0;
    }
    .works_episode_inner .comment {
        padding: 310px 10px 10px 10px;
        border: none;
    }
    .works_episode_inner .comment .letter {
        margin-top: 10px;
    }
    .works_episode_inner .athlete_grandprix {
        margin-left: 0px;
    }
}
@media screen and (max-width:780px) {
    #works > .example ul li {
        width: 49%;
    }
    #works > .example ul li .img,
    #works > .example ul li .img a {
        height: 44vw;
        max-height: initial;
        max-height: auto;
    }
    #works > .example ul li:nth-child(n + 4) {
        margin: 0;
    }
    #works > .example ul li:nth-child(n + 3) {
        margin-top: 20px;
    }
    #works > .foreman ul {
        width: 500px;
        justify-content: start;
    }
    #works > .foreman ul li {
        width: 45%;
    }
    #works > .foreman ul li:nth-child(n + 4) {
        margin-top: 0;
    }
    #works > .foreman ul li:nth-child(2),
    #works > .foreman ul li:nth-child(3),
    #works > .foreman ul li:nth-child(5) {
        margin-left: 0;
    }
    #works > .foreman ul li:nth-child(n + 3) {
        margin-top: 20px;
    }
    #works > .foreman ul li:nth-child(2),
    #works > .foreman ul li:nth-child(4) {
        margin-left: 10%;
    }
    #works > .foreman ul li a .button {
        text-indent: 64px;
    }
    #works > .foreman ul li a .button::after {
        right: 64px;
    }
    #works > .foreman ul li:nth-child(2) a .button {
        text-indent: 76px;
    }
    #works > .foreman ul li:nth-child(2) a .button::after {
        right: 70px;
    }
}
@media screen and (max-width:590px) {
    #works > .example ul li {
        width: 100%;
    }
    #works > .example ul li .img,
    #works > .example ul li .img a {
        height: 89vw;
    }
    #works > .example ul li:nth-child(n + 3) {
        margin: 0;
    }
    #works > .example ul li:nth-child(n + 2) {
        margin-top: 20px;
    }
    #works > .example ul li .img a:hover::before {
        transform: scale(1);
    }
    #works > .foreman .episode {
        text-align: justify;
        text-justify:inter-ideograph;
    }
    #works > .foreman ul {
        width: auto;
        margin-top: 20px;
    }
    #works > .foreman ul li {
        width: 45%;
    }
    #works > .foreman ul li:nth-child(n + 4) {
        margin-top: 0;
    }
    #works > .foreman ul li:nth-child(2),
    #works > .foreman ul li:nth-child(3),
    #works > .foreman ul li:nth-child(5) {
        margin-left: 0;
    }
    #works > .foreman ul li:nth-child(n + 3) {
        margin-top: 20px;
    }
    #works > .foreman ul li:nth-child(2),
    #works > .foreman ul li:nth-child(4) {
        margin-left: 10%;
    }
    #works > .foreman ul li a .button {
        text-indent: 10px;
    }
    #works > .foreman ul li a .button::after {
        right: 10px;
    }
    #works > .foreman ul li:nth-child(2) a .button {
        text-indent: 10px;
    }
    #works > .foreman ul li:nth-child(2) a .button::after {
        right: 10px;
    }
    .featherlight .featherlight-content {
        width: 92%;
        margin: 0 4%;
    }
    .featherlight .featherlight-close-icon {
        line-height: 35px;
        width: 35px;
        font-size: 35px;
    }
    .works_episode_inner .construction {
        left: 50%;
        margin-left: -160px;
    }
    .works_episode_inner .comment{
        width: auto;
    }
    .works_episode_inner .athlete_grandprix {
        padding: 30px 10px 30px 10px;
    }
    .works_episode_inner .img {
        right: 0;
        left: 50%;
        margin-left: 50px;
    }
    .works_episode_inner .comment .letter {
        font-size: 14px;
        line-height: 18px;
        margin-top: 2px;
    }
}

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

IE対応

=============================================== */
@media all and (-ms-high-contrast: none) {
    #index > .description,
    #index > .maincontents .katawaku h2,
    #index > .maincontents .katawaku .description .button a,
    #index > .maincontents .performance h2,
    #index > .maincontents .performance .description .button a,
    #index > .contact h3,
    #index > .contact .wrap .telephone h4,
    #index > .contact .wrap .telephone .number a,
    #index > .contact .wrap .mailform h4,
    #index > .contact .wrap .mailform .button a,
    #katawaku > .flow ul li div span,
    .works_episode_inner .comment .head,
    .works_episode_inner .athlete_grandprix .letter,
    #recruit > .comment .young li h4,
    #recruit > .comment .veteran .left h4,
    #recruit > .comment .veteran .right h5,
    #recruit > .comment > .button a,
    #recruit > .comment .contact h3,
    #recruit > .comment .contact .wrap .telephone h4,
    #recruit > .comment .contact .wrap .telephone .number a,
    #recruit > .comment .contact .wrap .entryform h4,
    #recruit > .comment .contact .wrap .entryform .button a,
    #contact > .mailform dl dt,
    #contact > .mailform .privacypolicy h4,
    #contact > .mailform .privacypolicy .overview h5,
    #contact > .mailform .button button,
    #contact_conf > .conf dl dt,
    #contact_conf > .conf .button button,
    #contact_send > .send .button a,
    #entry > .form dl dt,
    #entry > .form .privacypolicy h4,
    #entry > .form .privacypolicy .overview h5,
    #entry > .form .button button,
    #entry_conf > .conf dl dt,
    #entry_conf > .conf .button button,
    #entry_send > .send .button a {
        font-weight: bold;
    }
    #katawaku > .flow ul li div span {
        font-size: 30px;
    }
}
@media all and (-ms-high-contrast: none) and (max-width:1080px) {
    #index > .contact .wrap .telephone .number {
        width: 310px;
    }
    #recruit > .comment .contact .wrap .telephone .number {
        width: 310px;
    }
}
@media all and (-ms-high-contrast: none) and (max-width:780px) {
    #index > .contact .wrap .telephone .number a {
        font-size: 26px;
    }
    #recruit > .comment .contact .wrap .telephone .number a {
        font-size: 26px;
    }
    #katawaku > .flow ul li div {
        height: 13vw;
        padding: 0 0 4vw 0;
    }
}
@media all and (-ms-high-contrast: none) and (max-width:590px) {
    #katawaku > .flow ul li div {
        height: 20vw;
        padding: 0 0 5vw 0;
    }
}