@charset "UTF-8";

@media screen and (max-width: 767px) {
	/* style */
	.welcomeBg01 {
		margin: 0 -10px;
		padding: 0 0 25px;
	}
	.welcomeBg01 .mainInner .mainContents {
		max-width: 355px;
		margin: 0 auto;
		padding: 0 10px;
	}
	.pcEventNone {
		pointer-events: auto;
	}

	/* welcomeMvBlock */
	.welcomeMvBlock01 {
		margin: 0 -10px;
		padding: 15px 0;
	}
	.welcomeMvBlock01 .welcomeMvInner {
		width: auto;
		max-width: 355px;
		padding: 0 20px;
	}
	.welcomeMvBlock01 .welcomeMvContent {
		margin-top: 40px;
	}
	.welcomeMvBlock01 .welcomeMvTitleBlock01 {
		width: 274px;
		margin-left: auto;
	}
	.welcomeMvBlock01 .welcomeMvTitleBlock01:before {
		top: 24px;
		right: auto;
		left: -135px;
		width: 248px;
		height: 227px;
	}
	.welcomeMvBlock01 .welcomeMvTextBlock01:before {
		top: -77px;
		right: -6px;
		width: 135px;
		height: 217px;
	}
	.welcomeMvBlock01 .welcomeMvText01 {
		font-size: 0.9375em;
		line-height: 1.666;
	}
	.welcomeMvBlock01 .welcomeMvText02 {
		margin-top: 110px;
		padding-right: 105px;
		padding-bottom: 50px;
		font-size: 0.875em;
		line-height: 1.642;
	}

	/* welcomeAppBlock */
	.welcomeAppBlock01 {
		padding: 15px;
		border-radius: 23px;
	}

	/* welcomeAppDlBlock */
	.welcomeAppDlBlock01 {
		display: block;
	}
	.welcomeAppDlBlock01 .welcomeAppBadgeItem {
		display: block;
		margin: 20px 0 0;
		text-align: center;
	}
	.welcomeAppDlBlock01 .welcomeAppBadgeItem > * {
		width: auto;
		margin: 0;
	}
	.welcomeAppDlBlock01 .welcomeAppBadgeItem > *:first-child {
		margin-left: 0;
	}

	/* welcomeAppCarousel */
	.welcomeAppCarousel01 {
		margin-top: 20px;
		min-height: 475px;
	}
	.welcomeAppCarousel01 .welcomeAppCarouselList .carouselListItem:before {
		content: none;
	}
	.welcomeAppCarousel01 .carouselListImg > img {
		width: 168px;
	}
	.welcomeAppCarousel01 .carouselListText {
		margin-top: 30px;
	}
	.welcomeAppCarousel01 .welcomeAppStep {
		left: 23px;
		width: 65px;
		height: 65px;
		padding-top: 6px;
		font-size: 0.75em;
		line-height: 1.2;
	}
	.welcomeAppCarousel01 .welcomeAppStep .num {
		font-size: 1.833em;
	}
	.welcomeAppCarousel01 .bx-wrapper {
		position: relative;
	}
	.welcomeAppCarousel01 .bx-controls {
		display: flex;
		flex-flow: row nowrap;
		justify-content: center;
		align-items: center;
	}
	.welcomeAppCarousel01 .bx-prev,
	.welcomeAppCarousel01 .bx-next {
		content: "";
		position: absolute;
		top: 50%;
		width: 20px;
		height: 20px;
		margin: -80px 0 0;
		padding: 0;
		border-top: 3px solid #fff;
		border-right: 3px solid #fff;
		-webkit-transform: rotate(-135deg) translateZ(50px);
		transform: rotate(-135deg) translateZ(50px);
	}
	.welcomeAppCarousel01 .bx-prev {
		left: -15px;
	}
	.welcomeAppCarousel01 .bx-next {
		right: -15px;
		-webkit-transform: rotate(45deg) translateZ(50px);
		transform: rotate(45deg) translateZ(50px);
	}
	.welcomeAppCarousel01 .bx-prev.disabled,
	.welcomeAppCarousel01 .bx-next.disabled {
		border-color: rgba(255, 255, 255, 0.20);
		pointer-events: none;
	}
	.welcomeAppCarousel01 .bx-prev > span,
	.welcomeAppCarousel01 .bx-next > span {
		display: none;
	}
	.welcomeAppCarousel01 .bx-default-pager {
		display: flex;
		position: absolute;
		top: 353px;
		text-align: center;
		transform: translateZ(50px);
	}
	.welcomeAppCarousel01 .bx-default-pager a {
		display: block;
		text-indent: -500px;
		overflow: hidden;
		background-color: rgba(255, 255, 255, 0.20);
		width: 6px;
		height: 6px;
		border-radius: 50%;
	}
	.welcomeAppCarousel01 .bx-default-pager a.active {
		background: #fff;
	}
	.welcomeAppCarousel01 .bx-default-pager .bx-pager-item {
		display: inline-block;
		margin: 0 4px;
	}
	.welcomeAppCarousel01 .bx-controls-auto {
		display: none;
	}

	/* welcomeAccBlock */
	*[class*="welcomeAccBlock"] {
		border-radius: 15px;
	}
	.welcomeAccBlock01 {
		margin-top: 115px;
	}
	.welcomeAccBlock01:before {
		top: -109px;
		right: 50%;
		width: 83px;
		height: 109px;
		margin-right: -42px;
	}
	.welcomeAccBlock01 .title {
		padding: 10px 15px;
		font-size: 1.1875em;
		line-height: 1.3;
	}
	.welcomeAccBlock02 .title {
		padding: 10px 15px;
		font-size: 1.125em;
		line-height: 1.3;
	}
	.welcomeAccBlock01 .detail {
		padding: 0 30px 30px;
	}
	.welcomeAccBlock02 .detail {
		padding: 0 15px 10px;
	}
	.welcomeAccBlock01 .title:before {
		left: 14px;
		width: 46px;
		height: 52px;
	}
	#wrap .welcomeAccBlock01.jsAccTitle .jsAccSwitch > * {
		padding-right: 50px;
		padding-left: 50px;
	}
	#wrap .welcomeAccBlock02.jsAccTitle .jsAccSwitch > * {
		padding-right: 25px;
		padding-left: 22px;
	}
	#wrap .welcomeAccBlock01.jsAccTitle .jsAccSwitch > *:after {
		right: 3px;
		width: 8px;
		height: 8px;
		margin-top: -7px;
	}
	#wrap .welcomeAccBlock02.jsAccTitle .jsAccSwitch > *:after {
		right: 9px;
		width: 6px;
		height: 6px;
		margin-top: -6px;
	}
	#wrap .welcomeAccBlock01.jsAccTitle [aria-selected="true"].jsAccSwitch > *:after {
		margin-top: -2px;
	}
	#wrap .welcomeAccBlock02.jsAccTitle [aria-selected="true"].jsAccSwitch > *:after {
		margin-top: -3px;
	}
	.welcomeAccBlock02 .welcomeAnswerItem .answerTitle {
		font-size: 1.222em;
		line-height: 1.4;
	}

	/* welcomeExampleColumn */
	.welcomeExampleColumn01 {
		display: block;
		margin-top: 90px;
	}
	.welcomeExampleColumn01 *[class*="welcomeExampleItem"] {
		display: inline-flex;
		width: 100%;
		margin-top: 15px;
		margin-left: 0;
	}
	.welcomeExampleColumn01 *[class*="welcomeExampleItem"]:first-child {
		margin-top: 0;
	}
	.welcomeExampleColumn01 *[class*="welcomeExampleItem"] .welcomeExampleText {
		width: auto;
		margin-top: 40px;
	}
	.welcomeExampleColumn01 .welcomeExampleItem02 .welcomeExampleImg {
		order: 2;
	}
	.welcomeExampleColumn01 .welcomeExampleItem01 .welcomeExampleText {
		margin-left: 25px;
	}
	.welcomeExampleColumn01 .welcomeExampleItem02 .welcomeExampleText {
		order: 1;
		margin-right: 45px;
	}
	.welcomeExampleColumn01 *[class*="exampleAppImg"] {
		width: 132px;
	}
	.welcomeExampleColumn01 .exampleAppImg01:before {
		top: -68px;
		left: 11px;
		width: 48px;
		height: 89px;
	}
	.welcomeExampleColumn01 .exampleAppImg02:before {
		left: -53px;
		width: 50px;
		height: 116px;
	}
	.welcomeExampleColumn01 .exampleAppImg03:before {
		left: 95px;
		width: 54px;
		height: 65px;
	}

	/* list */
	.welcomeMemoList01 .listMark {
		padding-right: 5px;
	}

	/* title */
	.welcomeTitle01 {
		margin-bottom: 20px;
		padding-bottom: 20px;
		font-size: 1.125em;
	}
	.welcomeTitle01:after {
		width: 12px;
		height: 12px;
		margin-left: -11px;
	}

	/* link */
	.welcomeAnchorLink01 {
		margin: 10px 10px 0 0;
		font-size: 0.555em;
	}

	/* btn */
	.welcomeAppDlBtn01 {
		padding: 12px 10px;
		border-radius: 16px;
		font-size: 1.375em;
	}

	/* balloon */
	*[class*="welcomeBalloon"] {
		border-radius: 8px;
	}
	.welcomeBalloon01 {
		width: auto;
		max-width: 330px;
		margin-bottom: 15px;
		padding: 8px 15px;
		font-size: 0.6875em;
		line-height: 1.47;
	}
	.welcomeBalloon02 {
		top: -48px;
		right: -100px;
		width: 165px;
		padding: 10px;
		font-size: 0.6875em;
	}
	.welcomeBalloon01:after {
		bottom: -9px;
		margin-left: -5px;
		border-width: 9px 5px 0 5px;
	}
	.welcomeBalloon02:after {
		bottom: -17px;
		left: 30px;
		border-width: 25px 25px 0 0;
	}

	/* modal */
	.welcomeModalColumn01 .welcomeModalBtn .kansaiLogoImg {
		width: auto;
	}

	/* -- 2407 add -- */
	/* baloon */
	.balloonBox {
		margin-top: 32px;
		border-radius: 20px;
		padding: 9px 13px 18px;
		flex-direction: column;
	}
	.balloonBox::before {
		top: -21px;
		left: 15%;
	}

	.balloonBox .boxItem.-item01 {
		width: 100%;
	}
	.balloonBox .boxItem.-item02 {
		width: 100%;
		margin-top: 10px;
	}

	.balloonBox .boxItem .itemImg {
		margin-top: 14px;
	}

	.balloonBox .boxItem .itemTxt01 {
		margin-top: 0;
	}

	.balloonBox .boxItem .itemTxt02 {
		margin-top: -4px;
	}

	.balloonBox .v3-decorationTextA01 > span:before,
	.balloonBox .v3-decorationTextA01 > span:after {
		height: 26px;
    top: calc(50% - 7px);
	}
}
