@charset "utf-8";
/**
 * style 
 * (c) FOURDIGIT Inc.
 *
 * 1. import
 * 2. html, body
 * 3. HTMLtag, siteCommonClass
 * 4. Layout
 * 5. EachPageStyle
 *
 */
/**
 * 1. import
 */
@import "import/reset.css";
@import "import/util.css";
@import "../ext_ci/ci.css";

/**
 * 2. html, body
 */
	body {
		background-color: #fff;
		background-image: url(../imgs/space.gif);
		background-repeat: repeat-x;
		background-position: center top;
	}
	.page {
		color: #333333;
		font-size: 12px;
		line-height: 1.5;
		/*letter-spacing: 0.1em;*/
		padding-top:96px !important;
		font-family:'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','メイリオ',Meiryo,'ＭＳ Ｐゴシック',sans-serif;
	}
	@media only screen and (max-width:768px) {
		.page{
			padding-top:77px !important;
		}
	}
	
	/* IE9+ & modern browser */
	*::selection {
		color: #fff;
		background: #333;
	}
	*::-moz-selection {
		color: #fff;
		background: #333;
	}
/**
 * 3. HTMLtag, siteCommonClass
 */
/* anchor */
	a {
		background-color: transparent;
		background-image: none;
		background-repeat: no-repeat;
		background-position: top left;
		color: #0000ff;
	    text-decoration: none;
	}
	a:visited {}
	a:hover {
		color: #ff0000;
		background-position: bottom right;
		text-decoration: underline;
	}
	a:active {}

	@media only screen and (max-width:768px) {
		.base #container #mainContent{
			margin:0;
		}
	}
	

/* heading */
#gNav{
	margin-top:1px;
}
#gNav > ul > li > a, 
#gNav > ul > li > strong{
    padding: 0px 25px 22px;
}
	#next40Hdr .next_Title {
		float: left;
		margin-right: 45px;
	}
	.photo {
		border-bottom: #d7d7d7 solid 1px;
	}
	.sttl {
		font-size: 12px;
		font-weight: bold;
		margin-bottom: 10px;
	}
	.sp-fSize,
	.pNav__fSize{
		display:none;
	}

/* cap */
	.cap,
	.caption {
		background: none;
		color: #666666;
		font-size: 10px;
		line-height: 15px;
	}
	.cap {
		padding-top: 5px;
	}

/**
 * 4. Layout
 */
	body #next40Hdr {
		padding: 35px 0;
		background-color:#f0f2f3;
		margin-bottom: 30px;
		text-align:center;
		/*border-top:solid 1px #e5e5e5;*/
	}
	body #next40Hdr .wrap {
	}
	body .shldrTxt {
		font-size: 16px;
		padding-top: 10px;
		letter-spacing: 0.1em;
	}
	.base #container {
		width: 1180px;
		margin-right: auto;
		margin-left: auto;
		background-color: transparent;
		text-align: left;
	}

	body #gFooter {
		margin-top: 40px;
	}

	.pageTop {
		position: fixed;
		right: 20px;
		bottom: 20px;
	}
	.pageTop:hover {
		opacity: 0.8;
		filter: alpha(opacity=80); /* IE lt 8 */
		-ms-filter: "alpha(opacity=80)"; /* IE 8 */
	}
	#gFooter .utilityLinkBlock {
		padding-top: 10px;
		border-top:1px solid #abbcce;
		border-bottom:1px solid #abbcce;
	}
	#gFooter .linkList {
		width:960px;
		margin:0 auto;
	}
	#gFooter .linkList ul {
		margin:0 20px 6px;
	}
	#gFooter .linkList .linklist01 {
		float:left;
	}
	#gFooter .linkList .linklist02 {
		float:right;
	}
	#gFooter .linkList li {
		float:left;
		font-size:10px;
		margin:0 10px;
	}
	#gFooter .linkList li a {
		color:#4e6a89;
	}
	#gFooter .linkList li a:hover {
		text-decoration:none;
	}
	
	#cigrCommonFooter {
		width: 1160px;
		margin-left: auto;
		margin-right: auto;
	}
	
	@media only screen and (max-width:1180px) {
		.base #container { width: auto;}
		#mainContent img { max-width: 100%;}
		#cigrCommonFooter { width: auto;}
	}
	@media only screen and (max-width:960px) {
		#gFooter .linkList { width: auto;}
		#gFooter .linkList ul { margin:0;}
		#gFooter .utilityLinkBlock { padding-bottom: 10px;}
	}
	@media only screen and (max-width:768px) {
		#gFooter .linkList .linklist01 { float: none;}
		#gFooter .linkList .linklist02 { float: none;}
		#gFooter .linkList li { float: none; display: block; margin: 0; text-align: center;}
		#gFooter .linkList li a { display: block; padding: 7px; text-decoration: none; border-top: #abbcce solid 1px;}
		#gFooter .utilityLinkBlock { padding-bottom: 0px;  border-top: none;}
	}
	@media only screen and (max-width:720px) {
		body #next40Hdr .wrap { width: auto; text-align: center;}
		#next40Hdr .next_Title { float: none; margin-right: 0px; margin-bottom: 5px;}
		#next40Hdr .next_Title img { max-width: 60%;}
		body .shldrTxt { font-size: 10px; padding-top: 10px; letter-spacing: 0;}
		/*#mainContent br { display: none;}*/
	}
	@media only screen and (max-width:599px) {
		#mainContent { padding-left: 10px; padding-right: 10px;}
	}

	.contentsHeader{
		box-sizing: border-box;
		width: 100%;
		padding: 0 10px;
	}
	@media only screen and (min-width:769px) {
		.contentsHeader{
			max-width: 1200px;
			padding: 0 20px;
			margin: 0 auto;
		}
	}
	.contentsHeader__snsList{
		text-align: right;
		margin: 0 0 5px;
	}
	@media only screen and (min-width:769px) {
		.contentsHeader__snsList{
			text-align: right;
			margin: 0 0 15px;
		}
	}
	.contentsHeader__snsItem{
		display: inline-block;
		vertical-align: middle;
	}
	.contentsHeader__breadcrumbList{
		margin: 0 0 10px;
	}
	@media only screen and (min-width:769px) {
		.contentsHeader__breadcrumbList{
			margin: 0 0 30px;
		}
	}
	.contentsHeader__breadcrumbItem{
		display: inline-block;
	}
	.contentsHeader__breadcrumbItem:after{
		content: '>';
		display: inline-block;
		padding: 0 10px 0 15px;
	}
	.contentsHeader__breadcrumbItem:last-child:after{
		display: none;
	}
	.contentsHeader__breadcrumbItem a{
		color: #333;
		text-decoration: none;
	}

	.tabMenu{
		width: 100%;
		border-bottom: 1px solid #e5e5e5;
		margin: 0 0 15px;
	}
	@media only screen and (min-width:769px) {
		.tabMenu{
			margin: 0 0 40px;
		}
	}
	.tabMenu__list{
		text-align: center;
	}
	.tabMenu__item{
		display: inline-block;
		margin: 0 5px;
	}
	.tabMenu__item a{
		text-align: center;
		min-width: 80px;
		color: #333;
		display: block;
		text-decoration: none;
		line-height: 40px;
	}
	.tabMenu__item a.current{
		border-bottom: 5px solid #a8b5bc;
	}
	.tabMenu__item a:hover{
		border-bottom: 5px solid #a8b5bc;
	}
	.tabMenu__item a .normal{
		display: block;
	}
	.tabMenu__item a:hover .normal{
		display: none;
	}
	.tabMenu__item a .active{
		display: none;
	}
	.tabMenu__item a:hover .active{
		display: block;
	}

	@media only screen and (max-width:769px) {
		.tabMenu__item a:hover{
			border-bottom: 5px solid #fff;
			color:#333;
		}
		.tabMenu__item a:hover .active{
			display: none;
		}
		.tabMenu__item a:hover .normal{
			display: block;
		}
	}


    /* mainContent 



     */
    body .clmBox .wrapper {
        zoom: 1;
    }
    body .clmBox .wrapper:after { content:"."; display: block; height:0px; clear:both; line-height:0; visibility:hidden; }

    /* sNavArea */
	@media only screen and (min-width:769px) and (max-width:1199px){
	    body #mainContent .sNavArea {
	        float: left;
	        width: 25%;
	    }
	}
	@media only screen and (min-width:1200px) {
	    body #mainContent .sNavArea {
	        float: left;
	        width: 275px;
	    }
	}
    body #mainContent .sNavArea h4 {
        font-size: 18px;
        line-height: 24px;
        color: #212121;
        border-top: 1px solid #ebebeb;
    }
    body #mainContent .sNavArea h4 a {
        padding: 15px 20px;
        color: #212121;
        width: 100%;
        display: inline-block;
        overflow: hidden;
        height: 57px;
        box-sizing: border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; -ms-box-sizing:border-box; -o-box-sizing:border-box;
        /* transition */
        -webkit-transition: .3s;
        transition: .3s;
    }
    body #mainContent .sNavArea h4.on span {
        padding: 15px 20px;
        color: #212121;
        width: 100%;
        display: inline-block;
        overflow: hidden;
        height: 57px;
        border-top: 5px solid #777;
        box-sizing: border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; -ms-box-sizing:border-box; -o-box-sizing:border-box;
    }
    body #mainContent .sNavArea h4.on a,
    body #mainContent .sNavArea h4 a:hover {
        border-top: 5px solid #777;
    }
    body #mainContent .sNavArea h3 {
        font-size: 12px;
        line-height: 18px;
        color: #333;
        padding: 15px 20px;
        background-color: #f3f3f3;
    }
    body #mainContent .sNavArea h3 a {
        color: #212121;
    }
    body #mainContent .sNavArea h3.on {
        border-top: 5px solid #777;
    }
    body #mainContent .sNavArea ul {
        margin-bottom: 9px;
        border-top: 1px solid #ebebeb;
    }
    body #mainContent .sNavArea ul li {
        margin-bottom: 1px;
    }
    body #mainContent .sNavArea ul li a {
        width: 100%;
        display: inline-block;
        padding: 15px 15px 15px 40px;
        color: #222;
        position:relative;
        box-sizing: border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; -ms-box-sizing:border-box; -o-box-sizing:border-box;
        /* transition */
        -webkit-transition: .3s;
        transition: .3s;
    }
    body #mainContent .sNavArea ul li a:before{
    	content:'>';
    	font-size: 13px;
    	color:#e6e6e6;
    	position:absolute;
    	left:20px;
    	top:50%;
    	-webkit-transform: translateY(-50%); /* Safari用 */
		transform: translateY(-50%);
    }
    body #mainContent .sNavArea ul li.on a,
    body #mainContent .sNavArea ul li a:hover {
        background-color: #92a3ab;
        color: #fff;
    }

    body #mainContent #clmContent {
        padding: 0 10px 50px;
        box-sizing: border-box;
    }

	@media only screen and (min-width:769px) and (max-width:1199px){
	    body #mainContent #clmContent {
	        float: right;
	        width: 75%;
	        font-size: 14px;
	        line-height: 22px;
	    }
	}

	body .Box{
		padding: 30px;
		font-size: 20px;
		line-height: 35px;
		letter-spacing: 0;
		box-sizing: border-box;
		-webkit-box-sizing: border-box;
		-moz-box-sizing: border-box;
		-ms-box-sizing: border-box;
		-o-box-sizing: border-box;
	}

	body .Box.bBox{
		background-color: #f0f2f3;
		color: #000;
	}
	body .Box.bBox span{
		font-size: 14px;
	}


	@media only screen and (min-width:1200px) {
	    body #mainContent #clmContent {
	        float: right;
	        width: 860px;
	        font-size: 14px;
	        line-height: 22px;
	        padding: 0;
	    }
	}

    body #mainContent .clmTitleBox {
        padding: 25px 0 0;
        margin-bottom: 20px;
        color: #333;
        font-size: 30px;
        line-height: 40px;
    }
    body #mainContent .clmTitleBox h3{
    	
    }
    @media only screen and (min-width:769px) {
    	body #mainContent .clmTitleBox {
    		padding: 25px 0;
    	}
    }

    body #mainContent .sTitle {
        display: inline-block;
        border-top: 5px solid #777;
        padding: 15px 5px 0 5px;
        font-size: 24px;
        line-height: 34px;
        margin-bottom: 30px;
    }
    body #mainContent .sTitle span {
        display: block;
    }
    body #mainContent .ssTitle {
        display: block;
        font-size: 18px;
        line-height: 24px;
        margin-bottom: 20px;
    }
    body #mainContent h6 {
        font-size: 14px;
        line-height: 20px;
        font-weight: bold;
        margin-bottom: 15px;
    }
    body #mainContent h6.txtBlue {
        color: #4e6a89;
    }

	br.sp-only {
		display: none;
	}

	@media only screen and (max-width:599px) {

		br.sp-only {
			display: block;
		}
	}


