/* -------------- base_main_sp.css ---------------------*/

/* リンク */
.dev-sp a:link, footer .desc a,
.dev-tb a:link, footer .desc a {
	color:#333;
	text-decoration:underline;
}

.dev-sp a:visited,
.dev-tb a:visited {
	color:#660299;
}

.dev-sp a:hover,
.dev-tb a:hover {
	color:#001280;
	text-decoration:none;
}


.dev-sp .cms-public .layout,
.dev-tb .cms-public .layout {
/*	width:1200px;*/
	margin:0 auto;
}


.dev-sp .contentArticleDoc,
.dev-tb .contentArticleDoc {
	min-height:1px;
}

.dev-sp .cms-public .side_area,
.dev-tb .cms-public .side_area {
	margin:100px 0 50px 0;
}
.dev-sp .cms-public .side_area .parts,
.dev-tb .cms-public .side_area .parts {
	margin-left:80px;
}

.dev-sp .cms-public .side_area .list,
.dev-tb .cms-public .side_area .list {
	width:300px;
}

.dev-sp .cms-public .side_area figure,
.dev-tb .cms-public .side_area figure {
	margin:0;
	padding:0;
}

.dev-sp .cms-public .header_area,
.dev-tb .cms-public .header_area {
	position:relative;
}
/*----------------------------------- ヘッダー -------------------------------------*/
.dev-sp .cms-public .sp_header,
.dev-sp .cms-public .sp_header .header .logo,
.dev-tb .cms-public .sp_header,
.dev-tb .cms-public .sp_header .header .logo {
   display: block;
}

/*----------------------------------- サイドエリア -------------------------------------*/
/* リンク */
.dev-sp .cms-public .relatedlinks a:link,
.dev-tb .cms-public .relatedlinks a:link {
	color:#333;
	text-decoration:underline;
}

.dev-sp .cms-public .relatedlinks figure,
.dev-tb .cms-public .relatedlinks figure {
	margin:0;
	padding:0;
}

.dev-sp .cms-public .relatedlinks .linkblock,
.dev-sp .cms-public .relatedlinks .textlink,
.dev-tb .cms-public .relatedlinks .linkblock,
.dev-tb .cms-public .relatedlinks .textlink {
	width:300px;
	margin-top:0;
	padding-top:0;
}

.dev-sp .cms-public .relatedlinks .linkblock .image,
.dev-tb .cms-public .relatedlinks .linkblock .image {
	border-left:1px solid #00a5bf;
	border-right:1px solid #00a5bf;
	border-top:1px solid #00a5bf;
}
.dev-sp .cms-public .relatedlinks .textlink .list,
.dev-tb .cms-public .relatedlinks .textlink .list  {
	padding-top:15px;
	border-left:1px solid #00a5bf;
	border-right:1px solid #00a5bf;
	border-bottom:1px solid #00a5bf;
}

.dev-sp .cms-public .relatedlinks .block,
.dev-tb .cms-public .relatedlinks .block {
	float:none;
}
.dev-sp .cms-public .side .border_radius,
.dev-tb .cms-public .side .border_radius {
	background-color:#d0ecf4; 
	padding: 10px;
	margin-bottom:10px;
	text-align: center;
	border-radius:10px;
	-webkit-border-radius: 10px;	/* Safari,Google Chrome用 */
	-moz-border-radius: 10px;	/* Firefox用 */
	-ms-border-radius:10px;
}

.dev-sp .cms-public .relatedlinks .cms-public .image .block,
.dev-tb .cms-public .relatedlinks .cms-public .image .block {
	margin:0;
	padding:0;
}
.dev-sp .cms-public .relatedlinks .image,
.dev-tb .cms-public .relatedlinks .image {
	margin:0;
	padding:0;
}

body:not(.dev-mb) .cms-public .relatedlinks h2 {
	border-top-left-radius: 10px; 
	border-top-right-radius: 10px;
	-webkit-border-top-left-radius: 10px;
	-webkit-border-top-right-radius: 10px;
	-moz-border-radius-topleft: 10px;
	-moz-border-radius-topright: 10px; 
	background-color:#00a5bf; 
	color:#fff;
	font-size:1.25em;
	padding:10px 0;
	width:300px;
	text-indent:1em;
	margin-bottom:0;
    margin-left: 0;
	border-left:none;
}

.dev-sp .cms-public .relatedlinks .linkblock .image figure,
.dev-tb .cms-public .relatedlinks .linkblock .image figure {
	margin-top:20px;
	padding:0;
	text-align:center;
}

.dev-sp .cms-public .relatedlinks .textlink ul,
.dev-tb .cms-public .relatedlinks .textlink ul  {
	border-top:1px solid #081f51;
	margin:10px 20px 0 20px;
	padding:20px 0;
}
.dev-sp cms-public .relatedlinks .textlink li,
.dev-tb cms-public .relatedlinks .textlink li {
	list-style-type:none;
	font-size:1em;
	margin-bottom:5px;
    position: relative;
    display: block;
    padding-left: 12px;
}

.dev-sp .cms-public .relatedlinks .textlink li:before,
.dev-tb .cms-public .relatedlinks .textlink li:before {
    content: '';
    width: 0;
    height: 0;
    border: solid 4px transparent;
    border-left: solid 4px #333;
    position: absolute;
    top: 50%;
    left: 0;
    margin-top: -4px;
}

.dev-sp .cms-public .relatedlinks .linkblock .list figure,
.dev-tb .cms-public .relatedlinks .linkblock .list figure  {
	margin:0px;
	padding:0;
}




/*----------------------------------- バナー -------------------------------------*/
.dev-sp .cms-public .side_banner,
.dev-tb .cms-public .side_banner {
	padding:0;
	margin:70px 0 50px 0;
	color #071e50;
}

.dev-sp .cms-public .side_banner li,
.dev-tb .cms-public .side_banner li {
	border-left:6px solid #071e50;
	border-top:1px solid #071e50;
	border-bottom:1px solid #071e50;
	border-right:1px solid #071e50;
	list-style-type:none;
	margin-bottom:10px;
}
.dev-sp .cms-public .side_banner li a,
.dev-tb .cms-public .side_banner li a {
	height:80px;
	width:300px;
	vertical-align: middle;
	display: table-cell;
	padding-left:100px;
	padding-right:20px;
	font-size:1.25em;
	line-height:1.25em;
	color:#071e50;
	text-decoration:none;
	font-weight:bold;
}

.dev-sp .cms-public .side_banner li:first-child a,
.dev-tb .cms-public .side_banner li:first-child a {
	background:url(/file/img/icon_docs.png) 20px center no-repeat;
}
.dev-sp .cms-public .side_banner li a,
.dev-tb .cms-public .side_banner li a {
	background:url(/file/img/icon_sns.png) 20px center no-repeat;
}

.dev-sp .cms-public .side_banner ul,
.dev-tb .cms-public .side_banner ul {
	margin:0;
	padding:0;
}

.cms-public .side_banner list {

}



/*----------------------------------- よくあるご質問 -------------------------------------*/
.dev-sp .cms-public .side_qa,
.dev-tb .cms-public .side_qa {
	background-color:#d0ecf4; 
	padding: 10px;
	margin-bottom:10px;
	text-align: center;
	border-radius:10px;
	-webkit-border-radius: 5px;	/* Safari,Google Chrome用 */
	-moz-border-radius: 5px;	/* Firefox用 */
	-ms-border-radius:5px;
	font-size:1.5em;
	width:280px;
	font-weight:bold;
	margin-bottom:70px;
}

.dev-sp .cms-public .side_qa a:before,
.dev-sp .cms-public .side_qa a:after,
.dev-tb .cms-public .side_qa a:before,
.dev-tb .cms-public .side_qa a::after {
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	margin: auto;
	content: "";
	vertical-align: middle;
}

.dev-sp .cms-public .side_qa a,
.dev-tb .cms-public .side_qa a {
	position: relative;
	display: inline-block;
	padding: 0 0 0 32px;
	color: #333;
	vertical-align: middle;
	text-decoration: none;
	font-size: 1em;
	text-decoration:none;
}

.dev-sp .cms-public .side_qa a:before,
.dev-tb .cms-public .side_qa a:before  {
	box-sizing: border-box;
	width: 24px;
	height: 24px;
	border: 2px solid #333;
	-webkit-border-radius: 50%;
	border-radius: 50%;
}

.dev-sp .cms-public .side_qa a:after,
.dev-tb .cms-public .side_qa a:after {
	left: 6px;
	width: 6px;
	height: 6px;
	border-top: 2px solid #333;
	border-right: 2px solid #333;
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
}

.dev-sp .cms-public .side_qa p,
.dev-tb .cms-public .side_qa p {
	padding:0;
	margin:0;
}
























/*------------------------------------- タイトルリスト ---------------------------------------------*/
.dev-sp .cms-public .title-list,
.dev-tb .cms-public .title-list {
	border: none;
}

.dev-sp .cms-public .title-list li,
.dev-tb .cms-public .title-list li {
	list-style-type:none;
}

.dev-sp .cms-public .title-list .index,
.dev-tb .cms-public .title-list .index  {
	font-size:1em;
	border: none;
}

.dev-sp .cms-public .title-list .index li,
.dev-tb .cms-public .title-list .index li {
	font-size:1.5em;
	font-weight:bold;
	line-height:1.4em;
	color:#081f51;
	/*border-bottom:2px solid #081f51;*/
	background:#fff;
}

.dev-sp .cms-public .title-list .index li.active,
.dev-tb .cms-public .title-list .index li.active {
	padding-left:0;
	/*border-bottom:2px solid #081f51;*/
}

.dev-sp .cms-public .title-list .tab,
.dev-tb .cms-public .title-list .tab {
	border: none;
}
.dev-sp .cms-public .title-list .tab li *,
.dev-tb .cms-public .title-list .tab li * {
	color:#333;
}

.dev-sp .cms-public .title-list .tab ul,
.dev-tb .cms-public .title-list .tab ul {
	padding-left:0;
	margin:20px 0 0;
}

.dev-tb .cms-public .title-list .tab ul li {
	margin-bottom:5px;
	padding-left:148px; /**/
}
.dev-sp .cms-public .title-list .tab ul li {
    margin-bottom: 2em;
    padding-left: 0;
    padding-top: 2em;
}
.dev-sp .cms-public .title-list .tab li,
.dev-tb .cms-public .title-list .tab li {
	/*font-size:1em;*/
}


.dev-tb .cms-public .title-list .title {
/*	margin-left:140px;
	display:block;*/
	display:inline-block;/**/
	margin-left:0;/**/
}
.dev-sp .cms-public .title-list .title {
    display: block;
    margin-left: 0;
}
.dev-sp .cms-public .title-list time,
.dev-tb .cms-public .title-list time  {
    position: absolute;
    padding-left: 12px;
/*	float:left;*/
	top:0;
	left:0;/**/
}


.dev-sp .cms-public .title-list time:before,
.dev-tb .cms-public .title-list time:before {
    content: '';
    width: 0;
    height: 0;
    border: solid 4px transparent;
    border-left: solid 4px #333;
    position: absolute;
    top: 0.5em;
    left: 0;
    margin-top: 0px;
}

.dev-sp .cms-public .title-list .tab ul li .belong,
.dev-tb .cms-public .title-list .tab ul li .belong {
	display:inline-block;
	margin-left:0px;/**/
}


.dev-sp .cms-public .title-list .paging,
.dev-tb .cms-public .title-list .paging {
	font-size:1em;
	color:#333;
	text-align:right;
}

.dev-sp .cms-public .title-list .paging a,
.dev-tb .cms-public .title-list .paging a {
	text-decoration:underline;
}

.dev-sp .cms-public .title-list .paging span.first, 
.dev-sp .cms-public .title-list .paging span.prev, 
.dev-sp .cms-public .title-list .paging span.next, 
.dev-sp .cms-public .title-list .paging span.last,
.dev-tb .cms-public .title-list .paging span.first, 
.dev-tb .cms-public .title-list .paging span.prev, 
.dev-tb .cms-public .title-list .paging span.next, 
.dev-tb .cms-public .title-list .paging span.last {
	color:#333;
	border:none;
}
.dev-sp .cms-public .title-list .paging span.page,
.dev-tb .cms-public .title-list .paging span.page {
	padding:0 5px;
}

.dev-sp .cms-public .title-list .other span a,
.dev-tb .cms-public .title-list .other span a {
    position: relative;
    display: inline-block;
    padding-left: 20px;
}

.dev-sp .cms-public .title-list .other span a:before,
.dev-tb .cms-public .title-list .other span a:before {
    content: '';
    width: 14px;
    height: 14px;
    background: #333;
    border-radius: 50%;
    position: absolute;
    top: 50%;
    left: 0;
    margin-top: -7px;
}

.dev-sp .cms-public .title-list .other span a:after,
.dev-tb .cms-public .title-list .other span a:after {
    content: '';
    width: 0;
    height: 0;
    border: solid 3px transparent;
    border-left: solid 5px #ffffff;
    position: absolute;
    top: 50%;
    left: 5px;
    margin-top: -3px;
}

.dev-sp .cms-public .title-list .tab ul.tile li,
.dev-tb .cms-public .title-list .tab ul.tile li {
	border:none;
	display:inline-block;
	float:none;
	vertical-align:top;
	padding-left:0;/**/
}

.dev-sp .cms-public .title-list .tab ul.tile li time,
.dev-tb .cms-public .title-list .tab ul.tile li time {
    padding-left:12px;
    position:relative;
    float:none;
}
.dev-sp .cms-public .title-list .tab ul.tile li time:before,
.dev-tb .cms-public .title-list .tab ul.tile li time:before {
    content: '';
    width: 0;
    height: 0;
    border: solid 4px transparent;
    border-left: solid 4px #333;
    position: absolute;
    top: 0.5em;
    left: 0;
    margin-top: 0px;
}

.dev-sp .cms-public .title-list .tab ul.tile li .belong,
.dev-tb .cms-public .title-list .tab ul.tile li .belong {
	display:block;
/*	background:#f2f2f2;*/
	margin-left:0;
}
.dev-sp .cms-public .title-list .tab ul.tile li .title,
.dev-tb .cms-public .title-list .tab ul.tile li .title  {
	margin-left:0;
}







.dev-sp .cms-public .title-list .tab ul.totaling li .belong,
.dev-tb .cms-public .title-list .tab ul.totaling li .belong {
	display:inline-block;
    margin-left:0px
}

.dev-sp .cms-public .title-list .tab ul.totaling li {
	padding-left: 0;
}
.dev-tb .cms-public .title-list .tab ul.totaling li {

}
.dev-sp .cms-public .title-list .tab ul.totaling li .title,
.dev-tb .cms-public .title-list .tab ul.totaling li .title {
	display:inline-block;
	margin-left: 0;
}
.dev-sp .cms-public .title-list .tab ul.totaling li .summary,
.dev-tb .cms-public .title-list .tab ul.totaling li .summary {
	margin-left:0;
}

.dev-sp .cms-public .title-list .tab ul.totaling li time,
.dev-tb .cms-public .title-list .tab ul.totaling li time {
    top:0;
    padding-left:0;
}
.dev-sp .cms-public .title-list .tab ul.totaling li time:before,
.dev-tb .cms-public .title-list .tab ul.totaling li time:before {
    content: '';
    width: 0;
    height: 0;
    border: none;
}


.dev-sp .cms-public .title-list .tab ul.totaling li title,
.dev-tb .cms-public .title-list .tab ul.totaling li title {
    text-indent:15px;
    position:relative;
    display:block;
}
.dev-sp .cms-public .title-list .tab ul.totaling .title:before,
.dev-tb .cms-public .title-list .tab ul.totaling .title:before  {
    content: none;
    /*width: 0;
    height: 0;
    border: solid 4px transparent;
    border-left: solid 4px #333;
    position: absolute;
    top: 0.5em;
    left: 115px;
    margin-top: 0px;*/
}


.dev-sp .cms-public .pickup .title-list .tab .paging,
.dev-tb .cms-public .pickup .title-list .tab .paging {
	visibility:hidden;
}


/*----------------------------------- パンくずリスト -------------------------------------*/
.dev-sp .breadcrumb,
.dev-tb .breadcrumb {
	font-size:0.93em;
	color:#333;
	background-color:#f5f5f5;
	margin: 0;
	padding: 5px 0 15px 10px;
}
.dev-sp .breadcrumb fieldset,
.dev-tb .breadcrumb fieldset {
	border:none;
}


.dev-sp .cms-public .layout,
.dev-tb .cms-public .layout {
	/* 
	最終的には .cms-public に指定で良さそうだが、現状は、HTML内の .page クラスを
	適用している div タグに style 指定でフォントが埋め込まれているため、無効化される
	.cms-public > .page > .layout
	今回は .page で無効化されないようにその下の .layout に対して定義を行う
	*/
    font-family: 'Meiryo', 'メイリオ', 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', 'Osaka', 'MS PGothic', 'arial', 'helvetica', 'sans-serif';
}

.dev-sp .cms-public .list figcaption,
.dev-sp .cms-public .movie figcaption,
.dev-sp .cms-public .map figcaption,
.dev-tb .cms-public .list figcaption,
.dev-tb .cms-public .movie figcaption,
.dev-tb .cms-public .map figcaption {
	font-size:1em;
	line-height:1.75em;
	color:#333;
}



/* スライド */
.dev-sp div.slide,
.dev-tb div.slide {
	border:1px solid #081f51;
	padding:20px;
}

.dev-sp .cms-public div.slide div.pause,
.dev-tb .cms-public div.slide div.pause {
	bottom:22px;
}

.dev-sp .cms-public div.slide div.prev, .cms-public div.slide div.next,
.dev-tb .cms-public div.slide div.prev, .cms-public div.slide div.next  {
	top: 50%;
	transform: translateY(-50%);
	-webkit-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	transform: translateY(-50%);
}

.dev-sp .cms-public div.slide div.prev span.arrow,
.dev-tb .cms-public div.slide div.prev span.arrow {
	background:url(/file/img/170821.png);
/*	background:url(../img/slide_L.png);*/
	width:32px;
	height:32px;
    opacity: 1;
}

.dev-sp .cms-public div.slide div.next span.arrow,
.dev-tb .cms-public div.slide div.next span.arrow {
	background:url(/file/img/170822.png);
/*	background:url(../img/slide_R.png);*/
	width:32px;
	height:32px;
    opacity: 1;
}

.dev-sp .cms-public div.slide div.pause span.pause,
.dev-tb .cms-public div.slide div.pause span.pause {
	background:url(/img/slide_01.png);
	width:24px;
	height:18px;
}
.dev-sp .cms-public div.slide div.pause span.play,
.dev-tb .cms-public div.slide div.pause span.play {
	background:url(/img/slide_02.png);
	width:24px;
	height:18px;
}

.cms-public .block {
    word-wrap: break-word;
}
