﻿@charset "utf-8";

@media (max-width: 639px) {
/***********************************************************
layout
***********************************************************/
#contents{
	background: #f2f2f2;
	padding-bottom: 0;
}
#contents .conInner{
	overflow: hidden;
    width: 100%;
    padding: 0 5%;
}
#contents .conInner.conInnerNone{
	padding: 0;
}
#contents .secOsusume01{
	padding-top: 1px;
}
#contents section{
	margin-bottom: 0;
}
#contents #basicInfo .cmpTableWrap .indexTableType01{
	margin: 0;
}
#contents #basicInfo .cmpTableWrap .indexTableType01 thead{
	width: 100%;
	display: table;
}
#contents #basicInfo .cmpTableWrap .indexTableType01 th,
#contents #basicInfo .cmpTableWrap .indexTableType01 td{
	border: 1px solid #dbd5d1;
	padding: 15px 10px;
	width: 50%;
}
#contents #basicInfo .cmpTableWrap .indexTableType01 th{
	background: #faf8f6;
	border-bottom: none;
}

/*----------------------------------------------------------
Title
----------------------------------------------------------*/
#contents .imageTitle{
	text-align: center;
	margin: 25px 0 15px;
}
#contents .imageTitle h2{
    width: 47.56%;
    margin: 0 auto;
}

/*----------------------------------------------------------
External icon adjustment
----------------------------------------------------------*/
.linkType02 span.iconTypeBlank,
.linkType03 span.iconTypeBlank{
	margin-top: -10px;
}
.linkType02 span.iconTypeBlank img,
.linkType03 span.iconTypeBlank img{
	display: block;
}
.txtlinkType01 span.iconTypeBlank{
	margin-top: -10px;
	display: inline-block;
    padding-top: 0;
    padding-left: 0.285em;
    vertical-align: middle;
    line-height: 1;
}
.txtlinkType01 span.iconTypeBlank img{
	width: 9px;
    margin-bottom: 0;
    margin-left: 0;
	display: block;
}

/*----------------------------------------------------------
indexIndent01
----------------------------------------------------------*/
.indexIndent01 li{
	padding-left: 3.785rem;
	text-indent: -3.785rem;
}
.indexIndent03{
	display: inline-block;
	padding: 0 8px;
}
.indexIndent03 li{
	padding-left: 3.357rem;
	text-indent: -3.357rem;
}

/*----------------------------------------------------------
listType
----------------------------------------------------------*/
.listType04_01 > li:before {	display:table-cell;}

.listType05.indexIndent01 > li,
.listType05.indexIndent03 > li{
	margin-bottom: 0px;
}
.listType05.indexIndent01 > li:before,
.listType05.indexIndent03 > li:before{
	padding-right: 0;
}

/*----------------------------------------------------------
mv
----------------------------------------------------------*/
#contents .mvArea{
    margin-top: 22px;
	text-align: center;
    background: #fff url(/landing/mufgcard/apply/mufgcard_smart_osusume/img/index_mvbg_01_sp.png) center -30px no-repeat;
    background-size: 100% auto;
}
#contents h1{
    width: 81.744%;
    margin: 0 auto;
    padding: 0;
    text-align: center;
    background: none;
}

/* .ancArea01 */
#contents .mvArea .ancArea01{
	margin: 11px 1.058% 20px;
	padding: 3.571%;
}
#contents .mvArea .ancArea01 > *:not(:last-child){
	margin-bottom: 8px;
}
#contents .mvArea .ancArea01 .ancTitle{
	font-size: 0.928rem;/* 13px */
	font-weight: bold;
}
#contents .mvArea .ancArea01 .AnchorBtn01 > *{
	float: left;
    width: 49.038%;
    margin-top: 2.423%;
}
#contents .mvArea .ancArea01 .AnchorBtn01 > *:nth-child(odd){
    margin-right: 1.923%;
}
#contents .mvArea .ancArea01 .AnchorBtn01 > *:nth-child(-n+2){
    margin-top: 0;
}
#contents .mvArea .ancArea01 .AnchorBtn01::after{
	content: "";
	clear: both;
	display: block;
}

/*----------------------------------------------------------
.cardfaceArea01
----------------------------------------------------------*/
.cardfaceArea01{
	padding: 0;
	text-align: center;
}
.cardfaceArea01 > *:first-child{
    margin-right: -5%;
    margin-left: -5%;
}
.cardfaceArea01 > *:not(:last-child){
	margin-bottom: 15px;
}
.cardfaceArea01 .cardfaceTxt{
	font-size: 1rem;/* 14px */
}

/*----------------------------------------------------------
.pointBlock
----------------------------------------------------------*/
.pointBlock{
	padding: 0 6.597% 20px;
	margin-top: 20px;
	background: #ffffff !important;
	border-radius: 10px !important;
	-webkit-border-radius: 10px !important;
	-moz-border-radius: 10px !important;
	-o-border-radius: 10px !important;
	-ms-border-radius: 10px !important;
}
.pointBlock >*:first-child:not(.TitleImg){
	padding-top: 20px;
}
/* .pointTitle */
.pointBlock .pointTitle{
    font-size: 1.142rem;/* 16px */
	font-weight: bold;
	text-align: center;
}
.pointBlock .pointTitle.TitleImg{
	position: relative;
}
.pointBlock .pointTitle.TitleImg::before{
	content: "";
	display: block;
	margin-top: 18%;
}
.pointBlock .pointTitle.TitleImg::after{
	content: "";
	display: block;
	padding-bottom: 26%;
}
.pointBlock .pointTitle.TitleImg >*{
	position: absolute;
	display: inline-block;
	width: 32%;
	height: auto;
	left: 50%;
	top: -38%;
	margin-left: -16%;
}
/* .pointImg */
.pointBlock .pointImg{
	margin-bottom: 10px;
	text-align: center;
}
/* .pointNotebox */
.pointNoteWrap > .pointNoteImg.pcImg {
	display: none;
}
.pointNotebox{
	display: table;
}
.pointNotebox > .pointNoteImg{
	width: 24.6%;
    padding: 5px;
	display: table-cell;
	vertical-align: top;
}
.pointNotebox .pointNoteTxt .fSizM{
	font-size: 1.142rem;/* 16px */
}
/*----------------------------------------------------------
.presentBlock
----------------------------------------------------------*/
.presentBlockWap{
    margin: 0 4px;
	background: #fff;
	border-radius: 10px;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	-o-border-radius: 10px;
	-ms-border-radius: 10px;
}
.presentBlock{
	padding: 12px 15px;
}
.uAccType02 .presentBlock{
	padding: 10px 10px 20px;
}
.presentBlock > *:not(:last-child){
	margin-bottom: 12px;
}
.presentBlock .preTerms01 > *:not(:last-child){
	margin-bottom: 5px;
}
.presentBlock ul[class*="listType"]{
	font-size: 0.785rem;/* 11px */
}

/*----------------------------------------------------------
.subscriptionBlock
----------------------------------------------------------*/
.subscriptionBlock{
	padding: 30px 0;
}
.subscriptionBlock > *:not(:last-child){
	margin-bottom: 25px;
}
.subscriptionBlock .subscTitle{
	text-align: center;
}
.subscriptionBlock .subscBtnArea{
	margin-bottom: 30px;
	text-align: center;
}
.subscriptionBlock .subscBtnArea > *{
	display: inline-block;
	width: 89.583%;
}
.subscriptionBlock .subscBtnArea > *:not(:last-child){
	margin-bottom: 30px;
}
.subscriptionBlock .subscBtnArea .redBtn04{
	margin-top: 11px;
}
.subscriptionBlock .subscBtnArea .subscImg img{
	width: 62.596%;
	margin: 0 auto;
	display: block;
}
.subscriptionBlock .subscBtnArea .redBtn04 a{
	width: 100%;
	font-size: 1.142rem;/* 16px */
	text-align: left;
}
.subscriptionBlock .subscBtnArea .redBtn04 sup,
.subscriptionBlock .subscBtnArea .redBtn04 sub{
	font-size: 60%;
}
.subscriptionBlock .subscBtnArea.BtnBlockL > *{
	width: 100%;
}
.subscriptionBlock .subscBtnArea.BtnBlockL .subscImg img{
	width: 78.298%;
}
.subscriptionBlock .subscBtnArea.BtnBlockL .redBtn04 a{
	font-size: 1.5rem;/* 21px */
}

/*----------------------------------------------------------
accordion
----------------------------------------------------------*/
/* .uAccType01 */
.uAccType01{
    margin-top: 20px;
	border: 4px solid #eee;
	border-radius:10px;
	-webkit-border-radius:10px;
	-moz-border-radius:10px;
	-o-border-radius:10px;
	-ms-border-radius:10px;
}
.uAccType01 .accordionBoxTitle{
	padding: 6px 6px 4px;
	font-size: 1.142rem;/* 16px */
	font-weight: bold;
	text-align: center;
}
.uAccType01 .accordionBoxTitle .iconTypeACD{
	width: 20px;
	height: auto;
	display: inline-block;
	margin-right: 8px;
}
.uAccType01 .accordionBox{
	margin: 0 6px 0;
	padding: 20px 4px;
	border-top: 2px dotted #eee;
}

/* .uAccType02 */
.uAccType02{
	margin-bottom: 20px;
	border-radius: 10px 10px 5px 5px;
	-webkit-border-radius: 10px 10px 5px 5px;
	-moz-border-radius: 10px 10px 5px 5px;
	-o-border-radius: 10px 10px 5px 5px;
	-ms-border-radius: 10px 10px 5px 5px;
}
.uAccType02.act{
	margin-bottom: -5px;
	border-right: 5px solid #fde5e5;
	border-left: 5px solid #fde5e5;
	border-bottom: 5px solid #fde5e5;
}
.uAccType02.uAcclast.act{
	margin-bottom: 20px;
}
.uAccType02 .accordionBoxTitle{
	position: relative;
}
.uAccType02.act .accordionBoxTitle{
    margin: 0 -5px;
}
.uAccType02 .accordionBoxTitle .iconTypeACD{
	position: absolute;
	display: block;
	width: 12.5%;
	height: 50%;
	right: 3.571%;
    top: 50%;
    margin-top: -6.25%;
	background: #fff;
	border-radius: 3px;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	-o-border-radius: 3px;
	-ms-border-radius: 3px;
}
.uAccType02 .accordionBox{
}
/*----------------------------------------------------------
detailsArea
----------------------------------------------------------*/
#contents .detailsArea section{
	margin: 0;
}
.detailsArea{
	background: #fff;
	padding-top: 1px;
}
/* .cautionsBoxWrap */
.detailsArea > *{
	margin-bottom: 50px;
}
/*----------------------------------------------------------
#basicInfo/#inquiry
----------------------------------------------------------*/
#contents .osusumeImgBlock01 img {
	height: 32px;
}
#inquiry{
	padding-bottom: 30px;
}

/*----------------------------------------------------------
accordion Image adjustment
----------------------------------------------------------*/
/* .ImgColType01 */
.ImgColType01{
}
.ImgColType01 > *{
	width: 52.358%;
	margin: 0 auto 6px;
}
.ImgColType01 .ImgIcon01{
	text-align: center;
}
.ImgColType01 > *:last-child{
	margin-bottom: 0px;
}
/* .ImgColType02 */
.ImgColType02::after{
	content: "";
	clear: both;
	display: block;
}
.ImgColType02{
	margin: 0 auto;
}
.ImgColType02 > *{
	float: left;
	width: 47.747%;
}
.ImgColType02 > *:first-child{
	width: 100%;
    max-width: inherit;
    margin-bottom: 10px;
	text-align: center;
}
.ImgColType02 > *:first-child img {width: 47.747%;}
.ImgColType02 > *:nth-child(2n) {float: left}
.ImgColType02 > *:nth-child(2n + 1) {float: right}

/* .ImgColType03 */
.ImgColType03{
    text-align: center;
}
.ImgColType03 .ColImg{
    width: 46.396%;
    margin: 0 auto 10px;
}
.ImgColType03 .ColImg.layoutType01{
	text-align: right;
}
.ImgColType03 .ColTxt li{
	text-align: left;
}
.ImgColType03 .ColTxt .fSizM{
	font-size: 1rem;/* 14px */
}
.ImgColType03 .ColTxt .fSizL{
	font-size: 1.428rem;/* 20px */
}

/* .ImgColType04 */
.ImgColType04{
	text-align: center;
}
.ImgColType04 > *:last-child{
    margin-bottom: 25px;
}
.ImgColType04 .Col04Txt{
	font-size: 1rem;/* 14px */
	font-weight: bold;
}
.ImgColType04 .Col04Img{
    margin-top: 25px;
    width: 37.2%;
}

/* .ImgColType05 */
.ImgColType05{
}
.ImgColType05::after{
    content: "";
    display: block;
    clear: both;
}
.ImgColType05 > *{
    width: 40%;
    margin-top: 10px;
}
.ImgColType05 > *:nth-child(odd){
    float: left;
    margin-left: 4%;
}
.ImgColType05 > *:nth-child(even){
    float: right;
    margin-right: 4%;
}

/* .ImgColType06 */
.ImgColType06{
}
.ImgColType06::after{
    content: "";
    display: block;
    clear: both;
}
.ImgColType06 > *{
	width: 42%;
}
.ImgColType06 > *:nth-child(odd){
    float: left;
    margin-left: 3%;
}
.ImgColType06 > *:nth-child(even){
    float: right;
    margin-right: 3%;
}

/***********************************************************
parts
***********************************************************/
/* inner */
.Inn20{	}
.autoCenter{
    margin-right: auto !important;
    margin-left: auto !important;
}
/* .mg */
.mg-B0{	margin-bottom: 0 !important;}
.mg-B20{	margin-bottom: 20px !important;}
.mg-B30sp{	margin-bottom: 30px !important;}
.pd-L30{	padding-left: 30px !important;}
.mgType01{ }
.mgType02{	margin-bottom: 15px !important;}
/* .textType01 */
.spFSize12{
	font-size: 0.857rem;/* 12px */
}
.textType01{	font-size: 0.928rem !important;/* 13px */}
.textType02,.textType03{	font-size: 1rem !important;/* 14px */}
.textType04{	font-size: 0.857rem !important;/* 12 px */}
.textType05{	font-size: 1.142rem !important;/* 16 px */}
/* .textTypeRed */
.textTypeRed{	color:#e60000 !important;}
/* .textTypeRed */
.textTypeLine{	text-decoration: underline !important;}
/* .boxBg */
.boxBgF2F2F2{	background: #f2f2f2 !important;}
.boxBgFFFFFF{	background: #ffffff !important;}
.boxBgFAF5F0{	background: #faf5f0 !important;}
/* .boxRadius */
.boxRadius10{
	border-radius: 5px !important;
	-webkit-border-radius: 5px !important;
	-moz-border-radius: 5px !important;
	-o-border-radius: 5px !important;
	-ms-border-radius: 5px !important;
}
/* .boxType01*/
.boxType01{
	padding: 10px;
	margin-bottom: 16px;
	text-align: center;
	line-height: 1.3;
	font-size: 0.857rem;/* 12px */
	font-weight: bold;
	background: #f2f2f2;
	border-radius: 5px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	-o-border-radius: 5px;
	-ms-border-radius: 5px;
}
.boxType01 .subTxt{
	padding: 6px 20px 4px;
	margin-bottom: 12px;
	display: inline-block;
	font-size: 0.785rem;/* 11px */
	color: #fff;
	background: #e60000;
	border-radius: 20px;
	-webkit-border-radius: 20px;
	-moz-border-radius: 20px;
	-o-border-radius: 20px;
	-ms-border-radius: 20px;
}
.boxType01 .EmpTxt{
	font-size: 1.071rem;/* 15px */
}
/* .boxType02*/
.boxType02{
	padding: 15px;
	font-size: 0.857rem;/* 12px */
	text-align: center;
	border: 3px solid #fce5e5;
	border-radius: 10px;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	-o-border-radius: 10px;
	-ms-border-radius: 10px;
}
.boxType02 .EmpTxt{
	font-size: 1rem;/* 14px */
}
/* .boxType03*/
.boxType03{
}
.boxType03 .boxTypeInn{
	padding: 10px;
	border-right: 5px solid #fce5e5;
	border-left: 5px solid #fce5e5;
	border-bottom: 5px solid #fce5e5;
	border-radius: 0 0 10px 10px;
	-webkit-border-radius: 0 0 10px 10px;
	-moz-border-radius: 0 0 10px 10px;
	-o-border-radius: 0 0 10px 10px;
	-ms-border-radius: 0 0 10px 10px;
}
.boxType03 .boxTypeInn > *:not(:last-child){
	margin-bottom: 10px;
}
/* .boxType04*/
.boxType04{
	font-size: 0.857rem;/* 12px */
}
.boxType04 .imgIcon{
	padding: 0 3px 3px;
	width: 25px;
	vertical-align: middle;
}
.boxType04 .imgIcon02{
	width: 15px;
	vertical-align: middle;
}
/* .boxType05*/
.boxType05{
	padding: 20px;
	border: 5px solid #facccc;
	border-radius: 5px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	-o-border-radius: 5px;
	-ms-border-radius: 5px;
}
.boxType05 > *:not(:last-child){
	margin-bottom: 20px;
}

/* .textDecoration */
.textDecoration01{
	margin: 8px 0px 5px;
	background: linear-gradient(to bottom, transparent 9px, #dfdfdf 9px, #dfdfdf 12px, transparent 12px);
	text-align: center;	
}
.decorationInner01{
	display: inline-block;
	padding: 0 8px;
	font-size: 1.142rem;/* 16px */
	font-weight: bold;
	background: #fff;
}

/* .AncBtn */
.AncBtn a{
	position: relative;
	display: block;
	width: 100%;
	height: auto;
	padding: 10px 5px 25px;
	text-align: center;
    color: #ffffff;
    font-size: 0.857rem;/* 12px */
	font-weight: bold;
	border-radius: 5px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	-o-border-radius: 5px;
	-ms-border-radius: 5px;
	background-color: #e60000;
	box-shadow: 0 3px 0 0 #730000;
}
.AncBtn a::after{
	content: '';
	position: absolute;
	display: block;
	left: 50%;
	bottom: 10px;
	width: 10px;
	height: 10px;
	margin-left: -5px;
	border-right: 3px solid #fff;
	border-bottom: 3px solid #fff;
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
}
.AncBtn a:hover{
	color: #ffffff;
	text-decoration: none;
	background-color: #ed4b4b;
}

/* .link */
.columnlinkBox01{
	text-align: center;
}
.columnlinkBox01 a{
	font-size: 1.142rem;/* 16px */
	font-weight: bold;
	padding-left: 10px;
	position: relative;
}
.columnlinkBox01 a:before{
	content: '';
	display: block;
	position: absolute;
	left: -10px;
	top: 50%;
	width: 7px;
	height: 7px;
	margin-top: -7px;
	border-right: 3px solid #e60000;
	border-bottom: 3px solid #e60000;
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
}

/*----------------------------------------------------------
columnBox
----------------------------------------------------------*/
/* .columnBoxWrap */
.columnBoxWrap::after{
	content: "";
	clear: both;
	display: block;
}
/* .colTwoType01 */
.colTwoType01{
}
.colTwoType01 .columnBox{
	float: left;
	width: 48.47%;
}
.colTwoType01 .columnBox:not(:last-child){
	margin-right: 3.06%;
}
/* .spColOneType01 */
.spColOneType01 .columnBox{
	width: 100%;
}
.spColOneType01 .columnBox:not(:last-child){
	margin-right: 0;
}

/*----------------------------------------------------------
fixBox
----------------------------------------------------------*/
.fixBox{
	position: fixed;
	left: 0;
	bottom: 0;
	width: 100%;
	padding: 6px 14px;
	background: rgba(0,0,0,0.7);
	z-index: 999;
	-webkit-transition: all 0.5s;
	-moz-transition: all 0.5s;
	-ms-transition: all 0.5s;
	-o-transition: all 0.5s;
	transition: all 0.5s;
}
.fixboxInner{
	margin: 0 auto;
}
.fixboxInner::after{
	content: "";
	display: block;
	clear: both;
}
.fixcolumn{
	float: left;
	width: 50%;
}
.fixcolumn:first-child{
	width: 100%;
	margin-bottom: 4px;
}
.fixcolumn:last-child{
	padding-left: 12px;
}
.fixcolumn.fixBtn01 a{
	width: 100%;
	padding: 10px 15px 10px 26px;
	font-size: 0.785rem;/* 11 */
	text-align: left;
	background-size: 15px auto;
	background-position: 6px center;
	border-radius: 10px;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	-o-border-radius: 10px;
	-ms-border-radius: 10px;
}
a.fixBoxTxtLink01{
	display: inline-block;
    padding-left: 14px;
	text-indent: -14px;
	text-align: left;
	font-size: 0.714rem;/* 10 */
	word-wrap : break-word;
	overflow-wrap : break-word;
}
a.fixBoxTxtLink01:link,
a.fixBoxTxtLink01:visited{
	color: #fff;
}
.fixBoxTxtLink01::before{
	content: "";
	background: url(/landing/mufgcard/apply/mufgcard_smart_osusume/img/index_fix_arrow.png) 0 0 no-repeat;
	background-size: contain;
	width: 10px;
	height: 6px;
	display: inline-block;
	vertical-align: middle;
	margin-right: 5px;
}

/*----------------------------------------------------------
returnTopBtn
----------------------------------------------------------*/
#returnTopSP{
	position: fixed;
	bottom: 95px;
	right: 4.687%;
	z-index: 2222;
	width: 52px;
	height: 52px;
	cursor: pointer;
}
#returnTopSP a{
	display: block;
	width: 52px;
	height: 52px;
	z-index: 98;
}
#returnTopSP a:before{
	position: absolute;
	content: "";
	color: #ffffff;
	width: 52px;
	height: 52px;
	-webkit-border-radius: 50%;
	-moz-border-radius: 50%;
	border-radius: 50%;
	background-color: rgba(95,95,95,0.7);
}
#returnTopSP a img{
	position: absolute;
	top: 19px;
	left: 15px;
	width: 22px;
	max-width: 22px;
	z-index: 97;
	pointer-events: none;
}

/*----------------------------------------------------------
Adjustment
----------------------------------------------------------*/
#AnchorArea05 ~ p > .rCP2020 {
	display: block;
	margin-bottom: 35px;
}
}/*clsoe media*/
