@charset "UTF-8";
@import url(/common2/css/smp/smartphone.css);
/* ----------------------------------------------
 * appchart　SP
 * ---------------------------------------------- */
@media only screen and (max-width: 599px) {
	.appchart {
		/*  .appchart-header
		---------------------------------------------- */
		/*  item container
		---------------------------------------------- */
		/* item general
		---------------------------------------------- */
		/* item each
		---------------------------------------------- */
	}
	.appchart .appchart-lead {
		font-size: 14px;
	}
	.appchart .appchart-wrapper {
		margin-top: 28px;
	}
	.appchart .appchart-inner {
		display: flex;
		padding: 0;
		width: 100%;
	}
	.appchart .appchart-header {
		display: flex;
		flex-direction: column;
		width: 14.79452%;
		height: 172vw;
		margin-right: 2.05479%;
	}
	.appchart .appchart-header__item {
		display: flex;
		padding-left: 23.14815%;
	}
	.appchart .appchart-header__item--mobile {
		margin-top: 54.4vw;
		height: 15.50388%;
	}
	.appchart .appchart-header__item--pc {
		margin-top: 28.13333vw;
		height: 28.68217%;
	}
	.appchart .appchart-header__icon--pc {
		width: 100%;
		height: 100%;
	}
	.appchart .appchart-header__icon--pc img {
		width: 100%;
		height: 100%;
	}
	.appchart .appchart-header__icon--mobile {
		width: 100%;
		height: 100%;
	}
	.appchart .appchart-header__icon--mobile img {
		width: 100%;
		height: 100%;
	}
	.appchart .appchart-header__title {
		height: 100%;
		width: 37.03704%;
		font-size: 2.66667vw;
	}
	.appchart .appchart-header__title--moblie p {
		display: inline-block;
		-ms-writing-mode: tb-rl;
		writing-mode: vertical-rl;
	}
	.appchart .appchart-header__detail {
		margin-top: 0;
		flex: 1;
		flex-direction: column;
		font-size: 2.66667vw;
	}
	.appchart .appchart-chart-container {
		position: relative;
		width: 100%;
		height: 0;
		margin-top: 0;
		padding-top: 177.39726%;
	}
	.appchart .appchart-item__head {
		width: 12.8vw;
	}
	.appchart .appchart-item__name {
		font-size: 2.66667vw;
		width: 200%;
		transform: translateX(-25%);
	}
	.appchart .appchart-item.appchart-item--i1 {
		left: calc(20.5% * 1);
		top: 1.78295%;
	}
	.appchart .appchart-item.appchart-item--i2 {
		left: calc(20.5% * 2);
		top: 1.78295%;
	}
	.appchart .appchart-item.appchart-item--i3 {
		left: 71.70418%;
		top: 1.78295%;
	}
	.appchart .appchart-item.appchart-item--i4 {
		left: calc(20.5% * 1);
		top: 16.82171%;
	}
	.appchart .appchart-item.appchart-item--i4 .appchart-item__head {
		width: 12.8vw;
		padding: 0;
	}
	.appchart .appchart-item.appchart-item--i5 {
		left: calc(20.5% * 1);
		top: 31.62791%;
	}
	.appchart .appchart-item.appchart-item--i6 {
		left: calc(20.5% * 2);
		top: 31.62791%;
	}
	.appchart .appchart-item.appchart-item--i7 {
		left: calc(20.5% * 3);
		top: 31.62791%;
	}
	.appchart .appchart-item.appchart-item--i8 {
		left: calc(20.5% * 4);
		top: 31.62791%;
	}
	.appchart .appchart-item.appchart-item--i9 {
		left: 0;
		top: 52.32558%;
	}
	.appchart .appchart-item.appchart-item--i10 {
		left: calc(20.5% * 3);
		top: 52.32558%;
	}
	.appchart .appchart-item.appchart-item--i11 {
		left: calc(20.5% * 4);
		top: 52.32558%;
	}
	.appchart .appchart-item.appchart-item--i11 .appchart-item__head {
		width: 116.66667%;
	}
	.appchart .appchart-item.appchart-item--i12 {
		left: calc(20.5% * 1);
		top: 67.90698%;
	}
	.appchart .appchart-item.appchart-item--i13 {
		left: calc(20.5% * 3);
		top: 67.90698%;
	}
	.appchart .appchart-item.appchart-item--i14 {
		left: calc(20.5% * 2);
		top: 86.66667%;
	}
}

/* ----------------------------------------------
 * appchart　Modal
 * ---------------------------------------------- */
@media only screen and (max-width: 599px) {
	.appchart-modal .appchart-modal__content {
		padding: 40px 27px;
		margin: 10px;
		background-color: #FFFFFF;
		display: flex;
		flex-direction: column;
		align-items: center;
	}
	.appchart-modal .appchart-modal__head {
		width: 38.46154%;
	}
	.appchart-modal .appchart-modal__name {
		font-weight: 700;
		display: block;
		text-align: center;
		line-height: 1.3;
		margin-top: 20px;
		font-size: 5.33333vw;
	}
	.appchart-modal .appchart-modal__detail {
		display: block;
		font-size: 4vw;
		margin-top: 24px;
		line-height: 1.2;
	}
	.appchart-modal .appchart-modal__links {
		display: flex;
		align-items: center;
		justify-content: center;
		margin-top: 28px;
	}
	.appchart-modal .appchart-modal__link-item {
		cursor: pointer;
		width: 37.2vw;
	}
	.appchart-modal .appchart-modal__link-item + .appchart-modal__link-item {
		margin-left: 3.6vw;
	}
}

/* ----------------------------------------------
* css by lang
* ---------------------------------------------- */
@media only screen and (max-width: 599px) {
	html:lang(ja) .appchart-header__detail p {
		height: 100%;
	}
	html:lang(ja) .appchart-header__detail p span {
		height: 100%;
		white-space: pre;
		display: inline-block;
		-ms-writing-mode: tb-rl;
		writing-mode: vertical-rl;
		text-orientation: upright;
	}
	html:lang(en) .appchart-header__title--pc p, html:lang(de) .appchart-header__title--pc p, html:lang(fr) .appchart-header__title--pc p, html:lang(es) .appchart-header__title--pc p, html:lang(it) .appchart-header__title--pc p, html:lang(nl) .appchart-header__title--pc p, html:lang(zh-cn) .appchart-header__title--pc p, html:lang(zh-tw) .appchart-header__title--pc p, html:lang(ko) .appchart-header__title--pc p, html:lang(ru) .appchart-header__title--pc p, html:lang(tr) .appchart-header__title--pc p {
		display: inline-block;
		-ms-writing-mode: tb-rl;
		writing-mode: vertical-rl;
	}
	html:lang(en) .appchart-header__detail p, html:lang(de) .appchart-header__detail p, html:lang(fr) .appchart-header__detail p, html:lang(es) .appchart-header__detail p, html:lang(it) .appchart-header__detail p, html:lang(nl) .appchart-header__detail p, html:lang(zh-cn) .appchart-header__detail p, html:lang(zh-tw) .appchart-header__detail p, html:lang(ko) .appchart-header__detail p, html:lang(ru) .appchart-header__detail p, html:lang(tr) .appchart-header__detail p {
		text-align: center;
		height: 50%;
	}
	html:lang(en) .appchart-header__detail p span, html:lang(de) .appchart-header__detail p span, html:lang(fr) .appchart-header__detail p span, html:lang(es) .appchart-header__detail p span, html:lang(it) .appchart-header__detail p span, html:lang(nl) .appchart-header__detail p span, html:lang(zh-cn) .appchart-header__detail p span, html:lang(zh-tw) .appchart-header__detail p span, html:lang(ko) .appchart-header__detail p span, html:lang(ru) .appchart-header__detail p span, html:lang(tr) .appchart-header__detail p span {
		height: 100%;
		white-space: pre;
		display: inline-block;
		-ms-writing-mode: tb-rl;
		writing-mode: vertical-rl;
		text-orientation: initial;
	}
}


