@charset "utf-8";
/**
* Common
**/
* {
    padding: 0;
    margin: 0;
}

html,body {
    height: 100%;
}

body {
    font-family: "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック体", "YuGothic", "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", "Meiryo", "verdana", sans-serif;
    color: #000;
    position: relative;
}

a {
    text-decoration: none;
}

ul {
    list-style: none;
}

img {
    max-width: 100%;
}

table {
    border-collapse: collapse;
}

.f-bold {
    font-weight: bold;
}

.color-gray {
    color: #575757;
}

.color-white{
    color:#fff;
}

.color-blue {
    color: #1a6cbe;
}

.color-blue-2 {
    color: #002060;
}

.color-orange {
    color: #ff7900;
}

.color-yellow {
    color: #ffff00;
}

/* パソコンで見たときは"pc"のclassがついた画像が表示される */
.pc { display: block !important; }
.sp { display: none !important; }

/* スマートフォンで見たときは"sp"のclassがついた画像が表示される */
@media only screen and (max-width: 768px) {
    .pc { display: none !important; }
    .sp { display: block !important; }
}

.inner {
    padding: 48px 0;
}
@media only screen and (max-width: 768px) {
    .inner {
        padding: 36px 0;
    }
}
@media only screen and (max-width: 480px) {
    .inner {
        padding: 24px 0;
    }
}

.wrapper {
    max-width: 1200px;
    padding: 0 5%;
    margin: 0 auto;
}

.text-center {
    text-align: center;
}

.flex-box {
    display: flex;
}

header .inner {
    padding-top: 48px;
    position: relative;
    width: 100%;
    min-height: 68vh;
    background: url("../images/main_back.png") center / cover;
    background-repeat: no-repeat;
}
@media only screen and (max-width: 768px) {
    header {
        margin-bottom: -42px;
        padding-bottom: 40px;
        background: #193264;
    }
    header .inner {
        background: url("../images/sp/main_back_sp.png");
        background-size: contain;
        background-repeat: no-repeat;
        min-height: 0;
        height:0;
        padding: 0;
        padding-top: 97.2%;
    }
    .catch {
        position: absolute;
        top: 5%;
        left: 5%;
    }
    .main-cv-sp{
        position: relative;
    }
}

header h1 {
    padding-left: 4%;
}

header h1 .logo-img {
    max-width: 24.5vw;
    width: 100%;
}
@media only screen and (max-width: 768px) {
    header h1 .logo-img {
        max-width: 38vw;
    }
}

header .main-title-img {
    max-width: 680px;
    width: 50vw;
    margin-top: 40px;
}

/**
* main-cv-sp-img
**/
.main-cv-sp-img {
    max-width: 100%;
    width: 100%;
}

/**
* lead
**/
.lead .wrapper {
    position: relative;
}

.lead .lead-text {
    max-width: 60%;
    width: 100%;
}
@media only screen and (max-width: 768px) {
    .lead .lead-text {
        max-width: 100%;
    }
}

.lead .lead-text p {
    font-size: 22px;
    line-height: 2.0;
}
@media only screen and (max-width: 768px) {
    .lead .lead-text p {
        font-size: 20px;
    }
}
@media only screen and (max-width: 480px) {
    .lead .lead-text p {
        font-size: 16px;
    }
}

.lead .main-cv-img {
    max-width: 530px;
    width: 40vw;
    position: absolute;
    right: 0;
    top: -260px;
}

/**
* kadai
**/
.kadai .inner {
    position: relative;
}

.kadai .inner:before {
    content: "";
    width: 100%;
    height: 100%;
    background-color: #e3e3e3;
    position: absolute;
    z-index: -1;
    top: 260px;
}

.kadai .section-title h2 {
    font-size: 36px;
}
@media only screen and (max-width: 768px) {
    .kadai .inner {
        padding-bottom:64px;
    }
    .kadai .inner:before{
        top: 78px;
    }
    .kadai .section-title h2 {
        font-size: 32px;
    }
}
@media only screen and (max-width: 480px) {
    .kadai .inner {
        padding-bottom:28px;
    }
    .kadai .inner:before{
        top: 56px;
    }
    .kadai .section-title h2 {
        font-size: 22px;
    }
}

.kadai .section-body {
    margin-top: 28px;
}
@media only screen and (max-width: 768px) {
    .kadai .section-body {
        margin-top: 16px;
    }
}
@media only screen and (max-width: 480px) {
    .kadai .section-body {
        margin-top: 8px;
    }
}

.kadai .kadai-box {
    justify-content: space-between;
}
@media only screen and (max-width: 768px) {
    .kadai .kadai-box {
        flex-wrap: wrap;
    }
}

.kadai .kadai-box .kadai-block {
    width: 23%;
}
@media only screen and (max-width: 768px) {
    .kadai .kadai-box .kadai-block {
        width: 48%;
    }
}

.kadai .kadai-box .kadai-block .kadai-img {
    text-align: center;
}

.kadai .kadai-box .kadai-block .kadai-title {
    min-height:96px;
}
@media only screen and (max-width: 768px) {
    .kadai .kadai-box .kadai-block .kadai-title {
        min-height:0;
    }
}

.kadai .kadai-box .kadai-block .kadai-title p {
    font-size: 21px;
}
@media only screen and (max-width: 480px) {
    .kadai .kadai-box .kadai-block .kadai-title p {
        font-size: 15px;
    }
}

.kadai .kadai-box .kadai-block .kadai-text {
    margin-top: 24px;
}
@media only screen and (max-width: 768px) {
    .kadai .kadai-box .kadai-block .kadai-text {
        margin-top: 16px;
    }
}
@media only screen and (max-width: 480px) {
    .kadai .kadai-box .kadai-block .kadai-text {
        margin-top: 8px;
    }
}

.kadai .kadai-box .kadai-block .kadai-text p {
    font-size: 18px;
}
@media only screen and (max-width: 480px) {
    .kadai .kadai-box .kadai-block .kadai-text p {
        font-size: 14px;
    }
}

/**
* solution
**/
.solution {
    position: relative;
}
.solution:before{
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    transform: skewY(-5deg);
    transform-origin: top right;
    z-index: -1;
    width: 100%;
    height: 100%;
    background: #ffffc2;
}
.solution .inner{
    position: relative;
    top: -40px;
}
@media only screen and (max-width: 768px) {
    .solution .inner {
        padding-top:0;
        top: -20px;
    }
    .solution .inner h2 {
        position: relative;
    }
}
@media only screen and (max-width: 480px) {
    .solution .inner {
        padding-top:0;
        top: -8px;
        padding-bottom: 8px;
    }
}

.solution .solution-img {
    width: 100%;
    margin: 0 auto;
}

.solution .solution-box {
    justify-content: space-between;
    margin-top: 24px;
}
@media only screen and (max-width: 768px) {
    .solution .solution-box {
        flex-wrap: wrap;
    }
}

.solution .solution-box .solution-block {
    width: 48%;
}
@media only screen and (max-width: 768px) {
    .solution .solution-box .solution-block {
        width: 100%;
    }
}

.solution .solution-box .solution-block .solution-img-1 {
    max-width: 570px;
    width: 100%;
}
@media only screen and (max-width: 768px) {
    .solution .solution-box .solution-block .solution-img-1 {
        margin-bottom: 24px;
    }
}

.solution .solution-box .solution-block .solution-text p {
    font-size: 20px;
    line-height: 2.0;
}

@media only screen and (max-width: 480px) {
    .solution .solution-box .solution-block .solution-text p {
        font-size: 16px;
    }
}


.solution .point {
    margin-top: 88px;
    position: relative;
}
@media only screen and (max-width: 768px) {
    .solution .point {
        margin-top: 48px;
    }
}
@media only screen and (max-width: 480px) {
    .solution .point {
        margin-top: 24px;
    }
}

.solution .point .point-card {
    max-width: 1000px;
    width: 100%;
    margin: 0 auto;
    background-color: #fff;
    border-radius: 16px;
    box-shadow: 4px 4px 4px #ccc;
}
@media only screen and (max-width: 768px) {
    .solution .point .point-card {
        max-width: 100%;
        border-radius: 16px;
        box-shadow: 3px 3px 3px #ccc;
    }
}

.solution .point .point-card .point-inner {
    padding: 32px 40px;
}
@media only screen and (max-width: 768px) {
    .solution .point .point-card .point-inner {
        padding: 20px 22px;
    }
}

.solution .point .point-card .point-box {
    justify-content: space-between;
    align-items: center;
}

@media only screen and (max-width: 1024px) {
    .solution .point .point-card ul {
        max-width: 70%;
    }
}
@media only screen and (max-width: 768px) {
    .solution .point .point-card ul {
        max-width: 100%;
    }
}

.solution .point .point-card ul li {
    font-size: 26px;
    font-weight: bold;
    background:url(../images/point_icon.png) no-repeat 0 0;
    background-size:auto 36px;
    padding-left: 56px;
    margin-bottom: 20px;
}
@media only screen and (max-width: 1024px) {
    .solution .point .point-card ul li {
        font-size: 24px;
        padding-left: 48px;
        margin-bottom: 16px;
    }
}
@media only screen and (max-width: 768px) {
    .solution .point .point-card ul li {
        font-size: 18px;
        padding-left: 32px;
        background-size:auto 24px;
        margin-bottom: 16px;
    }
}
@media only screen and (max-width: 480px) {
    .solution .point .point-card ul li {
        font-size: 14px;
        padding-left: 28px;
        background-size:auto 22px;
        margin-bottom: 12px;
    }
}

.solution .point .point-card ul li:last-of-type {
    margin-bottom: 0;
}

.solution .point .point-img {
    max-width: 212px;
    width: 100%;
    position: absolute;
    bottom: 4%;
    right: 0;
}
@media only screen and (max-width: 1024px) {
    .solution .point .point-img {
        max-width: 170px;
    }
}
@media only screen and (max-width: 768px) {
    .solution .point .point-img {
        position: relative;
        bottom: 0;
        max-width: 150px;
    }
}
@media only screen and (max-width: 480px) {
    .solution .point .point-img {
        max-width: 120px;
    }
}

.solution .solution-graph {
    margin-top: 40px;
}
@media only screen and (max-width: 768px) {
    .solution .solution-graph {
        margin-top: 32px;
    }
}

.solution .solution-graph p {
    font-size: 26px;
}
@media only screen and (max-width: 768px) {
    .solution .solution-graph p {
        font-size: 24px;
    }
}
@media only screen and (max-width: 480px) {
    .solution .solution-graph p {
        font-size: 20px;
    }
}

.solution .solution-graph .solution-graph-img {
    margin-top: 12px;
}

.solution .solution-btn-img {
    position: relative;
}

.solution .solution-btn-img .btn-text {
    position: absolute;
    top: 44%;
    left: 55%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
}
@media only screen and (max-width: 768px) {
    .solution .solution-btn-img .btn-text {
        max-width: 80%;
        width: 100%;
        text-align: center;
        top: 46%;
        left: 54%;
    }
}
@media only screen and (max-width: 480px) {
    .solution .solution-btn-img .btn-text {
        left: 56%;
    }
}

.solution .solution-btn-img .btn-text p {
    font-size: 28px;
}
@media only screen and (max-width: 768px) {
    .solution .solution-btn-img .btn-text p {
        font-size: 26px;
    }
}
@media only screen and (max-width: 640px) {
    .solution .solution-btn-img .btn-text p {
        font-size: 20px;
    }
}
@media only screen and (max-width: 480px) {
    .solution .solution-btn-img .btn-text p {
        font-size: 15px;
    }
}

.solution .solution-btn-img .btn-text span {
    font-size: 36px;
}
@media only screen and (max-width: 768px) {
    .solution .solution-btn-img .btn-text span {
        font-size: 30px;
    }
}
@media only screen and (max-width: 640px) {
    .solution .solution-btn-img .btn-text span {
        font-size: 26px;
    }
}
@media only screen and (max-width: 480px) {
    .solution .solution-btn-img .btn-text span {
        font-size: 18px;
    }
}

.solution .solution-btn-img {
    margin-top: 48px;
}
@media only screen and (max-width: 768px) {
    .solution .solution-btn-img {
        margin-top: 36px;
    }
}
@media only screen and (max-width: 480px) {
    .solution .solution-btn-img {
        margin-top: 28px;
    }
}

/**
* 小島追加ここから
**/
/**
* 
無償デモ説明文
**/
.solution .section-title {
    margin-bottom: 10px; margin-top: 50px;
}

@media only screen and (max-width: 480px) {
    .solution .section-title {
    margin-bottom: 10px; margin-top: 10px;
}
}

.solution .solution-text p {
    font-size: 20px;
    line-height: 2.0;
}

.solution .solution-text ul{
    margin-top: 15px;
	margin-bottom: 15px;
       
}

.solution .solution-text li{
    font-size: 20px;
    line-height: 2.0;
    font-weight: bold;
    background:url("../images/demo_point.png") no-repeat 0 0;
    background-size:auto 36px;
    padding-left: 40px;
    
}

.solution .section-title h2 {
    font-size: 40px;
}
@media only screen and (max-width: 768px) {
    .solution .section-title h2 {
        font-size: 40px; 
    }
}
@media only screen and (max-width: 480px) {
    .solution .section-title h2 {
        font-size: 24px;
}
}
.solution .solution-text p {
    font-size: 20px;
    line-height: 2.0;
}
@media only screen and (max-width: 480px) {
    .solution .solution-text p {
        font-size: 16px;
    }
	.solution .solution-text ul{
    margin-top: 0px;
	margin-bottom: 0px;
}
	.solution .solution-text li{
    font-size: 16px;
    line-height: 2.0;
    font-weight: bold;
    background:url("../images/demo_point.png") no-repeat 0 0;
    background-size:auto 34px;
    padding-left: 30px;
	padding-top: 3px;
    
}
}
/**
* cv-btn　無償デモ追従ボタン位置指定
**/

.cv-btn {
    position: fixed;
    right: 0;
    bottom: 12%;
}

.cv-btn .cv-btn-img {
    max-width: 40px;
    width: 100%;
}

.cv-btn .cv-btn-2-img {
    margin-top: 12px;
}

/**
* cv-btn　無償デモCTAフォント指定
**/

.solution .btn-img .btn-text-2 {
    position: absolute;
    top: 44%;
    left: 53%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
}
@media only screen and (max-width: 768px) {
    .solution .btn-img .btn-text-2 {
        left: 50%;
        max-width: 80%;
        width: 100%;
        text-align: center;
    }
}
@media only screen and (max-width: 480px) {
    .solution .btn-img .btn-text-2 {
        left: 52%;
    }
}

.solution .btn-img .btn-text-2 p {
    font-size: 28px;
}
@media only screen and (max-width: 1024px) {
    .solution .btn-img .btn-text-2 p {
        font-size: 18px;
    }
}
@media only screen and (max-width: 768px) {
    .cost .btn-img .btn-text p {
        font-size: 22px;
    }
}
@media only screen and (max-width: 640px) {
    .solution .btn-img .btn-text-2 p {
        font-size: 15px;
    }
}
@media only screen and (max-width: 480px) {
    .solution .btn-img .btn-text-2 p {
        font-size: 12px;
    }
}

.solution .btn-img .btn-text-2 span {
    font-size: 36px;
}
@media only screen and (max-width: 1024px) {
    .solution .btn-img .btn-text-2 span {
        font-size: 24px;
    }
}
@media only screen and (max-width: 768px) {
    .solution .btn-img .btn-text-2 span {
        font-size: 26px;
    }
}
@media only screen and (max-width: 640px) {
    .solution .btn-img .btn-text-2 span {
        font-size: 20px;
    }
}
@media only screen and (max-width: 480px) {
   .solution .btn-img .btn-text-2 span {
        font-size: 14px;
    }
}




/**
* 小島追加ここまで
**/




/**
* cost
**/
.cost{
    background-color: #ffffff;
}
.cost .inner {
    padding-top: 180px;
    padding-bottom: 48px;
}
@media only screen and (max-width: 768px) {
    .cost .inner {
        padding-top: 64px;
    }
}

.cost .section-title {
    border-top: 2px solid #000;
    padding-top: 32px;
}

.cost .section-title h2 {
    font-size: 48px;
}
@media only screen and (max-width: 768px) {
    .cost .section-title h2 {
        font-size: 40px;
    }
}
@media only screen and (max-width: 480px) {
    .cost .section-title h2 {
        font-size: 26px;
    }
}

.cost .section-title .cost-title-img {
    max-width: 680px;
    width: 100%;
    margin: 0 auto;
    margin-top: 20px;
}
@media only screen and (max-width: 768px) {
    .cost .section-title .cost-title-img {
        max-width: 100%;
        margin-top: 16px;
    }
}
@media only screen and (max-width: 480px) {
    .cost .section-title .cost-title-img {
        margin-top: 12px;
    }
}

.cost .cost-text {
    margin-top: 40px;
}
@media only screen and (max-width: 480px) {
    .cost .cost-text {
        margin-top: 28px;
    }
}

.cost .cost-text p {
    font-size: 20px;
    line-height: 2.0;
}
@media only screen and (max-width: 480px) {
    .cost .cost-text p {
        font-size: 16px;
    }
}

.cost .cost-box {
    justify-content: space-between;
    margin-top: 20px;
}
@media only screen and (max-width: 768px) {
    .cost .cost-box {
        flex-wrap: wrap;
    }
}

.cost .cost-box .cost-block {
    width: 40%;
    background-color: #ffff00;
    border-radius: 8px;
    padding: 48px 40px;
}
@media only screen and (max-width: 1024px) {
    .cost .cost-box .cost-block {
        width: 39%;
        padding: 40px 32px;
    }
}

@media only screen and (max-width: 768px) {
    .cost .cost-box .cost-block {
        width: 100%;
        margin-bottom: 40px;
    }
}
@media only screen and (max-width: 480px) {
    .cost .cost-box .cost-block {
        margin-bottom: 20px;
        padding: 24px;
    }
}

@media only screen and (max-width: 768px) {
    .cost .cost-box .cost-block:last-of-type {
        margin-bottom: 0;
    }
}

.cost .cost-box .cost-block .cost-img {
    max-width: 414px;
    width: 100%;
    margin: 0 auto;
}
@media only screen and (max-width: 480px) {
    .cost .cost-box .cost-block .cost-img {
        max-width: 320px;
    }
}

.cost .cost-box .cost-block .title {
    margin-top: 32px;
}
@media only screen and (max-width: 480px) {
    .cost .cost-box .cost-block .title {
        margin-top: 20px;
    }
}

.cost .cost-box .cost-block .title .main {
    font-size: 32px;
}
@media only screen and (max-width: 768px) {
    .cost .cost-box .cost-block .title .main {
        font-size: 28px;
    }
}
@media only screen and (max-width: 480px) {
    .cost .cost-box .cost-block .title .main {
        font-size: 24px;
    }
}

.cost .cost-box .cost-block .title .sub {
    font-size: 14px;
}

.cost .cost-box .cost-block .text {
    margin-top: 24px;
}
@media only screen and (max-width: 480px) {
    .cost .cost-box .cost-block .text {
        margin-top: 20px;
    }
}

.cost .cost-box .cost-block .text p {
    font-size: 18px;
}
@media only screen and (max-width: 768px) {
    .cost .cost-box .cost-block .text p {
        font-size: 17px;
    }
}
@media only screen and (max-width: 480px) {
    .cost .cost-box .cost-block .text p {
        font-size: 16px;
    }
}

.cost .btn-img {
    position: relative;
}

.cost .btn-img .btn-text {
    position: absolute;
    top: 44%;
    left: 53%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
}
@media only screen and (max-width: 768px) {
    .cost .btn-img .btn-text {
        left: 50%;
        max-width: 80%;
        width: 100%;
        text-align: center;
    }
}
@media only screen and (max-width: 480px) {
    .cost .btn-img .btn-text {
        left: 52%;
    }
}

.cost .btn-img .btn-text p {
    font-size: 28px;
}
@media only screen and (max-width: 1024px) {
    .cost .btn-img .btn-text p {
        font-size: 18px;
    }
}
@media only screen and (max-width: 768px) {
    .cost .btn-img .btn-text p {
        font-size: 22px;
    }
}
@media only screen and (max-width: 640px) {
    .cost .btn-img .btn-text p {
        font-size: 15px;
    }
}
@media only screen and (max-width: 480px) {
    .cost .btn-img .btn-text p {
        font-size: 12px;
    }
}

.cost .btn-img .btn-text span {
    font-size: 36px;
}
@media only screen and (max-width: 1024px) {
    .cost .btn-img .btn-text span {
        font-size: 24px;
    }
}
@media only screen and (max-width: 768px) {
    .cost .btn-img .btn-text span {
        font-size: 26px;
    }
}
@media only screen and (max-width: 640px) {
    .cost .btn-img .btn-text span {
        font-size: 20px;
    }
}
@media only screen and (max-width: 480px) {
    .cost .btn-img .btn-text span {
        font-size: 14px;
    }
}

.cost .cost-btn {
    margin-top: 48px;
}
@media only screen and (max-width: 768px) {
    .cost .cost-btn {
        margin-top: 32px;
    }
}
@media only screen and (max-width: 480px) {
    .cost .cost-btn {
        margin-top: 20px;
    }
}

/**
* download
**/
.download .section-title {
    margin-bottom: 24px;
}
@media only screen and (max-width: 768px) {
    .download .section-title {
        margin-bottom: 12px;
    }
}

.download .section-title h2 {
    font-size: 30px;
}
@media only screen and (max-width: 768px) {
    .download .section-title h2 {
        font-size: 28px;
    }
}
@media only screen and (max-width: 480px) {
    .download .section-title h2 {
        font-size: 20px;
    }
}

.download .inner {
    position: relative;
    width: 100%;
    min-height: 40vh;
    background: url("../images/download_back.png") center / cover;
}

.download .download-box {
    justify-content: space-between;
}
@media only screen and (max-width: 768px) {
    .download .download-box {
        flex-wrap: wrap;
    }
}

.download .download-box .download-block {
    width: 47%;
}
@media only screen and (max-width: 768px) {
    .download .download-box .download-block {
        width: 100%;
    }
}

.download .download-box .download-block .title p {
    font-size: 36px;
}
@media only screen and (max-width: 768px) {
    .download .download-box .download-block .title p {
        font-size: 32px;
        line-height: 1.5;
    }
}
@media only screen and (max-width: 480px) {
    .download .download-box .download-block .title p {
        font-size: 21px;
    }
}

.download .download-box .download-block .text {
    margin-top: 24px;
}
@media only screen and (max-width: 480px) {
    .download .download-box .download-block .text {
        margin-top: 12px;
    }
}

.download .download-box .download-block .text p {
    font-size: 18px;
}
@media only screen and (max-width: 480px) {
    .download .download-box .download-block .text p {
        font-size: 14px;
    }
}

.download .btn-img {
    position: relative;
    margin-top: 20px;
}
@media only screen and (max-width: 768px) {
    .download .btn-img {
        max-width: 80%;
        width: 100%;
        margin: 0 auto;
    }
}

.download .btn-img .btn-text {
    position: absolute;
    top: 50%;
    left: 56%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    max-width: 80%;
    width: 100%;
    text-align: center;
}
@media only screen and (max-width: 1024px) {
    .download .btn-img .btn-text {
        left: 58%;
    }
}
@media only screen and (max-width: 768px) {
    .download .btn-img .btn-text {
        left: 55%;
    }
}
@media only screen and (max-width: 480px) {
    .download .btn-img .btn-text {
        left: 56%;
    }
}

.download .btn-img .btn-text p {
    font-size: 28px;
}
@media only screen and (max-width: 1024px) {
    .download .btn-img .btn-text p {
        font-size: 24px;
    }
}
@media only screen and (max-width: 768px) {
    .download .btn-img .btn-text p {
        font-size: 26px;
    }
}
@media only screen and (max-width: 640px) {
    .download .btn-img .btn-text p {
        font-size: 20px;
    }
}
@media only screen and (max-width: 480px) {
    .download .btn-img .btn-text p {
        font-size: 15px;
    }
}

.download .btn-img .btn-text span {
    font-size: 36px;
}
@media only screen and (max-width: 1024px) {
    .download .btn-img .btn-text span {
        font-size: 28px;
    }
}
@media only screen and (max-width: 768px) {
    .download .btn-img .btn-text span {
        font-size: 32px;
    }
}
@media only screen and (max-width: 640px) {
    .download .btn-img .btn-text span {
        font-size: 24px;
    }
}
@media only screen and (max-width: 480px) {
    .download .btn-img .btn-text span {
        font-size: 18px;
    }
}

/**
* contact
**/
.contact .title-sp {
    padding: 24px 0;
}
@media only screen and (max-width: 480px) {
    .contact .title-sp {
        padding: 12px 0;
    }
}

.contact .title-sp h2 {
    font-size: 28px;
}
@media only screen and (max-width: 480px) {
    .contact .title-sp h2 {
        font-size: 20px;
    }
}

.contact .inner {
    background-color: #f7f6f3;
}

.contact .section-title h2 {
    font-size: 30px;
}
@media only screen and (max-width: 768px) {
    .contact .section-title h2 {
        font-size: 28px;
    }
}
@media only screen and (max-width: 480px) {
    .contact .section-title h2 {
        font-size: 20px;
    }
}

.contact .contact-box {
    justify-content: space-between;
    margin-top: 66px;
}
@media only screen and (max-width: 768px) {
    .contact .contact-box {
        flex-wrap: wrap;
        margin-top: 40px;
    }
}
@media only screen and (max-width: 480px) {
    .contact .contact-box {
        margin-top: 24px;
    }
}

.contact .contact-box .contact-block {
    width: 46%;
}
@media only screen and (max-width: 768px) {
    .contact .contact-box .contact-block {
        width: 100%;
        margin-bottom: 64px;
    }
    .contact .contact-box .contact-block:last-of-type {
        margin-bottom: 0;
    }
}
@media only screen and (max-width: 480px) {
    .contact .contact-box .contact-block {
        margin-bottom: 28px;
    }
}

.contact .contact-img {
    position: relative;
}

.contact .contact-img .btn-text {
    position: absolute;
    max-width: 80%;
    width: 100%;
    text-align: center;
    top: 46%;
    left: 50%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
}

.contact .contact-img .btn-text p {
    font-size: 24px;
}
@media only screen and (max-width: 1024px) {
    .contact .contact-img .btn-text p {
        font-size: 16px;
    }
}
@media only screen and (max-width: 768px) {
    .contact .contact-img .btn-text p {
        font-size: 32px;
    }
}
@media only screen and (max-width: 640px) {
    .contact .contact-img .btn-text p {
        font-size: 24px;
    }
}
@media only screen and (max-width: 480px) {
    .contact .contact-img .btn-text p {
        font-size: 16px;
    }
}

/**
* footer
**/

@media only screen and (max-width: 768px) {
    footer .inner {
        padding-bottom: 120px;
    }
}
@media only screen and (max-width: 480px) {
    footer .inner {
        padding-bottom: 64px;
    }
}

footer .footer-box .menu-table {
    max-width: 750px;
    width: 100%;
    margin: 0 auto;
}
@media only screen and (max-width: 768px) {
    footer .footer-box .menu-table {
        max-width: 477px;
    }
}
@media only screen and (max-width: 480px) {
    footer .footer-box .menu-table {
        max-width: 100%;
    }
}

footer .footer-box .menu-table td {
    padding: 8px 10px;
}
@media only screen and (max-width: 768px) {
    footer .footer-box .menu-table td {
        padding: 12px 10px;
    }
}
@media only screen and (max-width: 480px) {
    footer .footer-box .menu-table td {
        padding: 2px;
    }
}

footer .footer-box .menu-block a {
    font-size: 16px;
    color: #000;
}
@media only screen and (max-width: 480px) {
    footer .footer-box .menu-block a {
        font-size: 12px;
    }
}

footer .footer-box .menu-block .copywrite {
    margin-top: 12px;
}
@media only screen and (max-width: 768px) {
    footer .footer-box .menu-block .copywrite {
        margin-top: 24px;
    }
}

footer .footer-box .menu-block .copywrite p {
    font-size: 16px;
}

footer .footer-box .logo-block {
    margin-top: 32px;
}
@media only screen and (max-width: 768px) {
    footer .footer-box .logo-block {
        margin-top: 28px;
    }
}
@media only screen and (max-width: 480px) {
    footer .footer-box .logo-block {
        margin-top: 24px;
    }
}

footer .footer-box .logo-block .footer-logo-img {
    max-width: 278px;
    width: 100%;
    margin: 0 auto;
}
@media only screen and (max-width: 768px) {
    footer .footer-box .logo-block .footer-logo-img {
        max-width: 260px;
    }
}
@media only screen and (max-width: 480px) {
    footer .footer-box .logo-block .footer-logo-img {
        max-width: 180px;
    }
}

footer .footer-box .logo-block .copywrite {
    margin-top: 24px;
}

footer .footer-box .logo-block .copywrite {
    font-size: 14px;
    line-height: 1.8;
}
@media only screen and (max-width: 480px) {
    footer .footer-box .logo-block .copywrite {
        font-size: 12px;
    }
}

/**
* cv-btn　納品時ボタン

.cv-btn {
    position: fixed;
    right: 0;
    top: 35%;
}

.cv-btn .cv-btn-img {
    max-width: 40px;
    width: 100%;
}

.cv-btn .cv-btn-2-img {
    margin-top: 12px;
}
**/

/**
* cv-btn-sp
**/
.cv-btn-sp {
    position: fixed;
    left: 0;
    bottom: 0;
}

.cv-btn-sp .inner {
    padding: 0;
}

.cv-btn-sp .cv-btn-box {
    align-items: center;
}

/**
* arrow-btn
**/
.btn-arrow-img-pc{
    position:fixed;
    bottom:20px;
    right:20px;
    width:52px;
}
