@charset "utf-8";

/*- 共通部分 -*/
.sp-only {
    display: none !important;
}

.flex {
    display: flex;
}

.flex-pc {
    display: flex;
}

.flex-end {
    width: 100%;
    display: flex;
    justify-content: flex-end;
}

.flex-end-pc {
    width: 100%;
    display: flex;
    justify-content: flex-end;
}

img {
    width: 100%;
}

textarea {
    resize: none;
}

.font__color {
    color: #4F4F4F;
}

.transform__05 {
    width: 100%;
    -webkit-transform: scale(0.5);
    -moz-transform: scale(0.5);
    -ms-transform: scale(0.5);
    -o-transform: scale(0.5);
    transform: scale(0.5);
}

.transform__08 {
    width: 100%;
    -webkit-transform: scale(0.8);
    -moz-transform: scale(0.8);
    -ms-transform: scale(0.8);
    -o-transform: scale(0.8);
    transform: scale(0.8);
}

/*- base&back -*/
.base__block {
	width: 100%;
	display: inline-block;
    position: relative;
}

.front__str {
    display: inline-block;
    position: absolute;
}

.back__str {
    width: 100%;
	display: inline-block;
    position: absolute;
}

.back__img {
    height: 350px;
    object-fit: cover;
}

/*- logo -*/
.logo {
    width: 230px;
}

/*- header -*/
.header {
    position: relative;
    width: 100%;
    height: 73px;
}

.header__inner {
    position: absolute;
    padding: 10px 0 0;
}

.header__background {
    position: absolute;
    z-index: 100;
    padding: 15px 20px;
    background: none;
}

.header__ul {
    justify-content: space-around;
    width: 500px;
    border-radius: 5px;
    background: #fff;
}

.hover__li {
    padding: 20px 0;
    font-size: 18px;
}

.hover__li>a {
    color: #383838;
}

.hover__li>a>span {
    padding-bottom: 8px;
    transition: all 0.2s ease-in-out;
}

.hover__li>a>span:hover {
    border-bottom: 2px solid #484848;
}

.header__inquiry {
    margin: 20px 6px;
}

.inquiry__box {
    padding: 5px 8px;
    background: #AE3D91;
    border: 2px solid #AE3D91;
    border-radius: 5px;
    color: #fff;
    transition: all 0.2s ease-in-out;
}

.inquiry__box:hover {
    background: #fff;
    color: #383838;
}

/*- header sub menu -*/
.sub__menu {
    display: none;
    position: absolute;
    z-index: 1000;
    width: 500px;
    padding: 15px 30px;
    border-radius: 5px;
    background: #fff;
}

.sub_backgroound {
    display: none;
    background: rgba(44, 44, 44, 50%);
}

.sub__content {
    width: 45%;
    margin: 0 auto;
}

.sub__top {
    justify-content: space-between;
    align-items: center;
    padding: 15px 10px;
    border-bottom: 1.5px solid #AE3D91;
    font-size: 10px;
}

.sub__top>img {
    width: 90px;
    height: 60px;
    object-fit: cover;
}

.sub__arrow {
    width: 30px;
    height: 15px;
    align-items: center;
    padding-right: 3px;
    border-radius: 3px;
    background: #3E3E3E;
    font-size: 2px;
    color: #fff;
}

.bottom__content {
    justify-content: space-between;
    align-items: center;
    width: 100%;
    margin: 15px auto 5px;
    padding: 0 20px 8px 0;
    border-bottom: 1px solid #D9D9D9;
    font-size: 10px;
}

.min__arrow {
    width: 15px;
    height: 10px;
    border-radius: 3px;
    background: #3E3E3E;
    padding-left: 3px;
    font-size: 10px;
    color: #fff;
}

/*- footer -*/
.footer {
    width: 80%;
    margin: auto;
    padding: 10px 0;
    text-align: center;
    border-top: 1px solid #626262;
}

/*- copyright -*/
.copyright {
    clear: both;
    padding-bottom: 10px;
    text-align: center;
    font-style: normal;
    font-size: 10px;
    color: #555;
}

/*- page top -*/
.top__front {
    width: 100%;
    font-size: 50px;
    color: #fff;
}

.top__text {
    width: 100%;
    height: 350px;
    align-items: center;
    justify-content: center;
    background: rgba(29, 29, 29, 40%);
}

.top__text>h1 {
    text-align: center;
}

.top__text>h1>p {
    margin-top: 20px;
    font-size: 20px;
}

/*- wrapper -*/
.wrapper {
    width: 80%;
    margin: 400px auto 0;
}

.wrapper__title {
    margin-top: 100px;
}

.wrapper__top {
    text-align: center;
    font-size: 35px;
    color: #7B7B7B;
}

.wrapper__top>p {
    margin-top: 20px;
    font-size: 16px;
}

.wrapper__underline {
    margin: 20px auto 0;
    border-bottom: 1px solid #AE3D91;
}

.head-border {
    display: flex;
    align-items: center;
    font-size: 24px;
    color: #7B7B7B;
}
 
.head-border:before,
.head-border:after {
    content: "";
    height: 1px;
    flex-grow: 1;
    background-color: #626262;
}

.head-border h2 {
    width: 40%;
    text-align: center;
}

.wrapper__bottom {
    padding-bottom: 100px;
}

/*- wrapper content -*/
.wrapper__content {
    position: relative;
    width: 100%;
    height: 630px;
    padding-top: 30px;
}

.content__img {
    position: absolute;
    align-items: center;
    justify-content: center;
    width: 50%;
    height: 600px;
}

.content__img img {
    width: 90%;
    height: 80%;
    border-radius: 20px;
    object-fit: cover;
}

.content__text {
    width: 65%;
    height: 600px;
    background: #F4F4F4;
    color: #7B7B7B;
}

.content__text>h3 {
    font-size: 29px;
}

.content__text>p {
    margin-top: 50px;
    font-size: 20px;
}

.right__content {
    padding: 100px 20px 0 15%;
}

.left__content {
    padding: 100px 15% 0 30px;
}

.content__tittle {
    width: 80%;
    font-size: 32px;
}

.content__btn {
    width: 45%;
    height: 64px;
    text-align: center;
    justify-content: center;
    align-items: center;
    margin-top: 50px;
    background: #AE3D91;
    border: 2px solid #AE3D91;
    border-radius: 32px;
    font-size: 14px;
    color: #fff;
}

.content__btn:hover {
    background: #fff;
    color: #AE3D91;
}

/*- index -*/
.index__topimg {
    height: 600px;
}

.index-top {
    width: 100%;
    margin-top: 280px;
    text-align: center;
    font-size: 35px;
}

.top__box {
    width: 250px;
    margin: 50px auto 0;
    padding: 15px 0;
    border: 1px solid #fff;
    font-size: 20px;
}

.index__about {
    margin-top: 570px;
    padding-bottom: 50px;
    background: #D795C0;
}

.about__block {
    position: relative;
    width: 80%;
    align-items: center;
    margin: auto;
    padding: 50px 30px;
    border-radius: 10px;
    background: #F9F9F9;
}

.about__img {
    width: 45%;
    margin-right: 30px;
    padding: 15px;
    border-radius: 5px;
    box-shadow: 3px 3px rgb(45 45 45 / 60%);
    background: #fff;
}

.about__text {
    width: 55%;
}

.about__top {
    text-align: left;
    margin-bottom: 30px;
    font-size: 35px;
    color: #7B7B7B;
}

.about__top>p {
    margin-top: 15px;
    font-size: 16px;
}

.index__wrapper {
    padding: 80px 0;
    background: #F4F4F4;
}

.index__backblock {
    position: absolute;
    width: 55%;
    margin-top: 100px;
    padding: 30px;
}

.left__text {
    margin-left: 80px;
}

.right__text {
    margin-right: 80px;
}

.left__text .index__number {
    left: 110px;
}

.right__text .index__number {
    right: 110px;
}

.index__number {
    position: absolute;
    top: 10px;
    font-size: 80px;
    color: #AE3D91;
}

.index__mainblock {
    width: 100%;
    padding: 100px 80px 50px;
    border-radius: 10px;
    background: #fff;
}

.index__texttop {
    font-size: 30px;
    color: #7B7B7B;
}

.index__texttop>p {
    margin: 15px 0 20px;
    font-size: 10px;
}

.border::after, .border::before {
    content: '';
	width: 50px;
	height: 50px;
	position: absolute;
}

.border::after {
    border-right: solid 2px #AE3D91;
	right: 0;
}

.border::before {
    border-left: solid 2px #AE3D91;
	left: 0;
}

.border-top::after, .border-top::before {
    border-top: solid 2px #AE3D91;
    top: 0;
}

.border-bottom::after, .border-bottom::before {
	border-bottom: solid 2px #AE3D91;
    bottom: 0;
}

.border-top::after {
    border-radius: 0 10px 0 0;
}

.border-top::before {
    border-radius: 10px 0 0 0;
}

.border-bottom::after {
    border-radius: 0 0 10px 0;
}

.border-bottom::before {
    border-radius: 0 0 0 10px;
}

.right__img {
    width: 70%;
}

.contact__block {
    position: relative;
    top: -50px;
    width: 80%;
    margin: auto;
    padding: 100px 0 30px;
    text-align: center;
    border-radius: 10px;
    background: #AE3D91;
}

.contact__top {
    font-size: 50px;
    color: #fff;
}

.contact__top>p {
    margin: 30px 0 20px;
    font-size: 16px;
}

.contact__underline {
    width: 100px;
    margin: 15px auto 0;
    border-bottom: 1px solid #fff;
}

.contact__bottom {
    justify-content: space-between;
    width: 70%;
    margin: 50px auto;
}

.contact__btn {
    width: 48%;
    padding: 30px 15px;
    text-align: center;
    border: 2px solid #fff;
    border-radius: 10px;
    color: #fff;
}

.contact__btn:hover {
    background: #fff;
    color: #AE3D91;
}

/*- ver -*/
.ark__ver>h4 {
    font-size: 24px;
    color: #AE3D91;
}

.ark__ver>p {
    margin: 10px 0 30px;
    font-size: 16px;
}

.ark-content__btn {
    margin-top: 150px;
}

.ark-content__btn-se {
    margin-top: 100px;
}

.ark_top_en {
    align-items: center;
}

.ark_wrapper {
    width: 50%;
}

.ark_text_en {
    text-align: center;
    font-size: 20px;
}

.ark_mov_en video {
    width: 100%;
}

.jstaff__ver {
    align-items: center;
    padding-top: 0;
}

/*- indonesia -*/
.idn__ver {
    margin-top: 12px;
}

.idn__ver .back__str {
    top: 20px;
    right: 20px;
    text-align: end;
    width: auto;
    font-size: 130px;
    color: rgba(255, 255, 255, 0.10);
}

.idn__ver .back__str img {
    width: 50%;
}

.idn__ver .top__front {
    margin-bottom: 50px;
    padding: 100px 50px 50px;
    background: #A02D49;
    font-size: 40px;
}

.idn__ver .top__front>p {
    margin-top: 50px;
    font-size: 20px;
}

.idn__ver .content__btn {
    width: 22.5%;
    height: 40px;
    margin: 50px 20px 0 0;
    background: #A02D49;
    border: 2px solid #fff;
}

.idn__ver .content__btn:hover {
    background: #fff;
    color: #A02D49;
}

.idn__ver .top__text {
    padding: 50px;
    background: #fff;
    font-size: 35px;
}

.top__li {
    width: 56%;
    margin: 50px auto;
    font-size: 16px;
}

#achivement {
    padding-top: 70px;
}

.idn__main .back__str {
    left: 20px;
    text-align: left;
    color: rgba(180, 45, 89, 0.08);
}

.idn__main .base__block>h3 {
    margin: 80px 50px;
    font-size: 32px;
}

.main__block {
    width: 90%;
    margin: auto;
    justify-content: space-between;
}

.main__left {
    width: 45%;
    padding: 10px;
    text-align: center;
}

.main__left a {
    margin: 30px 12.5% 0 0;
    padding-bottom: 5px;
    border-bottom: 1px solid #A02D49;
    font-size: 14px;
    color: #000;
}

.left__li {
    align-items: center;
    width: 75%;
    margin: 10px auto;
    padding: 5px 15px;
    border: 1px solid #828282;
    border-radius: 15px;
    font-size: 15px;
}

.num__box {
    width: 18px;
    height: 18px;
    margin: auto 10px auto 0;
    border-radius: 9px;
    text-align: center;
    line-height: initial;
	background: #A02D49;
    font-size: 12px;
    color: #fff;
}

.right__slider {
    width: 55%;
}

.team__pf {
	width: 90%;
	height: 410px;
    margin: 0 auto;
    padding: 15px;
    border: 1px solid #000;
    border-radius: 15px;
}

.pf__block {
    height: 100%;
    align-items: center;
}

.pf__block img {
	width: 35%;
    height: auto;
    margin: auto 25px auto 10px;
}

.pf__name>h4 {
    font-size: 25px;
    margin: 10px 0 20px;
}

.pf__text>p {
    font-size: 12px;
}

.main__li {
    width: 80%;
    margin: auto;
}

.achievement__li {
    margin-bottom: 50px;
}

.li__left {
    width: 53%;
}

.left__top {
	margin-bottom: 10px;
    padding: 10px;
	border-left: 8px solid #A02D49;
	font-size: 20px;
}

.li__right {
	width: 45%;
}

.li__right img {
	width: 100%;
}

/*- slider -*/
.content__img .bx-wrapper {
    -webkit-box-shadow: none;
    box-shadow: none;
    border: none;
    background: none;
}

.content__img .bx-wrapper img {
    height: 500px;
    margin: 50px auto;
}

.wrapper__slider {
    width: 65%;
    margin: 30px auto 0;
}

.slider__box {
    width: 100%;
    height: 600px;
    padding: 50px;
    border: 1px solid #000;
    border-radius: 10px;
}

.slider__img {
    width: 40%;
    margin: auto;
    margin-right: 30px;
    border-radius: 10px;
}

.slider__text {
    width: 60%;
    margin: auto;
}

.slider__tittle {
    margin-bottom: 50px;
    font-size: 21px;
}

.slider__li .bx-wrapper {
	box-shadow: none;
	border: none;
}

.slider__li .bx-wrapper .bx-pager.bx-default-pager a {
	background: #fff;
	border: 1px solid #A02D49;
}

.slider__li .bx-wrapper .bx-pager.bx-default-pager a:hover, 
.slider__li .bx-wrapper .bx-pager.bx-default-pager a.active,
.slider__li .bx-wrapper .bx-pager.bx-default-pager a:focus {
	background: #A02D49;
}



/*- logo_exp -*/
.exp__block {
    width: 60%;
    margin: 50px auto;
}

/*- rep_greet -*/
.greet__block {
    justify-content: center;
    width: 90%;
    margin: 50px auto 0;
}

.greet__left {
    width: 40%;
    text-align: center;
}

.greet__left img {
    width: 60%;
    margin-bottom: 20px;
}

.greet__right {
    width: 60%;
    font-size: 16px;
    margin: auto;
}

.info__ul {
    margin-top: 50px;
}

.info__li {
    width: 60%;
    margin: 20px auto 0;
    font-size: 14px;
}

.info__left {
    width: 25%;
    margin-right: 5%;
    padding: 10px;
    border-bottom: 1px solid #AE3D91;
}

.info__right {
    width: 70%;
    padding: 10px;
    border-bottom: 1px solid #A9A9A9;
}

/*- inquiry -*/
.inquiry__form {
    width: 700px;
    margin: 50px auto 0;
    color: #333333;
}

.form__recruit {
    margin-top: 30px;
    padding: 40px;
    background: #F6F6F6;
    border-radius: 15px;
}

.inquiry {
    margin-top: 20px;
}

.inputbox {
    width: 100%;
    height: 30px;
    background: #fff;
}

.inputbox2 {
    width: 100%;
    height: 150px;
    background: #fff;
}

.submit_button_cover {
    width: 200px;
    margin: 0 auto;
}

.submitb {
    width: 200px;
    padding: 10px 0;
    text-align: center;
    border-radius: 10px;
    background: #AE3D91;
    color: #fff;
}

.maintenance {
    width: 80%;
    text-align: center;
    margin: 50px auto 100px;
}