﻿@charset "utf-8";

/***********************************************************
reset
***********************************************************/
/*----------------------------------------------------------
cmn
----------------------------------------------------------*/
.oneCLM #cmnNaviHeader{
	margin-bottom: 0;
	position: relative;
}
.oneCLM #cmnNaviHeader::after {
    content: "";
    display: block;
    box-shadow: 0 4px 12px 0 #dddddd;
    z-index: 9999;
}
.oneCLM #main{
    width: 100%;
}
#contents h1{
	padding: 0;
	background:none;
	box-shadow:none;
}

/***********************************************************
layout
***********************************************************/
#contents{
	background: #f2f2f2;
}
#contents .conInner{
	overflow: hidden;
    width: 980px;
    margin: 0 auto;
}
#contents .secOsusume01{
	padding-top: 1px;
}
#contents #basicInfo .cmpTableWrap .indexTableType01{
	margin: 0;
}
#contents #basicInfo .cmpTableWrap .indexTableType01 th,
#contents #basicInfo .cmpTableWrap .indexTableType01 td{
	border: 1px solid #dbd5d1;
	padding: 15px 10px;
}
/*----------------------------------------------------------
Title
----------------------------------------------------------*/
#contents .imageTitle{
	text-align: center;
	margin: 60px 0;
}

/*----------------------------------------------------------
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 li{
	padding-left: 3.357rem;
	text-indent: -3.357rem;
}
/*----------------------------------------------------------
listType05
----------------------------------------------------------*/
.listType05.indexIndent01 > li,
.listType05.indexIndent03 > li{
	margin-bottom: 0px;
}
.listType05.indexIndent01 > li:before,
.listType05.indexIndent03 > li:before{
	padding-right: 0;
}

/*----------------------------------------------------------
mv
----------------------------------------------------------*/
#contents .mvArea{
	height: 800px;
	text-align: center;
	background: #fff url(/landing/mufgcard/apply/mufgcard_smart_osusume/img/index_mvbg_01.png) top center no-repeat;
}
#contents .mvArea h1{
	margin-top: 51px;
}
/* .ancArea01 */
#contents .mvArea .ancArea01{
	width: 640px;
	margin: 11px auto 20px;
	padding: 25px;
}
#contents .mvArea .ancArea01 > *:not(:last-child){
	margin-bottom: 13px;
}
#contents .mvArea .ancArea01 .ancTitle{
	font-size: 1.5rem;/* 21px */
	font-weight: bold;
}
#contents .mvArea .ancArea01 .AnchorBtn01 > *{
	float: left;
	width: 140px;
}
#contents .mvArea .ancArea01 .AnchorBtn01 > *:not(:last-child){
 	margin-right: 10px;
}
#contents .mvArea .ancArea01 .AnchorBtn01::after{
	content: "";
	clear: both;
	display: block;
}

/*----------------------------------------------------------
.cardfaceArea01
----------------------------------------------------------*/
.cardfaceArea01{
	padding: 25px;
	text-align: center;
}
.cardfaceArea01 > *:not(:last-child){
	margin-bottom: 32px;
}
.cardfaceArea01 .cardfaceTxt{
	font-size: 1.5rem;/* 21px */
}

/*----------------------------------------------------------
.pointBlock
----------------------------------------------------------*/
.pointBlock{
	padding: 0 30px 40px;
	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: 40px;
}
/* .pointTitle */
.pointBlock .pointTitle{
    font-size: 24px;
	font-weight: bold;
	text-align: center;
}
.pointBlock .pointTitle.TitleImg{
	position: relative;
}
.pointBlock .pointTitle.TitleImg::before{
	content: "";
	display: block;
	margin-top: 102px;
}
.pointBlock .pointTitle.TitleImg::after{
	content: "";
	display: block;
	padding-bottom: 65px;
}
.pointBlock .pointTitle.TitleImg >*{
	position: absolute;
	display: inline-block;
	width: 140px;
	height: auto;
	left: 50%;
	top: -82px;
	margin-left: -70px;
}
/* .pointImg */
.pointBlock .pointImg{
	margin-bottom: 30px;
	text-align: center;
}
/* .pointNotebox */
.pointNoteWrap {
	display: table;
}
.pointNoteWrap > .pointNoteImg.pcImg {
	display: table-cell;
	width: 223px;
	padding-left: 35px;
}
.pointNoteWrap .pointNoteboxWrap {
	display: table-cell;
	padding-left: 27px;
	vertical-align: middle;
}
.pointNotebox{
	display: table;
	width: 100%;
}
.pointNotebox > *{
	display: table-cell;
}
.pointNotebox > .pointNoteImg{
	width: 223px;
	padding-left: 35px;
	vertical-align: bottom;
}
.pointNotebox > .pointNoteTxt{
	padding-left: 27px;
	vertical-align: middle;
}
.pointNotebox .pointNoteTxt .fSizM{
	font-size: 1.5rem;/* 21px */
}
.pointNoteWrap .pointNotebox > .pointNoteImg{
	width: 100px;
	padding-left: 0;
	vertical-align: bottom;
}
.pointNoteWrap .pointNotebox > .pointNoteTxt{
	padding-left: 0;
	vertical-align: middle;
}

.pointBlock >*:last-child{
	margin-bottom: 0;
}

/*----------------------------------------------------------
.presentBlock
----------------------------------------------------------*/
.presentBlockWap{
	background: #fff;
	border-radius: 10px;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	-o-border-radius: 10px;
	-ms-border-radius: 10px;
}
.presentBlock{
	padding: 50px;
}
.uAccType02 .presentBlock{
	padding: 40px;
}
.presentBlock > *:not(:last-child){
	margin-bottom: 24px;
}
.presentBlock .preTerms01 > *:not(:last-child){
	margin-right: 40px;
}

/*----------------------------------------------------------
.subscriptionBlock
----------------------------------------------------------*/
.subscriptionBlock{
	padding: 60px 0;
}
.subscriptionBlock > *:not(:last-child){
	margin-bottom: 50px;
}
.subscriptionBlock .subscTitle{
	text-align: center;
}
.subscriptionBlock .subscBtnArea{
	margin-bottom: 40px;
	text-align: center;
}
.subscriptionBlock .subscBtnArea > *{
	display: inline-block;
}
.subscriptionBlock .subscBtnArea > *:not(:last-child){
	margin-right: 18px;
}
.subscriptionBlock .subscBtnArea .redBtn04{
	margin-top: 14px;
}
.subscriptionBlock .subscBtnArea .redBtn04 a{
	font-size: 1.285rem;/* 18px */
	width: 285px;
}
.subscriptionBlock .subscBtnArea .redBtn04 sup,
.subscriptionBlock .subscBtnArea .redBtn04 sub{
	font-size: 60%;
}
.subscriptionBlock .subscBtnArea.BtnBlockL .redBtn04{
	margin-top: 30px;
}
.subscriptionBlock .subscBtnArea.BtnBlockL .redBtn04 a{
	font-size: 2rem;/* 28px */
	width: 330px;
}
/*----------------------------------------------------------
.floatBtn
----------------------------------------------------------*/
.floatBtn{
	padding: 0 35px;
}

/*----------------------------------------------------------
accordion
----------------------------------------------------------*/
/* .uAccType01 */
.uAccType01{
	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.714rem;/* 24px */
	font-weight: bold;
	text-align: center;
}
.uAccType01 .accordionBoxTitle .iconTypeACD{
	width: 31px;
	height: auto;
	display: inline-block;
	margin-right: 12px;
}
.uAccType01 .accordionBox{
	margin: 0 16px 0;
	padding: 30px 15px 20px;
	border-top: 2px dotted #eee;
}

/* .uAccType02 */
.uAccType02{
	margin-bottom: 50px;
	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: -10px;
	border-right: 10px solid #fde5e5;
	border-left: 10px solid #fde5e5;
	border-bottom: 10px solid #fde5e5;
}
.uAccType02 .accordionBoxTitle{
	position: relative;
}
.uAccType02.act .accordionBoxTitle{
    margin: 0 -10px;
}
.uAccType02 .accordionBoxTitle .iconTypeACD{
	position: absolute;
	display: block;
	width: 70px;
	height: 70px;
	right: 20px;
    top: 50%;
    margin-top: -35px;
	background: #fff;
	border-radius: 5px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	-o-border-radius: 5px;
	-ms-border-radius: 5px;
}
.uAccType02 .accordionBox{
}
/*----------------------------------------------------------
detailsArea
----------------------------------------------------------*/
#contents .detailsArea section{
	margin: 0;
}
.detailsArea{
	padding: 30px;
	margin: 60px 0;
	background: #fff;
}
/* .cautionsBoxWrap */
.detailsArea > *{
	margin-bottom: 50px;
}

/*----------------------------------------------------------
#basicInfo/#inquiry
----------------------------------------------------------*/
#contents .osusumeImgBlock01 img {
	height: 30px;
}

/*----------------------------------------------------------
accordion Image adjustment
----------------------------------------------------------*/
/* .ImgColType01 */
.ImgColType01{
	margin: 0 auto 10px;
	display: table;
}
.ImgColType01 > *{
	width: 242px;
	padding-right: 20px;
	display: table-cell;
	vertical-align: middle;
}
.ImgColType01 .ImgIcon01{
	width: 44px;
}
.ImgColType01 > *:last-child{
	width: 222px;
	padding-right: 0;
}
/* .ImgColType02 */
.ImgColType02{
	margin: 0 auto;
	display: table;
}
.ImgColType02 > *{
	width: 280px;
	padding-right: 48px;
	display: table-cell;
	vertical-align: top;
}
.ImgColType02 > *:last-child{
	width: 232px;
	padding-right: 0;
}

/* .ImgColType03 */
.ImgColType03{
	margin: 0 50px 0 54px;
	display: table;
}
.ImgColType03 > *{
	display: table-cell;
}
.ImgColType03 .ColImg{
	width: 230px;
	vertical-align: top;
}
.ImgColType03 .ColImg.layoutType01{
	text-align: right;
}
.ImgColType03 .ColTxt{
	padding-left: 45px;
	vertical-align: middle;
}
.ImgColType03 .ColTxt .fSizM{
	font-size: 1.5rem;/* 21px */
}
.ImgColType03 .ColTxt .fSizL{
	font-size: 2.142rem;/* 30px */
}

/* .ImgColType04 */
.ImgColType04{
	height: 270px;
	text-align: center;
}
.ImgColType04 .Col04Txt{
	font-size: 1.142rem;/* 16px */
	font-weight: bold;
}
.ImgColType04 .Col04Img{
	display: table;
	height: 100%;
}
.ImgColType04 .Col04Img > *{
	display: table-cell;
	vertical-align: middle;
}

/* .ImgColType05 */
.ImgColType05{
	margin: 0 auto;
	display: table;
}
.ImgColType05 > *{
	width: 227px;
	padding-right: 27px;
	display: table-cell;
	vertical-align: middle;
}
.ImgColType05 > *:last-child{
	width: 200px;
	padding-right: 0;
}

/* .ImgColType06 */
.ImgColType06{
	margin: 0 auto;
	display: table;
}
.ImgColType06 > *{
	width: 280px;
	padding-right: 70px;
	display: table-cell;
	vertical-align: middle;
}
.ImgColType06 > *:last-child{
	width: 210px;
	padding-right: 0;
}

/***********************************************************
parts
***********************************************************/
/* .disTable */
.disTablePc{	display: table;}
.disTablePc > *{	display: table-cell;}

/* .floatPc */
.floatPc::after{
	content: "";
	clear: both;
	display: block;
}
.floatPc > *{
	float: left;
}

/* inner */
.Inn20{	padding: 0 20px !important;}
.autoCenter{
    margin-right: auto !important;
    margin-left: auto !important;
}
/* .mg */
.mg-B0{	margin-bottom: 0 !important;}
.mg-B20{	margin-bottom: 20px !important;}
.pd-L30{	padding-left: 30px !important;}
.mgType01{	margin-top: 120px !important;}

/* .textType01 */
.textType01,.textType05{	font-size: 1.5rem !important;/* 21px */}
.textType02{	font-size: 1.714rem !important;/* 24px */}
.textType03{	font-size: 1.857rem !important;/* 26px */}
.textType04{	font-size: 1.428rem !important;/* 20px */}

/* .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: 10px !important;
	-webkit-border-radius: 10px !important;
	-moz-border-radius: 10px !important;
	-o-border-radius: 10px !important;
	-ms-border-radius: 10px !important;
}
/* .boxType01*/
.boxType01{
	padding: 20px;
	margin-bottom: 20px;
	text-align: center;
	line-height: 1.3;
	font-size: 1.714rem;/* 24px */
	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: 1.5rem;/* 21px */
	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: 2.142rem;/* 30px */
}
/* .boxType02*/
.boxType02{
	padding: 25px;
	font-size: 1.142rem;/* 16px */
	text-align: center;
	border: 5px 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: 1.714rem;/* 24px */
}
/* .boxType03*/
.boxType03{
	padding-bottom: 20px;
}
.boxType03 .boxTypeInn{
	padding: 45px 30px;
	border-right: 10px solid #fce5e5;
	border-left: 10px solid #fce5e5;
	border-bottom: 10px 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: 25px;
}
/* .boxType04*/
.boxType04{
	font-size: 1.285rem;/* 18px */
}
.boxType04 .imgIcon{
	padding: 0 3px 3px;
	vertical-align: middle;
}
/* .boxType05*/
.boxType05{
	padding: 28px 40px ;
	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: 25px;
}

/* .textDecoration */
.textDecoration01{
	margin: 8px 0px 5px;
	background: linear-gradient(to bottom, transparent 12px, #dfdfdf 12px, #dfdfdf 15px, transparent 15px);
	text-align: center;	
}
.decorationInner01{
	display: inline-block;
	padding: 0 30px;
	font-size: 1.714rem;/* 24px */
	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-weight: bold;
	border-radius: 10px;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	-o-border-radius: 10px;
	-ms-border-radius: 10px;
	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.5rem;
	font-weight: bold;
	padding-left: 10px;
	position: relative;
}
.columnlinkBox01 a:before{
	content: '';
	display: block;
	position: absolute;
	left: -15px;
	top: 50%;
	width: 10px;
	height: 10px;
	margin-top: -10px;
	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%;
}

/*----------------------------------------------------------
fixBox
----------------------------------------------------------*/
.fixBox{
	position: fixed;
	left: 0;
	bottom: 0;
	width: 100%;
	padding: 15px 0;
	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{
	display: table;
	width: 980px;
	max-width: 1000px;
	margin: 0 auto;
}
.fixcolumn{
	display: table-cell;
	vertical-align: middle;
	width: 33.3%;
	text-align: center;
	padding-left: 12px;
}
.fixcolumn.fixBtn01 a{
	font-size: 1.714rem;/* 24 */
}
a.fixBoxTxtLink01{
	display: inline-block;
    padding-left: 32px;
	text-indent: -32px;
	text-align: left;
	font-size: 1.142rem;
	font-weight: bold;
}
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: 22px;
	height: 14px;
	display: inline-block;
	vertical-align: middle;
	margin-right: 10px;
}
#returnTopSP{	bottom: 160px;}
#copyright{	padding-bottom: 150px;}


/*
print
---------------------------------------------------------*/
@media print{
	#floatBox{
		display: none;
	}
}
