@charset "utf-8";

/* ======================================================
 * colorbox.css
 * ------------------------------------------------------
 * SETTING **********************************************
 * Default
 * Custom
 * COLORBOX *********************************************
 * Layout
 * Module
 * MEDIA ************************************************
 * Responsive
 * - width <= 1920px
 * Smartphone
 * - width <= 736px
 * Print
 * ClearFix
====================================================== */

/********************************************************

  SETTING

********************************************************/

/* Default
------------------------------------------------------ */
/*
    Colorbox Core Style:
    The following CSS is consistent between example themes and should not be altered.
*/
#colorbox, #cboxOverlay, #cboxWrapper{position:absolute; top:0; left:0; z-index:9999; overflow:hidden;}
#cboxWrapper {max-width:none;}
#cboxOverlay{position:fixed; width:100%; height:100%;}
#cboxMiddleLeft, #cboxBottomLeft{clear:left;}
#cboxContent{position:relative;}
#cboxLoadedContent{overflow:auto; -webkit-overflow-scrolling: touch;}
#cboxTitle{margin:0;}
#cboxLoadingOverlay, #cboxLoadingGraphic{position:absolute; top:0; left:0; width:100%; height:100%;}
#cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow{cursor:pointer;}
.cboxPhoto{float:left; margin:auto; border:0; display:block; max-width:none; -ms-interpolation-mode:bicubic;}
.cboxIframe{width:100%; height:100%; display:block; border:0; padding:0; margin:0;}
#colorbox, #cboxContent, #cboxLoadedContent{box-sizing:content-box; -moz-box-sizing:content-box; -webkit-box-sizing:content-box;}

/* 
    User Style:
    Change the following styles to modify the appearance of Colorbox.  They are
    ordered & tabbed in a way that represents the nesting of the generated HTML.
*/
#cboxOverlay{background:#fff; opacity: 0.9; filter: alpha(opacity = 90);}
#colorbox{outline:0;}
    #cboxContent{margin-top:32px; overflow:visible; background:#000;}
        .cboxIframe{background:#fff;}
        #cboxError{padding:50px; border:1px solid #ccc;}
        #cboxLoadedContent{background:#000; padding:1px;}
        #cboxLoadingGraphic{background:url(/memberservice/pc/v1/cardapply/img/form_loading_ic02.gif) no-repeat center center;}
        #cboxLoadingOverlay{background:#000;}
        #cboxTitle{position:absolute; top:-22px; left:0; color:#000;}
        #cboxCurrent{position:absolute; top:-22px; right:205px; text-indent:-9999px;}

        /* these elements are buttons, and may need to have additional styles reset to avoid unwanted base styles */
        #cboxPrevious, #cboxNext, #cboxSlideshow, #cboxClose {border:0; padding:0; margin:0; overflow:visible; text-indent:-9999px; width:20px; height:20px; position:absolute; top:-20px; background:url(/memberservice/pc/v1/cardapply/img/form_controls_ic01.png) no-repeat 0 0;}
        
        /* avoid outlines on :active (mouseclick), but preserve outlines on :focus (tabbed navigating) */
        #cboxPrevious:active, #cboxNext:active, #cboxSlideshow:active, #cboxClose:active {outline:0;}

        #cboxPrevious{background-position:0px 0px; right:44px;}
        #cboxPrevious:hover{background-position:0px -25px;}
        #cboxNext{background-position:-25px 0px; right:22px;}
        #cboxNext:hover{background-position:-25px -25px;}
        #cboxClose{background-position:-50px 0px; right:0;}
        #cboxClose:hover{background-position:-50px -25px;}
        .cboxSlideshow_on #cboxPrevious, .cboxSlideshow_off #cboxPrevious{right:66px;}
        .cboxSlideshow_on #cboxSlideshow{background-position:-75px -25px; right:44px;}
        .cboxSlideshow_on #cboxSlideshow:hover{background-position:-100px -25px;}
        .cboxSlideshow_off #cboxSlideshow{background-position:-100px 0px; right:44px;}
        .cboxSlideshow_off #cboxSlideshow:hover{background-position:-75px -25px;}

/* Common
------------------------------------------------------ */
/* hover */
.cb_layout01 #cboxClose:hover {
	opacity: 0.8;
	filter: alpha(opacity=80);
	-ms-filter: "alpha(opacity=80)";
	zoom: 1;
}

/* transition */
.cb_layout01 #cboxClose:hover,
#pageContainer.cb_active {
	-webkit-transition: all 0.3s ease 0s;
	   -moz-transition: all 0.3s ease 0s;
	     -o-transition: all 0.3s ease 0s;
	        transition: all 0.3s ease 0s;
}

/* webview for iOS9.x */
#cboxOverlay {
	-webkit-transform: translate3d(0,0,0);
	-moz-transform: translate3d(0,0,0);
	-ms-transform: translate3d(0,0,0);
	-o-transform: translate3d(0,0,0);
	transform: translate3d(0,0,0);
}
#colorbox {
	-webkit-transform: translate3d(0,0,1px);
	-moz-transform: translate3d(0,0,1px);
	-ms-transform: translate3d(0,0,1px);
	-o-transform: translate3d(0,0,1px);
	transform: translate3d(0,0,1px);
}



/* Custom
------------------------------------------------------ */
#colorbox,
#cboxWrapper {
	overflow: visible;
}
#cboxContent,
#cboxLoadedContent,
#cboxLoadingOverlay {
	background-color: #fff;
}
#cboxLoadingGraphic {
	background: none;
}
#cboxPrevious,
#cboxNext,
#cboxClose { background: none; }

#colorbox.cb_layout01 {
	-webkit-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.2);
	   -moz-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.2);
	    -ms-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.2);
	     -o-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.2);
	        box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.2);
	overflow: visible !important;
}
.cb_layout01 #cboxWrapper {
	overflow: visible;
}
.cb_layout01 #cboxContent {
	margin-top: 0;
}
.cb_layout01 #cboxLoadedContent {
	padding: 0;
	border: none;
	background-color: #ffffff;
	overflow: visible !important;
}
.cb_layout01 #cboxPrevious,
.cb_layout01 #cboxNext,
.cb_layout01 #cboxClose {
	display: none !important;
}



/********************************************************

  COLORBOX

********************************************************/

/* Layout
------------------------------------------------------ */
#cb_page {
	padding: 30px;
}
#cb_head {
	clear: both;
}
#cb_main {
	clear: both;
}
#cb_foot {
	clear: both;
	margin: 20px 0 0 0;
}
#cb_foot .btnLink01 {
	text-align: center;
}
#cb_head > *:first-child,
#cb_main > *:first-child,
#cb_foot > *:first-child {
	margin-top: 0 !important;
}

.cb_page,
.cb_page_zipaddress ,
.cb_page_zipaddress02 {
	position: relative;
	padding: 30px;
}
.cb_page_zipaddress ,
.cb_page_zipaddress02 {
	height: 100%;
}
.cb_head,
.cb_head_zipaddress {
	clear: both;
}
.cb_main,
.cb_main_zipaddress {
	clear: both;
}
.cb_foot,
.cb_foot_zipaddress {
	clear: both;
	margin: 20px 0 0 0;
}
.cb_foot .btnLink01 {
	text-align: center;
}
[class^="cb_head"] > *:first-child,
[class^="cb_main"] > *:first-child,
[class^="cb_foot"] > *:first-child {
	margin-top: 0 !important;
}
#cboxOverlay.type-black {
	background-color: #000;
}


/* Module
------------------------------------------------------ */
.cb_inline_container {
	display: none;
}

.cb_hdg01 {
	margin: 0 0 20px 0;
	padding: 0 0 0.25em 0;
	border-bottom: 2px solid #333333;
	font-size: 20px;
	font-size: 2.0rem;
}
.cb_hdg01 > .small {
	font-size: 70%;
}
.cb_hdg02 {
	margin: 0 0 40px 0;
	padding: 10px;
	text-align: center;
	font-weight: bold;
	font-size: 20px;
	font-size: 2.0rem;
	background: #a5001e;
	color: #fff;
}
.cb_desc01 {
	margin: 1em 0 0 0;
	text-align: left;
}
.cb_caution {
	margin: 1em 0 0.5em;
	color: #a5001e;
	font-size: 16px;
	font-size: 1.6rem;
}
.cb_list01 {
	margin: 1em 0 0 0;
}
.cb_list01#workDivisionList {
	padding-bottom: 10px;
}
.cb_list01 > li {
	position: relative;
	padding: 0 0 0 1em;
	font-size: 16px;
	font-size: 1.6rem;
}
.cb_list01 > li + li {
	margin-top: 0.75em;
}
.cb_list01#workDivisionList > li {
	float: left;
	width: 23.5%;
	margin: 0 0 0 2%;
}
.cb_list01#workDivisionList > li + li {
	margin-top: 0;
}
.cb_list01#workDivisionList > li:nth-child(4n+1) {
	clear: left;
	margin-left: 0;
}
.cb_list01#workDivisionList > li:nth-child(n+5) {
	margin-top: 0.75em;
}
.cb_list01 > li:before {
	content: "";
	position: absolute;
	left: 0;
	top: 0.6em;
	display: block;
	width: 7px;
	height: 1px;
	background-color: #777;
}
.cb_list01 > li > a {
	color: #003399;
	text-decoration: underline;
	cursor: pointer;
}
.cb_list01 > li > a:hover {
	color: #0077ff;
	text-decoration: none;
}
.cb_close {
	position: absolute;
	right: -20px;
	top: -20px;
	display: block;
	width: 40px;
	height: 40px;
	margin: 0;
	padding: 0;
	border: none;
	background: url(/memberservice/pc/v1/cardapply/img/form_ic12.png) no-repeat 0 0;
	text-indent: -9999px;
	outline: none;
	cursor: pointer;
}

.modalLoading {
	width: 100%;
	height: 320px;

	background: url(/memberservice/pc/v1/cardapply/img/form_loading_ic02.gif) no-repeat 50% 50%;
	text-indent: -9999px;
}
.modalLoading ~ * {
	display: none;
}

input#modalZipInput,
input#modalAddressInput {
	width: 100%;
	height: 65px;
	padding: 12px 15px 5px;
	border-width: 1px;
	border-style: solid;
	border-color: #ababab;
	-webkit-border-radius: 9px;
	   -moz-border-radius: 9px;
	    -ms-border-radius: 9px;
	     -o-border-radius: 9px;
	        border-radius: 9px;
	background-color: #fff;
	-webkit-box-shadow: 0px 2px 3px 0px rgba(0,0,0,0.15) inset;
	   -moz-box-shadow: 0px 2px 3px 0px rgba(0,0,0,0.15) inset;
	    -ms-box-shadow: 0px 2px 3px 0px rgba(0,0,0,0.15) inset;
	     -o-box-shadow: 0px 2px 3px 0px rgba(0,0,0,0.15) inset;
	        box-shadow: 0px 2px 3px 0px rgba(0,0,0,0.15) inset;
	color: #444444;
	font-size: 20px;
	font-size: 2.0rem;
	line-height: 1.25;
	-webkit-appearance: none;
}
select#modalPrefSel {
	width: 100%;
	height: 65px;
	padding: 12px 30px 5px 15px;
	border-width: 1px;
	border-style: solid;
	border-color: #ababab;
	-webkit-border-radius: 9px;
	   -moz-border-radius: 9px;
	    -ms-border-radius: 9px;
	     -o-border-radius: 9px;
	        border-radius: 9px;
	background-color: #fff;
	-webkit-box-shadow: 0px 2px 3px 0px rgba(0,0,0,0.15) inset;
	   -moz-box-shadow: 0px 2px 3px 0px rgba(0,0,0,0.15) inset;
	    -ms-box-shadow: 0px 2px 3px 0px rgba(0,0,0,0.15) inset;
	     -o-box-shadow: 0px 2px 3px 0px rgba(0,0,0,0.15) inset;
	        box-shadow: 0px 2px 3px 0px rgba(0,0,0,0.15) inset;
	color: #444444;
	font-size: 20px;
	font-size: 2.0rem;
	line-height: 1.25;
	-webkit-appearance: none;
}

.modalEntry {
	margin: 1.5em 0 0 0;
}
.modalEntry > dt {
	margin: 0 0 0.5em 0;
	font-size: 16px;
	font-size: 1.6rem;
}
.modalEntry > dd {
}
.modalEntry > dd > *:first-child {
	margin-top: 0 !important;
}
.modalEntry > dd .ex {
	margin: 0.5em 0 0 0;
	padding: 0 0 0 2em;
	text-indent: -2em;
}
.modalEntry + .btnLink01 {
	margin-top: 1.5em;
	text-align: center;
}
.modalEntry + .btnLink01 a {
	min-width: 200px;
}

#modalAddressZip {
	font-size: 16px;
	font-size: 1.6rem;
}

#modalAddressList {
	margin: 1.5em 0 0 0;
}
#modalAddressList > li {
	position: relative;
	padding: 0 0 0 1em;
	font-size: 16px;
	font-size: 1.6rem;
}
#modalAddressList > li + li {
	margin-top: 0.75em;
}
#modalAddressList > li:before {
	content: "";
	position: absolute;
	left: 0;
	top: 0.6em;
	display: block;
	width: 7px;
	height: 1px;
	background-color: #777;
}
#modalAddressList > li > a {
	color: #003399;
	text-decoration: underline;
	cursor: pointer;
}
#modalAddressList > li > a:hover {
	color: #0077ff;
	text-decoration: none;
}

#cb_page.adjustHeight {
	height: 100%;
}
#cb_page.adjustHeight #cb_main {
	height: 85%;
}
#mail_magazine_modal {
	max-height: 560px;
	height: 100%;
	overflow-y: scroll;
}
#mail_magazine_modal .mail_magazine_modal_Inner {
	height: 100%;
}
#mail_magazine_modal .mail_magazine_modal_Inner figure {
	text-align: center;
}


/********************************************************

  MEDIA

********************************************************/

/* Resposive
------------------------------------------------------ */
@media screen and (min-width: 1025px) and (max-width: 1920px) {
}
@media screen and (max-width: 1920px) {
}
@media screen and (max-width: 1536px) {
}
@media screen and (max-width: 1280px) {
}
@media screen and (max-width: 1080px) {
}
@media screen and (max-width: 1024px) {
}
@media screen and (max-width: 960px) {
}
@media screen and (max-width: 800px) {
}


/* Tablet
------------------------------------------------------ */
@media screen and (max-width: 768px) {
}
@media screen and (max-width: 736px) {
}
@media screen and (max-width: 667px) {
}


/* Smartphone
------------------------------------------------------ */
@media screen and (max-width: 750px) {
.cb_hdg02 {
	margin: 0 0 30px 0;
	padding: 10px;
	text-align: center;
	font-weight: bold;
	font-size: 16px;
	font-size: 1.6rem;
	background: #a5001e;
	color: #fff;
}

	#colorbox.cb_layout01 {
		max-width: 100% !important;
	}
	#colorbox.cb_layout01 * {
		max-width: 100% !important;
	}
	#colorbox.cb_layout01.type-popup {
		width: 90% !important;
	}
	select#modalPrefSel {
		width: 100%;
		height: 50px;
		padding: 8px 28px 5px 14px;
		border-width: 1px;
		border-style: solid;
		border-color: #ababab;
		-webkit-border-radius: 9px;
			 -moz-border-radius: 9px;
				-ms-border-radius: 9px;
				 -o-border-radius: 9px;
						border-radius: 9px;
		background-color: #fff;
		-webkit-box-shadow: 0px 1px 2px 0px rgba(0,0,0,0.15) inset;
			 -moz-box-shadow: 0px 1px 2px 0px rgba(0,0,0,0.15) inset;
				-ms-box-shadow: 0px 1px 2px 0px rgba(0,0,0,0.15) inset;
				 -o-box-shadow: 0px 1px 2px 0px rgba(0,0,0,0.15) inset;
						box-shadow: 0px 1px 2px 0px rgba(0,0,0,0.15) inset;
		color: #444444;
		font-size: 1.6rem;
		line-height: 1.25;
		-webkit-appearance: none;
	}
	input#modalZipInput,
	input#modalAddressInput {
		width: 100%;
		height: 50px;
		padding: 10px 14px 5px;
		border-width: 1px;
		border-style: solid;
		border-color: #ababab;
		-webkit-border-radius: 9px;
			 -moz-border-radius: 9px;
				-ms-border-radius: 9px;
				 -o-border-radius: 9px;
						border-radius: 9px;
		background-color: #fff;
		-webkit-box-shadow: 0px 1px 2px 0px rgba(0,0,0,0.15) inset;
			 -moz-box-shadow: 0px 1px 2px 0px rgba(0,0,0,0.15) inset;
				-ms-box-shadow: 0px 1px 2px 0px rgba(0,0,0,0.15) inset;
				 -o-box-shadow: 0px 1px 2px 0px rgba(0,0,0,0.15) inset;
						box-shadow: 0px 1px 2px 0px rgba(0,0,0,0.15) inset;
		color: #444444;
		font-size: 1.6rem;
		line-height: 1.25;
		-webkit-appearance: none;
	}
	
	.cb_list01#workDivisionList > li {
		float: none;
		width: 100%;
		margin: 0;
	}
	.cb_list01#workDivisionList > li + li {
		margin-top: 0.75em;
	}
	
	
}
@media screen and (max-width: 640px) {
}
@media screen and (max-width: 568px) {
}
@media screen and (max-width: 480px) {
}
@media screen and (max-width: 414px) {
}
@media screen and (max-width: 375px) {
}
@media screen and (max-width: 320px) {
}


/* Print
------------------------------------------------------ */
@media print {
	#pageContainer.cb_active {
		display: none !important;
	}
	#cboxOverlay {
		background: #ffffff !important;
	}
	#colorbox {
		left: 0 !important;
		top: 0 !important;
		z-index: 9999 !important;
	}
	#colorbox,
	#cboxWrapper,
	#cboxContent,
	#cboxLoadedContent {
		height: auto !important;
		overflow: visible !important;
	}
	#cboxPrevious,
	#cboxNext,
	#cboxClose {
		display: none !important;
	}
}


/* ClearFix
------------------------------------------------------ */
.cb_list01#workDivisionList:after {
	content: "";
	display: table;
	clear: both;
}
.cb_list01#workDivisionList {
	zoom: 1;
}