@charset "shift_jis";
/* CSS Document */

/*
	-------------------------
		title
	-------------------------
*/
.mod-mainContentContainer h1 {
	margin: 0;
}
.mod-mainContentContainer h1 a, .mod-mainContentContainer h1 a:visited, .mod-mainContentContainer h1 a:hover, .mod-mainContentContainer h1 a:active {
	color: #fff;
	text-decoration: none;
	display: block;
}
.mod-mainContentContainer h2 {
	clear: both;
	color: #000;
	font-size: 1.75em;
	margin-bottom: 30px;
}

.mod-mainContentContainer h3 {
	clear: both;
	color: #000;
	font-size: 1.5em;
	padding: 3px 0 3px 3px;
	margin-bottom: 15px;
}
.mod-mainContentContainer h4 {
	clear: both;
	color: #333;
	font-size: 1.25em;
	padding: 3px;
	margin-bottom: 15px;
}
.mod-mainContentContainer h5 {
	clear: both;
	color: #000;
	font-size: 1em;
	padding: 3px;
	margin-bottom: 5px;
}
h5.ratio {
	color: #0075c2;
	font-size: 1.125em;
	text-align: center;
}

/*
	-------------------------
		basic style
	-------------------------
*/
.mod-mainContentContainer p {
	margin: 0 .3em 1.25em;
}
.mod-mainContentContainer ol {
	margin: 0 0 1em 2em;
	padding: .5em 0;
}
.mod-mainContentContainer ul {
	margin: 0 0 1em 2em;
	padding: .5em 0;
	list-style: disc;
}
.mod-mainContentContainer ol li, .mod-mainContentContainer ul li {
	margin-left: .5em;
	margin-bottom: .35em;
}
a.textLink {
	display: inline;
	margin: 0 3px 0 7px;
	background-position: 0px;
}
.mod-mainContentContainer span.link_out {
    background: url(/support/ichigan/share3/images/icon_blank.gif) no-repeat scroll 0 0 transparent;
    display: inline-block;
    height: 0;
    overflow: hidden;
    padding: 9px 0 0;
    vertical-align: baseline;
	*vertical-align: middle;	/* for IE */
    width: 11px;
	margin-left: 3px;
}
.mod-mainContentContainer img {
	line-height: 0;
	vertical-align: bottom;
}
img.icon_image {
	margin: 0 2px;
	vertical-align: middle;
}

/*
	-------------------------
		#contents_header
	-------------------------
*/

#contents_header {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	background-color: #333;
	border-bottom: solid 1px #333;
	clear: both;
	height: 52px;
	margin: 20px auto 0;
	padding: 1.25em 2em .75em;
	position: relative;
}
#contents_header h1 {
	color: #fff;
	font-size: 1.75em;
	line-height: 1.0;
}
@media (max-width: 640px) {
#contents_header {
	height: auto;
	max-width: 100%;
	padding: 0;
}
#contents_header h1 {
	font-size: 1.5em;
	padding: 1.25em 1em .75em;
}
:root #contents_header h1 {
	filter: dropshadow(color=#ffffff, offX=1, offY=1);
}
}
/*
	-------------------------
		local navigation
	-------------------------
*/
#contents_header .local_navigation {
	margin: 0;
	position: absolute;
	bottom: 0;
	right: 5px;
}
#contents_header .local_navigation ul.contents_navi {
	margin: 0;
	padding: 0;
	list-style: none;
	overflow: hidden;
}
#contents_header .local_navigation ul.contents_navi li {
	margin: 15px 0 0 1.4375em;
	padding: 0;
	float: left;
	line-height: 1;
}
#contents_header .local_navigation ul.contents_navi a {
	display: block;
	margin-bottom: 0;
	outline: none;
	padding-right: 6px;
	padding-bottom: 10px;
	padding-left: 6px;
	color: #fff;
	transition: 0.15s ease-out;
}
#contents_header .local_navigation ul.contents_navi li:hover a, #contents_header .local_navigation ul.contents_navi .active a {
	text-decoration: none;
	/*box-shadow: inset 0 -4px 0 #5887f5;*/
	border-bottom: solid 4px #ef6c00;
}
@media (max-width: 640px) {
	#contents_header .local_navigation {
		position: static;
	}
}
/*
	-------------------------
		.lead
	-------------------------
*/
.lead {
	margin: 0 0 30px;
}
.lead .ttl_bnr {
	background: #fff url(/support/ichigan/enjoy/photo/acc/flash/images/wireless_flash_ttl.png) no-repeat right;
	border-bottom: 1px solid #d0d0d0;
	clear: both;
	color: #333;
	height: 52px;
	margin: 0;
	padding: 0;
}
.lead .ttl_bnr h2 {
	margin: 0;
	padding: 0.5em 1em;
}
.lead .ttl_bnr h2.h2__index {
	overflow: hidden;
	text-indent: 100%;
	white-space: nowrap;
}
.mainvisual {
	margin: 0;
	position: relative;
}
.mainvisual img {
	display: block;
	width: 950px;
}
.mainvisual .header_text_area {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	font-size: 1.125em;
	height: auto;
	margin: 0;
	padding: 15px;
	position: absolute;
	width: 287px;
	
	left: 15px;
	/* for old Chrome and Safari */
	top: -webkit-calc(50% - 72px / 2);
	/* for old Firefox */
	top: -moz-calc(50% - 72px / 2);
	/* for IE8 */
	-ms-filter: "alpha(opacity=85)";
	background: #ffffff\9;
	left: 15px\9;
	top: 72px\9;
	/* for modern browser */
	background-color: rgba(255, 255, 255, .85);
	top: calc(50% - 72px / 2);
}


@media screen and (max-width: 640px) {
.lead .ttl_bnr h2 {
	text-shadow: 1px 1px 0 #fff, -1px 1px 0 #fff, 1px -1px 0 #fff, -1px -1px 0 #fff;
}
.mainvisual img{
	width: 100% !important;
	max-width: 100% !important;
	height: auto !important;
}
.mainvisual .header_text_area {
	background-color: #eee;
	position: static;
	padding: 5px 15px;
	width: auto;
}
}

/* anchorArea */
.lead ul.anchorArea {
	margin:15px 0 30px;
	padding:0 0 12px;
	border: solid 1px #999;
	list-style:none;
	clear:both;
}
.lead ul.anchorArea:after {
	clear: both;
	content: ".";
	display: block;
	height: 0;
	visibility: hidden;
}
.lead ul.anchorArea li {
	margin:12px 15px 0;
	padding:0 0 0 13px;
	background:url(/support/ichigan/share3/images/arrow_black-b.png) 0 5px no-repeat;
	float:left;

}
@media screen and (max-width: 640px) {
	.lead ul.anchorArea li {
		float: none;
	}
}

/*
	-------------------------
		layout
	-------------------------
*/
.section {
	margin-bottom: 30px;
	clear: both;
}
.section:after {
	clear: both;
	content: ".";
	display: block;
	height: 0;
	visibility: hidden;
}
.section h3 {
	border-bottom: solid 1px #999;
	border-left: solid 7px #999;
	font-weight: normal;
	padding: 3px 10px 0 15px;
}
.section .bg_gray {
	background-color: #f0f0f0;
	padding: 15px;
}
.unit {
	margin: 0 -15px 30px;
	width: auto;
}
.unit > h1, .unit > h2, .unit > h3, .unit > h4, .unit > h5 {
	padding: 0 15px;
}
.unit:after, .unit .one-half:after, .unit .one-third:after, .unit .two-thirds:after, .unit .one-quarter:after {
	clear: both;
	content: ".";
	display: block;
	height: 0;
	visibility: hidden;
}
.unit .one-half, .unit .one-third, .unit .two-thirds, .unit .one-quarter {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	float: left;
	padding: 0 15px;
}
.unit .one-half {
	width: 50%;
}
.unit .one-third {
	width: 33.33333333%;
}
.unit .two-thirds {
	width: 66.66666667%;
}
.unit .one-quarter {
	width: 25%;
}
.unit .one-half img, .unit .one-third img, .unit .two-thirds img, .unit .one-quarter img, .resize img {
	width: auto !important;
	max-width: 100% !important;
	height: auto !important;
}
@media screen and (max-width: 640px) {
.unit .one-half, .unit .one-third, .unit .two-thirds {
	float: none;
	padding: 0 15px 20px;
	width: auto;
}
.unit .one-quarter {
	width: 50%;
	padding-bottom: 30px;
}
}

/*
	-------------------------
	 movie
	-------------------------
*/
.unit .movie {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	padding: 0 15px 0;
	width: 75%;
}
.i_flame {
	position: relative;
	padding-bottom: 56.25%;
	height: 0;
	overflow: hidden;
	max-width: 100%;
}
.i_flame iframe {
	position: absolute;
	top: 0;
	left: 0;
	border: 0;
	width: 100%;
	height: 100%;
	margin: 0;
	padding: 0;
}
 @media screen and (max-width: 640px) {
.unit .movie {
	width: 100%;
}
.i_flame {
	float: none;
}
}


/*
	-------------------------
	pagenavi
	-------------------------
*/
.pageNavi {
	clear: both;
	width: 100%;
	overflow: hidden;
	margin: 50px 0px 20px;
}
.pageNavi:after {
	clear: both;
	content: ".";
	display: block;
	height: 0;
	visibility: hidden;
}
ul#pageNumber {
	list-style-type: none;
	float: left;
	position: relative;
	right: 50%;
	padding-right: 2px;
	margin-left: 0;
}
#pageNumber {
	padding: 0;
	margin: auto;
	position: relative;
	left: 50%;
}
ul#pageNumber li {
	list-style-type: none;
	float: left;
	position: relative;
	right: 50%;
	padding-right: 2px;
	margin-left: 0;
}
#pageNumber a {
	width: auto;
	display: block;
	padding: 2px 7px 0px;
	background-color: #fff;
	border: 1px solid #ccc;
	color: #494949;
	text-decoration: none;
}
#pageNumber a:hover {
	color: #494949;
	background-color: #ccc;
}
#pageNumber li.currentNum {
	padding: 3px 8px 1px 8px;
	color: #fff;
	background-color: #8b8b8b;
	margin-right: 2px;
}
/*
	------------------------------------
	menulist
	------------------------------------
*/
div.menuList {
	background-color: #eee;
	padding: 20px 20px 10px;
	width: 250px;
	margin: 0 auto;
}
div.menuList ul, div.menuList li {
	list-style: none;
	margin: auto;
}
div.menuList li {
	padding: 0 0 5px;
}
div.menuList ul li.currentList {
	font-weight: 700;
	color: #000;
}
@media screen and (max-width: 768px) {
div.menuList {
	width: auto;
	padding: 10px 10px 5px;
}
}
/*
	-------------------------
	 onePointArea
	-------------------------
*/
div.onePointArea {
	clear: both;
	margin: 0 auto 70px;
	padding: 0;
	width: 760px;
}
div.onePointArea div.onePointTitle {
	width: 760px;
	height: 65px;
    margin: 0;
}
div.onePointTitle2 {
	display: none;
}
div.onePointArea  div.onePointBox {
	border-bottom: 11px double #d7e9d9;
	border-left: 11px double #d7e9d9;
	border-right: 11px double #d7e9d9;
	margin-top: 0;
	padding: 20px;
	width: 698px;
}
@media screen and (max-width: 640px) {
	div.onePointArea {
		border: 11px double #d7e9d9;
		margin-bottom: 40px;
		padding: 10px 0px;
		width: 90%;
	}
	div.onePointArea div.onePointTitle {
		display: none;
	}
	div.onePointArea div.onePointTitle2 {
		display: block;
		height: auto;
		margin: 0 auto 10px;
		padding: 0px;
		text-align: center;
		width: 84%;
	}
	div.onePointArea div.onePointTitle2 img {
		width: auto !important;
		max-width: 100% !important;
		height: auto !important;
	}
	div.onePointArea div.onePointBox {
		border: medium none;
		float: none;
		height: auto;
		padding: 0 0 10px 0;
		width: 84%;
	}
}
/*
	-------------------------
	 for index.html
	-------------------------
*/


/* 画像サイズの調整 */

.unit .two-thirds .h-265 img {
	height: 265px !important;
	width: auto !important;
}

@media screen and (max-width: 640px) {
	.unit .two-thirds .h-265 img {
		width: auto !important;
		max-width: 100% !important;
		height: auto !important;
	}
}

/*
	-------------------------
	 for compatibility.html
	-------------------------
*/

.compatibility table, .compatibility th, .compatibility td {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}
.compatibility table {
	margin: 0 0 30px;
	border: 1px #ccc solid;
	border-collapse: collapse;
	border-spacing: 0;
	clear: both;
	font-size: 13px;
	width: 100%;
}
.compatibility table th{
	border: 1px #ccc solid;
	height: 30px;
	line-height: 1.2;
	padding: 10px;
	text-align: center;
	width: auto;
}
.compatibility table td {
	border: 1px #ccc solid;
	height: 30px;
	line-height: 1.2;
	padding: 10px;
	width: auto;
}
.compatibility thead th {
	background-color: #eee;
	text-align: center;
	font-size: 12px;
}

.compatibility th.w-15 {
	width: 15%;
}
.compatibility th.w-17 {
	width: 16.6666667%;
}
.compatibility th.w-19 {
	width: 18.8888889%;
}
.compatibility th.w-25 {
	width: 25%;
}
.compatibility th.w-28 {
	width: 28.3333333%;
}
.compatibility th.w-35 {
	width: 35%;
}
@media screen and (max-width: 640px) {
.compatibility table {
	margin: 0 0 30px;
}
.compatibility td ul {
	list-style: none;
	margin: 0 0 1em;
}
.compatibility td li {
	margin-left: 0;
}
.compatibility th.w-15,
.compatibility th.w-17,
.compatibility th.w-19,
.compatibility th.w-25,
.compatibility th.w-28,
.compatibility th.w-35 {
	width: auto;
}
}


/*
	-------------------------
	 for practice.html
	-------------------------
*/

.practice ul.onePoint li {
	margin-bottom: 30px;
}
.practice ul.onePoint li .resize img {
	border: solid 1px #ccc;
	margin-top: 5px;
}

/* 20200806 */
.compatibility .f_flex {
    display: flex;
    justify-content: space-around;
}

.compatibility .f_flex .f_txt {
    padding: 1em;
}

@media screen and (max-width: 640px) {
	.compatibility .f_flex {
		display: block;
	}
	
	.compatibility .f_flex .f_txt {
		padding: 0;
	}
}