@charset "utf-8";
@import url('https://fonts.googleapis.com/css2?family=Lato:wght@400;700&family=Noto+Sans+JP:wght@400;500;700;900&display=swap');



/* styles
-------------------------------------------------------------- */
body,
button,
input,
select {
	padding: 0;
	margin: 0;
	background: #F4F7F8;
	font-family: 'Lato', 'Noto Sans JP', "Yu Gothic", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", YuGothic, "游ゴシック", Meiryo, "メイリオ", sans-serif;
    color: #36434A;
}

ul,li,dl,dt,dd{
    margin: 0 auto;
    padding:0;
    list-style: none;
}
img{
    vertical-align: bottom;
    display: inline-block;
    -webkit-backface-visibility: hidden;

}

.container{
    width: 100%;
    max-width: 992px;
    margin: 0 auto;
}

.clearfix:after {
    content: "";
    clear: both;
    display: table;
}

/* pc */
@media only screen and (min-width: 768px) {
    body{
        font-size: 16px;
    }
    .sp{
        display: none;
    }
}

/* sp */
@media only screen and (max-width: 767px) {
    body{
        -webkit-text-size-adjust: 100%;
        font-size: 10px;
        background: #fff;
    }
}

/* typography
-------------------------------------------------------------- */

/* Headings */
h1 {
	font-size: 32px;
	font-weight: 100;
	letter-spacing: 0.1em;
    color: #040000;
}
h2 {
    position: relative;
    width: 100%;
    max-width: 992px;
    height: 135px;
    background: url(/-/media/OSCOM2/img/lp/startup/bg-h2) no-repeat center center;
    background-size: cover;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    margin: 0 auto 65px;
    font-size: 32px;
    font-weight: 500;
    line-height: 1.25;
    text-align: center;
    color: #fff;
}
h2 small {
	font-size: 24px;
}
h2:after{
    position: absolute;
    bottom: -11px;
    display:block;
    content: '';
    width: 24px;
    height: 24px;
    background-color: #04A9DD;
    transform: rotate(45deg);
}
h3 {
	font-size: 32px;
}
h3.border-title,
.role-prg_title{
    position: relative;
    margin-bottom: 42px;
    text-align: center;
    line-height: 1;
}
h3.border-title span,
.role-prg_title span{
    border-bottom: 1px solid #05356A;
    color: #05356A;
    font-size: 24px;
    font-weight: 500;
    padding-bottom: 9px;
}
h3.border-title:after,
.role-prg_title:after{
    position: absolute;
    left: calc(50% - 5px);
    bottom: -20px;
    content: '';
    display: block;
    width: 10px;
    height: 9px;
    border-top: 10px solid #05356A;
    border-left: 5px solid transparent;
    border-right: 5px solid transparent;
}
h3.border-title.border-title_light span{
    border-bottom: 1px solid #0077CE;
    color: #0077CE;
}
h3.border-title.border-title_light:after{
    border-top: 10px solid #0077CE;
}

h4 {
	font-size: 18px;
}

a{
    color: #221815;
    opacity: 1;
    transition: all .2s linear;
}
a:hover{
    opacity: .7;
}
small {
    font-size: 90%;
}

.en{
    font-family: 'Lato', sans-serif;
    font-weight: 300;
}
.jp{
    font-family: 'Noto Sans JP', sans-serif;
}
.fm{
    font-weight: 500;
}
.fb{
    font-weight: 900;
}
.text-center{
    text-align: center !important;
}
.text-left{
    text-align: left !important;
}

/* sp */
@media only screen and (max-width: 767px) {
    h2{
        font-size: 18px;
        height: auto;
        background-size: cover;
        margin-bottom: 21px;
        padding: 8px 0;
    }
    h2 small {
        font-size: 10px;
    }
    h2:after{
        bottom: -5px;
        width: 9px;
        height: 9px;
    }
    h3 {
        font-size: 18px;
    }
    h3.border-title,
    .role-prg_title{
        margin-bottom: 21px;
    }
    h3.border-title span,
    .role-prg_title span{
        font-size: 14px;
        padding-bottom: 5px;
    }
    h3.border-title:after,
    .role-prg_title:after{
        bottom: -16px;
    }
}




/* header
-------------------------------------------------------------- */
.logo{
    background: #002854;
}
.logo .container {
    max-width: 1100px;
}
.logo a {
    display: block;
    width: 210px;
    padding: 5px 0;
    background-color: #fff;
}
.logo img{
    display: block;
    width: 63px;
    height: auto;
    margin: 0 auto;
}

.header-kv {
    background: #F4F7F8 url(/-/media/OSCOM2/img/lp/startup/img-kv)no-repeat center bottom;
    background-size: cover;
    text-align: center;
    margin: auto;
}
.header-kv_title{
    margin: 0 auto;
    max-width: 960px;
    padding: 143px 0 152px;
}

.header-kv_banner{
    margin: -105px auto 86px;
}
.header-kv_bannerInner{
    width: 100%;
    max-width: 1100px;
    margin: 0 auto;
}
.header-kv_bannerList{
    color: #05356A;
    display: flex;
    justify-content: space-between;
    font-weight: 900;
    font-size: 28px;
    text-align: center;
}
.header-kv_bannerItem{
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 50%;
}
.header-kv_bannerItem img{
    position: absolute;
}
.header-kv_bannerItem span{
    z-index: 2;
}
.header-kv_bannerItem:nth-child(2) span{
    margin-left: -1em;
}


/* pc */
@media only screen and (min-width: 768px) {
    .header-kv{
        max-height: 711px;
    }

}

/* sp */
@media only screen and (max-width: 767px) {
    .logo a{
        width: 120px;
    }
    .logo img {
        width: 30px;
    }
    
    .header-kv{
        position: relative;
        padding: 9vw 0;
    }
    .header-kv_title{
        position: relative;
        width: 65.6%;
        margin: 0 auto 4.4vw;
        padding: 0;
        top: 5%;
    }
    
    .header-kv_banner {
        margin: -40px 10px 30px;
    }
    .header-kv_bannerList{
        position: relative;
        font-size: 10px;
        margin: 0 10px;
    }
    .header-kv_banner1{
        width: 90%;
    }
}


/* footer
-------------------------------------------------------------- */
footer {
    background: #002854 url(/-/media/OSCOM2/img/lp/common/bg-headerFooter) no-repeat center top;
    background-size: 100% auto;
    padding: 45px 0 0;
}
.footer-title{
    text-align: center;
    color: #fff;
    font-size: 32px;
    font-weight: 500;
    margin-bottom: 67px;
}
.footer-contact_item{
    margin: 0 24px;
    width: calc(50% - 48px);
}
.footer-contact_item a{
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    text-align: center;
}
.footer-contact_item a:before{
    margin-right: 16px;
}

.footer-company{
    display: flex;
    justify-content: center;
    align-items: center;
}
ul.footer-contact_list{
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    margin-bottom: 112px;
}
.footer-company_item {
    margin: 0 40px;
    color: #fff;
    font-size: 14px;
}
.footer-company_item a {
    display: block;
    width: 68px;
}

footer p.copyright{
	text-align: center;
	font-size: 12px;
    padding: 48px 0 8px;
    color: #fff;
}

/* SP */
@media only screen and (max-width: 767px) {
    footer{
        padding: 24px 0 0;
        background-image: none;
    }
    .footer-title{
        font-size: 18px;
        margin-bottom: 16px;
    }
    ul.footer-contact_list{
        margin-bottom: 24px;
    }
    .footer-contact_item{
        margin: 0 8px;
        width: auto;
    }
    .footer-contact_item a svg{
        margin-right: 8px;
    }
    
    .footer-company{
        margin:0 8px; 
    }
    .footer-company_item {
        margin: 0 8px 24px;
        font-size: 9px;
    }
    .footer-company_item:first-child img {
        width: 105px;
    }
    .footer-company_item a {
        width: 30px;
    }
    footer p.copyright{
        padding: 32px 0 6px;
        font-size: 9px;
    }
}



/* Posts/Articles
-------------------------------------------------------------- */
main section,
section.container{
	margin:64px auto;
}
    main section.bg-dot {
        background: url(/-/media/OSCOM2/img/lp/startup/bg-dot) repeat;
        padding: 64px 0;
        margin: 0;
    }

main section p{
	margin-bottom: 2em;
    line-height: 1.5;
}
main section p.shoulder{
    line-height: 1.75;
    text-align: center;
}

ul.whitedot_list li {
    background: url(/-/media/OSCOM2/img/lp/startup/icon-circle) no-repeat left .4em;
    padding-left: 20px;
}
ul.bluedot_list li {
    background: url(/-/media/OSCOM2/img/lp/startup/icon-circle-blue) no-repeat left .4em;
    padding-left: 20px;
}

.btn{
    background: linear-gradient(90deg, #f4e4a4 0%, #ffeb01 51.23%, #ffe100 77.34%, #ffbb02 100%);
    border: 1px solid #fff502;
    border-radius: 4px;
    box-shadow:0px 4px 0px rgba(0, 0, 0, 0.16);
    padding: 16px;
    color: #002854;
    text-decoration: none;
    font-size: 24px;
    font-weight: 500;
    transition: all .2s linear;
}
a.btn svg{
    width: 24px;
    height: 24px;
    margin-right: 16px;
    fill: currentColor;
}
a.btn:hover{
    color: #fff;
    opacity: 1;
    background: #002854;
    border: 1px solid #fff;
}

nav ul{
    display: flex;
    justify-content: center;
}
nav ul li{
    margin: 0;
}
nav a.btn{
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(180deg, #f4e4a4 0%, #ffeb01 51.23%, #ffe100 77.34%, #ffbb02 100%);
    padding: 24px 17px 24px 18px;
    margin-bottom: 8px;
    text-decoration: none;
    color: #002854;
    font-size: 16px;
    word-break: keep-all;
}
nav a.btn svg{
    margin: 0 0 8px;
}

/* table */
table{
    border-collapse: collapse;
    border-spacing: 0;
}
th,td{
    border: 2px solid #D6DBDE;
    padding: 16px;
    text-align: center;
}
th{
    background: #D6DBDE;
    font-weight: 500;
}
th:first-child,
td:first-child{
    border-left: none;
}
tr:first-child th{
    border-bottom: 2px solid #eaeced;
    border-right: 2px solid #eaeced;
}
tr th:last-child,
tr td:last-child{
    border-right: none;
}
tr:last-child > *{
    border-bottom: none;
}
td{
    background: #FFFFFF;
}


/* bg */
.bg-white{
    background: #fff;
}
.bg-blue{
    background: #002854;
}
.bg-gray{
    background: #EAECED;
}
.bg-darkgray{
    background: #87969F;
    color: #fff;
}
.bg-rising20{
    background: #0845BA;
}
.bg-rising20_dark{
    background: #0239A3;
    color: #fff;
}
.bg-entry5{
    background: #00ADCF;
}
.bg-entry5_dark{
    background: #02A0BF;
    color: #fff;
}

/* bg gradient */
.gd-blue{
    background: linear-gradient(0deg, #043B77 0%,#002854 50%,#002854 100%);
}


/* pc */
@media only screen and (min-width: 768px) {
    nav{
        display: none;
        position: fixed;
        top: 50%;
        right: 0;
        -ms-writing-mode: tb-rl;
        writing-mode: vertical-rl;
        z-index: 99;
        transform: translateY(-50%);
    }
    nav a.btn{
        letter-spacing: 3px;
        border-radius: 4px 0 0 4px;
    }
}

/* sp */
@media only screen and (max-width: 767px) {
    main section,
    section.container{
        margin:0 auto 24px;
    }
    main section.bg-dot{
        padding: 0 0 32px 0;
    }
    main section p.shoulder{
        margin: 0 16px 2em;
    }

    ul.whitedot_list li,
    ul.bluedot_list li{
        background-size: 4px auto;
        padding-left: 8px;
    }
    th,td{
        padding: 8px;
    }
    
    .btn{
        box-shadow:0px 2px 0px rgba(0, 0, 0, 0.16);
        padding: 12px;
        font-size: 14px;
    }
    a.btn svg{
        width: 16px;
        height: 16px;
        margin-right: 12px;
    }
    nav{
        position: fixed;
        bottom: 0;
        right: 0;
        z-index: 99;
        background: rgba(0, 0, 0, 0.3);
        width: 100%;
        padding: 12px;
    }
    nav a.btn{
        background: linear-gradient(90deg, #f4e4a4 0%, #ffeb01 51.23%, #ffe100 77.34%, #ffbb02 100%);
        padding: 8px 18px;
        margin: 0 4px;
        font-size: 11px;
        border-radius: 4px;
    }
    a.btn svg,
    nav a.btn svg{
        width: 12px;
        height: 12px;
        margin: 0 8px 0 0;
    }
    
}


/* home
-------------------------------------------------------------- */

/* client */
.client-prg {
    position: relative;
    margin-bottom: 60px;
    background: url(/-/media/OSCOM2/img/lp/startup/bg-client-prg01) no-repeat right bottom;
}
.client-prg02 {
    position: relative;
    margin-bottom: 50px;
    background: url(/-/media/OSCOM2/img/lp/startup/bg-client-prg02) no-repeat right bottom;
}
.client-prg03{
    text-align: center;
}

.client-prg_title{
    font-weight: 600;
}
.client-prg03 .client-prg_title{
    margin: 32px auto;
}
.client-prg_text{
    margin-bottom: 32px;
}
.client-prg03_img{
    max-width: 29.6%;
    margin: 27px auto -203px;
}

/* pc */
@media only screen and (min-width: 768px) {
    .client-prg{
        min-height: 338px;
    }
    .client-prg_text{
        position: absolute;
        left: 70px;
        top: 120px;
    }
}

/* sp */
@media only screen and (max-width: 767px) {
    .client-prg{
        position: relative;
        margin: 0 16px 32px;
        background-size: 36vw auto;
    }
    .client-prg img{
        width: 19.46vw;
    }
    .client-prg_text{
        position: relative;
        margin: -20px 6.6vw 0;
        max-width: auto;
    }
    .client-prg_title{
        max-width: calc(100% - 20vw);
        margin-bottom: 10px;
    }
    .client-prg_text p{
        max-width: calc(100% - 25vw);
        margin-bottom: 0;
    }
    .client-prg03 .client-prg_title {
        margin: 16px auto;
    }
    .client-prg03_img {
        margin: 14px auto 0;
    }
}


/* example */
section.example{
    background: #fff;
    padding-top: 169px;
}
.example-title{
    text-align: center;
    font-size: 24px;
    font-weight: 500;
    margin-bottom: 40px;
}
.example-container{
    border-top: 1px solid #D6DBDE;
    border-bottom: 1px solid #D6DBDE;
}
.example-list{
    display: table;
    width: 100%;
    min-height: 83px;
    overflow: hidden;
}
.example-list_title{
    display: table-cell;
    width: 27%;
    min-height: 83px;
    vertical-align: middle;
    background: #002854;
    color: #fff;
    font-weight: 500;
    text-align: center;
}
.example-list:nth-child(2n) .example-list_title{
    background: #00386F;
}
.example-list dd{
    position: relative;
    display: table-cell;
    padding: 24px 32px 18px;
    vertical-align: middle;
    background: #EAECED;
}
.example-list:nth-child(2n) dd{
    background: #FFFFFF;
}
.example-list dd:before{
    position: absolute;
    left: -4px;
    top: calc(50% - 5px);
    display: block;
    content: '';
    width: 8px;
    height: 8px;
    background: #EAECED;
    transform: rotate(45deg);
}
.example-list:nth-child(2n) dd:before{
    background: #fff;
}

.example-text{
    text-align: center;
    padding: 40px 0 80px;
}


/* sp */
@media only screen and (max-width: 767px) {
    section.example {
        padding-top: 0;
    }
    .example-container{
        margin: 0 16px;
        width: calc(100% - 32px);
    }
    .example-title{
        font-size: 16px;
        margin-bottom: 20px;
    }
    .example-list{
        min-height: 1px;
    }
    .example-list dd{
        padding: 16px 16px 12px;
    }
    .example-list dd:before{
        left: -2px;
        top: calc(50% - 3px);
        width: 5px;
        height: 5px;
    }
    .example-list li{
        background-size: 6px auto;
        padding-left: 12px;
        margin-bottom: 5px;
    }
    
    .example-text{
        padding: 20px 0 0;
    }
}


/* role */
.role-shoulder{
    margin-bottom: 56px;
}

.role-prg{
    margin-bottom: 50px;
}
.role-prg02 .role-prg_title span{
    border-bottom: 1px solid #0077CE;
    color: #0077CE;
}
.role-prg02 .role-prg_title:after{
    border-top: 10px solid #0077CE;
}

.role-prg_list{
    display: flex;
    justify-content: space-between;
    margin-top: 43px;
}
.role-prg_item {
    width: calc(calc(100% - 2px) / 3);
    background: #00386F url(/-/media/OSCOM2/img/lp/startup/bg-role-prg01) no-repeat center top;
    background-size: 100% auto;
    color: #fff;
    padding-top: 126px;
}
    .role-prg_item:nth-child(2) {
        background: #002854 url(/-/media/OSCOM2/img/lp/startup/bg-role-prg02) no-repeat center top;
        background-size: 100% auto;
    }
    .role-prg_item:nth-child(3) {
        background: #00386F url(/-/media/OSCOM2/img/lp/startup/bg-role-prg03) no-repeat center top;
        background-size: 100% auto;
    }

.role-prg02 .role-prg_item {
    width: calc(calc(100% - 3px) / 4);
    background: #0077CE url(/-/media/OSCOM2/img/lp/startup/bg-role-prg04) no-repeat center top;
    background-size: 100% auto;
    color: #fff;
    padding-top: 106px;
}
    .role-prg02 .role-prg_item:nth-child(2) {
        background: #069BB9 url(/-/media/OSCOM2/img/lp/startup/bg-role-prg05) no-repeat center top;
        background-size: 100% auto;
    }
    .role-prg02 .role-prg_item:nth-child(3) {
        background: #0077CE url(/-/media/OSCOM2/img/lp/startup/bg-role-prg06) no-repeat center top;
        background-size: 100% auto;
    }
    .role-prg02 .role-prg_item:nth-child(4) {
        background: #069BB9 url(/-/media/OSCOM2/img/lp/startup/bg-role-prg07) no-repeat center top;
        background-size: 100% auto;
    }

.role-prg_item dt{
    text-align: center;
    font-size: 20px;
    font-weight: 700;
    margin-bottom: 16px;
}
.role-prg_list li {
    background: url(/-/media/OSCOM2/img/lp/startup/icon-circle) no-repeat left .4em;
    padding-left: 20px;
    margin: 0 22px 8px;
}
.role-prg_item p{
    text-align: right;
    padding: 0 22px;
    margin-bottom: 16px;
}


/* sp */
@media only screen and (max-width: 767px) {
    .role-shoulder{
        margin-bottom: 27px;
    }

    .role-prg{
        margin: 0 16px 25px;
    }
    .role-prg_list{
        margin-top: 22px;
    }
    .role-prg02 .role-prg_list{
        flex-wrap: wrap;
    }
    .role-prg_item{
        padding-top: 10.6vw;
    }
    .role-prg02 .role-prg_item{
        width: calc(calc(100% - 1px) / 2);
        padding-top: 20.6vw;
    }
    .role-prg_item dt{
        font-size: 10px;
        margin-bottom: 8px;
    }
    .role-prg_list li{
        background-size: 3px auto;
        background-position: left .6em;
        margin: 0 10px 4px;
        font-size: 8px;
        padding-left: 8px;
    }
    .role-prg_item p{
        padding: 0 10px;
        margin-bottom: 2px;
    }

}


/* about */

.about-container{
    display: flex;
    justify-content: space-between;
}
.about-prg{
    width: calc(50% - 20px);
    background: #fff;
    border: 1px solid #D1D5D8;
    box-shadow: 0 4px 0 rgba(0,0,0,.1);
}
.about-prg_title{
    position: relative;
    background: #00ADCF;
    text-align: center;
    color: #fff;
}
.about-prg2 .about-prg_title{
    background: #0845BA;
}
.about-prg_title img{
    max-height: 36px;
    width: auto;
    margin: 32px auto 24px;
}
.about-prg_title span{
    position: relative;
    display: flex;
    width: 100%;
    height: 92px;
    align-items: center;
    justify-content: center;
    background: #02A0BF;
    font-size: 20px;
    font-weight: 500;
    padding: 16px 20px;
    z-index: 2;
}
.about-prg2 .about-prg_title span{
    background: #0239A3;
}
.about-prg_title:after{
    position: absolute;
    left: calc(50% - 7px);
    bottom: -7px;
    display:block;
    content: '';
    width: 14px;
    height: 14px;
    background-color: #02A0BF;
    transform: rotate(45deg);
    z-index: 1;
}
.about-prg2 .about-prg_title:after{
    background: #0239A3;
}
.about-prg_shoulder{
    padding: 27px 0 0;
}
.about-prg_text {
    background: url(/-/media/OSCOM2/img/lp/startup/icon-about-human01) no-repeat bottom left 7px;
    background-size: auto 126px;
    min-height: 141px;
    padding-left: 120px;
    margin: 0 4.3% 0 5%;
}
.about-prg2 .about-prg_text {
    background: url(/-/media/OSCOM2/img/lp/startup/icon-about-human02) no-repeat bottom left 7px;
    background-size: auto 121px;
}
.about-prg_text p{
    position: relative;
    z-index: 1;
    background: #EAECED;
    min-height: 141px;
    padding: 20px 24px 0;
    margin-bottom: 18px;
    font-size: 15px;
}
.about-prg_text p:before{
    position: absolute;
    left: -8px;
    top: calc(50% - 8px);
    content: '';
    display: block;
    width: 17px;
    height: 17px;
    transform: rotate(45deg);
    background: #EAECED;
}
.about-prg_price dl{
    display: flex;
    align-items: baseline;
    text-align: left;
    margin: 0 32px;
}
.about-prg_price dt{
    width: 105px;
}
.about-prg_priceFix{
    font-size: 18px;
}
.about-prg_price dt,
.about-prg_price small{
    font-weight: 500;
}
.about-prg_priceFix big{
    font-size: 50px;
    font-weight: 700;
    color: #C93E54;
    line-height: 60px;
}
.about-prg_priceTicket big{
    font-size: 48px;
    font-weight: 700;
    line-height: 56px;
}
.about-prg_price dd{
    width: calc(100% - 105px);
}
.about-prg_price dd p{
    margin: 0 48px 0 0;
    text-align: right;
    font-size: 14px;
}
ul.about-prg_attention{
    margin: 32px;
    font-size: 12px;
}
.about-prg_attention li{
    position: relative;
    padding-left: 1.5em;
}
.about-prg_attention li:before{
    position: absolute;
    top: 0;
    left: 0;
    display: block;
    content: '※';
}

/* sp */
@media only screen and (max-width: 767px) {
    .about-container{
        padding: 0 16px;
        flex-wrap: wrap;
    }
    .about-prg{
        width: 100%;
        margin-bottom: 12px;
    }
    
    .about-prg_title img{
        max-height: 18px;
        width: auto;
        margin: 16px auto 12px;
    }
    .about-prg_title span {
        font-size: 12px;
        padding: 0 4%;
        height: 6em;
    }
    .about-prg_shoulder{
        padding: 14px 0 0;
    }
    .about-prg_text {
        background: url(/-/media/OSCOM2/img/lp/startup/icon-about-human01) no-repeat bottom left 7px;
        background-size: auto 63px;
        min-height: 70px;
        padding-left: 65px;
        margin: 0 4.3% 0 5%;
    }
    .about-prg2 .about-prg_text{
        background-size: auto 63px;
    }
    .about-prg_text p{
        min-height: 70px;
        padding: 10px 12px 0;
        margin-bottom: 9px;
        font-size: 8px;
    }
    .about-prg_text p:before{
        left: -5px;
        top: calc(50% - 5px);
        width: 10px;
        height: 10px;
    }
    .about-prg_price dl{
        margin: 0 16px;
    }
    .about-prg_price dt{
        width: 80px;
        font-size: 10px;
    }
    .about-prg_priceFix{
        font-size: 10px;
    }
    .about-prg_priceFix big{
        font-size: 25px;
        line-height: 30px;
    }
    .about-prg_priceTicket big{
        font-size: 24px;
        line-height: 27px;
    }
    .about-prg_price dd{
        width: calc(100% - 80px);
    }
    .about-prg_price dd p{
        margin: 4px 24px 4px 0;
        font-size: 8px;
        text-align: left;
    }
    ul.about-prg_attention{
        margin: 16px;
        font-size: 8px;
    }
    .about-prg_attention li{
        position: relative;
        padding-left: 1.5em;
    }
    .about-prg_attention li:before{
        position: absolute;
        top: 0;
        left: 0;
        display: block;
        content: '※';
    }
}


/* helpdesk */
.helpdesk{
    background: #fff;
    margin: 0;
    padding: 64px 0;
}
.helpdesk-shoulder{
    margin: 0 30px 50px;
}

/* sp */
@media only screen and (max-width: 767px) {
    .helpdesk{
        padding: 0 0 32px 0;
    }
    .helpdesk-shoulder{
        margin: 0 16px 25px;
    }
    .helpdesk-modal{
        display: block;
        position: relative;
    }
    .helpdesk-modal img{
        z-index: 1;
    }
        .helpdesk-modal:after {
            position: absolute;
            top: 0;
            display: block;
            content: '';
            width: 100%;
            height: 100%;
            background: rgba(0,0,0,.5) url(/-/media/OSCOM2/img/lp/startup/zoom-in) no-repeat center center;
            background-size: 78px auto;
            z-index: 2;
        }
}

/* plan */
.plan-example1 {
    background: url(/-/media/OSCOM2/img/lp/startup/bg-helpdesk01) no-repeat center center;
    background-size: cover;
    border: 1px solid #05356A;
    padding: 32px 68px 20px;
    margin-bottom: 24px;
}
ul.plan-example_list{
    display: flex;
    justify-content: flex-start;
    font-size: 18px;
    font-weight: 500;
    color: #002854;
    margin: 0;
}
ul.plan-example1_list{
    justify-content: space-between;
    flex-wrap: wrap;
    width: 100%;
    margin: 39px auto 0;
}
ul.plan-example1_list:after{
    content: '';
    width: 75%;
}
ul.plan-example_list li {
    background: url(/-/media/OSCOM2/img/lp/startup/icon-circle-blue) no-repeat left .4em;
    padding-left: 20px;
    margin: 0 2em 0 0;
}
ul.plan-example1_list li{
    width: 25%;
    margin: 0 0 30px;
}

.plan-example2 {
    background: url(/-/media/OSCOM2/img/lp/startup/bg-helpdesk02) no-repeat center center;
    background-size: cover;
    border: 1px solid #05356A;
    padding: 32px 68px 20px;
    margin-bottom: 24px;
}
.plan-list{
    display: table;
    width: 100%;
    min-height: 83px;
    border-radius: 10px;
    overflow: hidden;
    margin-bottom: 8px;
}
.plan-list_title {
    display: table-cell;
    width: 23%;
    min-height: 83px;
    vertical-align: middle;
    background: #002854 url(/-/media/OSCOM2/img/lp/startup/bg-gd-blue) no-repeat left top;
    background-size: cover;
    color: #fff;
    font-weight: 500;
    text-align: center;
}
.plan-list dd{
    display: table-cell;
    padding: 0 24px;
    vertical-align: middle;
    width: 77%;
    border: 1px solid #002854;
    border-radius: 0 10px 10px 0;
}

/* sp */
@media only screen and (max-width: 767px) {
    .plan-example1{
        padding: 16px 16px 10px;
        margin: 0 16px 12px;
    }
    ul.plan-example_list{
        font-size: 10px;
        flex-wrap: wrap;
    }
    ul.plan-example1_list{
        margin: 20px auto 0;
    }
    ul.plan-example1_list:after{
        content: '';
        width: calc(200% / 3);
    }
    ul.plan-example_list li{
        background-size: 4px auto;
        padding: 0 10px 0 8px;
        margin: 0;
    }
    ul.plan-example1_list li{
        width: calc(100% / 3);
        margin: 0 0 15px;
    }

    .plan-example2{
        padding: 16px 16px 10px;
        margin: 0 16px;
    }
    .plan-list{
        min-height: 63px;
        margin-bottom: 4px;
    }
    .plan-list_title{
        min-height: 63px;
    }
    .plan-list dd{
        padding: 0 12px;
    }
}


/* ticket */
.ticket-table tr th:first-child{
    width: 22%;
}
.ticket-table tr th:last-child{
    width: 28%;
}
.ticket-table tr th img{
    height:26px;
    width: auto;
}
.ticket-price{
    font-size: 21px;
    font-weight: 700;
    padding-right: 4px;
}
.ticket-attention{
    padding: 24px;
    margin-top: 24px;
}
.ticket-contact{
    font-size: 24px;
    font-weight: 700;
    margin: 43px auto 0;
}
.ticket-contact a{
    color: #2E40A2;
    text-decoration: underline;
}

/* sp */
@media only screen and (max-width: 767px) {
    .ticket-table tr th img{
        height:14px;
    }
    .ticket-price{
        font-size: 14px;
        padding-right: 2px;
    }
    .ticket-attention{
        padding: 12px;
        margin-top: 12px;
    }
    .ticket-contact{
        font-size: 16px;
        margin: 22px auto 0;
    }
}


/* structure */
.structure{
    padding: 64px 0;
    margin: 0;
}
.structure-table{
    border-bottom: 2px solid #D6DBDE;
    width: 100%;
}
.structure-table:not(:last-child){
    margin-bottom: 60px;
}
.structure-table tr:first-child th{
    border-top: none;
}
tr th:first-child {
    border-bottom: 2px solid #eaeced;
    border-right: 2px solid #eaeced;
}
.structure-table th img{
    height: 32px;
}
.structure-table td{
    white-space: nowrap;
    padding-left: 8px;
    padding-right: 8px;
}
.structure-num{
    font-size: 18px;
    font-weight: 700;
}
.structure-num2,
.structure-table small{
    font-size: 12px;
}
.structure-num2 span{
    font-size: 14px;
}

/* sp */
@media only screen and (max-width: 767px) {
    .structure{
        padding: 0 0 64px 0;
    }
    .structure-table:not(:last-child){
        margin-bottom: 30px;
    }
    .structure-table th img{
        height: 16px;
    }
    .structure-table td{
        white-space:normal;
        padding-left: 4px;
        padding-right: 4px;
    }
    .structure-num{
        font-size: 12px;
    }
    .structure-num2,
    .structure-table small{
        font-size: 8px;
    }
    .structure-num2 span{
        font-size: 9px;
    }
}



/* case */
.case-list{
    margin: 0 32px 24px;
    border-radius: 8px;
    padding: 24px;
}

.case-prg{
    background: #fff;
    border: 1px solid #D1D5D8;
    box-shadow: 0 4px 0 rgba(0,0,0,.1);
    margin-bottom: 64px;
}
.case-prg_title{
    position: relative;
    text-align: left;
    padding: 34px 30px 9px 137px;
    margin-bottom: 16px;
    font-size: 24px;
    font-weight: 500;
}
    .case-prg_title:before {
        position: absolute;
        left: 32px;
        bottom: 0;
        display: block;
        width: 74px;
        height: 76px;
        content: '';
        background: url(/-/media/OSCOM2/img/lp/startup/img-solution-build)no-repeat left bottom;
        background-size: contain;
        margin-right: 30px;
        overflow: visible;
    }

.case-table{
    width: 100%;
}
.case-prg2 .case-table{
    margin-bottom: 24px;
}
.case-prg2 .case-table tr:nth-child(2) th{
    border-right: none;
}
.case-table tr td{
    font-weight: 500;
}
.case-table tr:nth-child(2n) td{
    background: #F5F7F8;
}
.case-prg1 .case-table tr:last-child th{
    border-bottom: none;
}
.case-prg2 .case-table tr:last-child th,
.case-prg2 .case-table tr:last-child td{
    border-bottom: 2px solid #D6DBDE;
}
.case-table th img{
    height: 32px;
}
.case-table tr td small{
    font-weight: 400;
    font-size: 12px;
}


/* sp */
@media only screen and (max-width: 767px) {
    .case{
        padding: 0 0 24px;
        margin-bottom: 0;
    }
    .case-list{
        margin: 0 16px 12px;
        padding: 12px;
    }
    .case-prg{
        box-shadow: 0 2px 0 rgba(0,0,0,.1);
        padding: 0;
        margin: 0 16px 16px;
        width: calc(100% - 32px);
    }
    .case-prg_title{
        padding: 14px 15px 12px 90px;
        margin-bottom: 10px;
        font-size: 12px;
    }
    .case-prg_title:before{
        left: 24px;
        width: 50px;
        height: 50px;
        margin-right: 20px;
    }
    .case-prg2 .case-table{
        margin-bottom: 12px;
    }
    .case-table th img{
        height: 16px;
    }
    .case-table tr td small{
        font-size: 8px;
    }
}




/* expansion */
.expansion .bg-white{
    position: relative;
    margin: 0;
    padding: 166px 0 156px;
}
.expansion-topicon{
    position: absolute;
    left: calc(50% - 120px);
    top: -30px;
    width: 240px;
}
.expansion-title{
    height: auto;
    background: none;
    padding: 0;
    margin-bottom: 24px;
    color: #002854;
    font-size: 32px;
    font-weight: 700;
}
.expansion-title:after{
    content: none;
}

.expansion-prg{
    position: relative;
    display: flex;
    justify-content: center;
    margin-top: -124px;
}
.expansion-item{
    max-width:261px; 
    background: #fff;
    border: 1px solid #D1D5D8;
    box-shadow: 0 4px 0 rgba(0,0,0,.1);
    padding: 0 0 26px;
    margin:0 12px 24px;
}
.expansion-prg_title{
    position: relative;
    background: #00ADCF;
    font-size: 14px;
    font-weight: 500;
    color: #fff;
    text-align: center;
    margin-bottom: 24px;
    padding: 12px 24px;
}
.expansion-item2 .expansion-prg_title{
    background: #00386F;
}
.expansion-prg_title span{
    display: block;
    font-size: 24px;
    font-weight: 700;
}
.expansion-prg_title:after{
    position: absolute;
    left: calc(50% - 10px);
    bottom: -8px;
    display: block;
    content: '';
    width: 20px;
    height: 20px;
    background: #00ADCF;
    transform: rotate(45deg);
}
.expansion-item2 .expansion-prg_title:after{
    background: #00386F;
}

.expansion-prg p:not(.expansion-price){
    color: #697C86;
    font-size: 14px;
    margin-bottom: 0;
    padding: 0 24px;
}
.expansion-price{
    font-size: 24px;
    font-weight: 500;
    padding: 0 24px 12px;
    margin-bottom: 0;
    line-height: 1;
}
.expansion-price span{
    color: #C93E54;
    font-size: 50px;
    font-weight: 700;
    padding: 0 10px;
}


/* pc */
@media only screen and (min-width: 768px) {
}

/* sp */
@media only screen and (max-width: 767px) {
    .expansion .bg-white{
        padding: 83px 0 0;
    }
    .expansion-topicon{
        left: calc(50% - 60px);
        top: -15px;
        width: 120px;
    }
    .expansion-title{
        margin-bottom: 12px;
        font-size: 18px;
    }
    
    .expansion-prg{
        margin-top: 0;
    }
    .expansion-item{
        max-width:calc(50% - 5px); 
        padding: 0 0 13px;
        margin:0 6px 12px;
    }
    .expansion-prg_title{
        font-size: 9px;
        margin-bottom: 12px;
        padding: 6px 12px;
    }
    .expansion-prg_title span{
        font-size: 12px;
    }
    .expansion-prg_title:after{
        left: calc(50% - 5px);
        bottom: -5px;
        width: 10px;
        height: 10px;
    }
        .expansion-prg p:not(.expansion-price){
        font-size: 9px;
        padding: 0 12px;
    }
    .expansion-price{
        font-size: 12px;
        padding: 0 12px 6px;
    }
    .expansion-price span{
        font-size: 25px;
        padding: 0 5px;
    }

}


/* flow */
/* sp */
@media only screen and (max-width: 767px) {
    .flow .container{
        width: calc(100% - 32px);
        margin: 0 16px;
    }
}