@charset "shift_jis";

h3.s-title,
h4.s-title {
	border-bottom: 1px solid #999999;
	clear: both;
	font-size: 15px;
	margin: 30px 0 15px;
	padding: 0 0 0 13px;
}

/*20220329追加*/
h3.t_title{
    margin-left: 1em; 
    font-size: 1.2rem;
}

@media (max-width: 640px){
    h3.t_title{
        margin-left: 0;   
        margin-top: 2em;
    }
}
/*===========================================
	pregArea_01
=============================================*/
div.pregArea_01 {
	width: 760px;
	padding: 0px;
	clear:both;
}
/*===========================================
	pregBox 
=============================================*/
ul.pregBox {
	margin:15px 0px 0px 0px;
	padding:0px;
	list-style:none;
}
ul.pregBox li.img {
	width:180px;
	float: left;
}
ul.pregBox li.txt {
	width:260px;
	float: left;
	margin-left:30px;
}
ul.pregBox li.txt-long {
	width:490px;
	float: left;
	margin-left:30px;
}
div.pregArea_01 div.pregBox {
	/*width: 700px;*/
	width: 760px;
	margin: 15px auto 0px auto;
	padding: 0px;
}
/*div.pregArea_01 .basic div.pregBox {
	width: 700px;
}*/
div.pregArea_01 div.pregBox div.leftArea { float:left; }
div.pregArea_01 div.pregBox div.rightArea {	float:right; }
div.pregArea_01 div.pregBox div.leftArea,
div.pregArea_01 div.pregBox div.rightArea {
	width:360px;
	margin-right: 0;
}
/* movieBox */
div.pregArea_01 div.pregBox ul.movieBox {
	background: #F5F5F5;
	border: 1px solid #CCCCCC;
	margin: 15px auto 0;
	padding: 15px;
	list-style:none;
}
div.pregArea_01 div.pregBox ul.movieBox li.img {
	width:320px;
	float:left;
	text-align:center;
}
div.pregArea_01 div.pregBox ul.movieBox li.txt {
	width:310px;
	float: right;
}


/* camArea */
div.pregArea_01 div.pregBox ul.camArea {
	margin: 15px 0px 0px 0px;
	padding: 0px;
	list-style:none;
	clear:both;
}
div.pregArea_01 div.pregBox ul.camArea li.left { float:left;}
div.pregArea_01 div.pregBox ul.camArea li.right { float: right;}
div.pregArea_01 div.pregBox ul.camArea li.left,
div.pregArea_01 div.pregBox ul.camArea li.right {
	width: 360px;
}
p.camera {
	margin-top: 10px;
	margin-left: 20px;
}
/* camArea-2 */
div.pregArea_01 div.pregBox ul.camArea-2 {
	margin: 30px 0px 0px 0px;
	padding: 0px;
	list-style:none;
}
div.pregArea_01 div.pregBox ul.camArea-2 li.top {
	margin:0px;
}
div.pregArea_01 div.pregBox ul.camArea-2 li.other {
	margin:0px 0px 0px 20px;
}
div.pregArea_01 div.pregBox ul.camArea-2 li.top,
div.pregArea_01 div.pregBox ul.camArea-2 li.other {
	width: 175px;
}
div.cameraImg {
	text-align:center;
}
.blue-hdr {
	background:#588ACE;
	color:#FFF;
	padding:3px 5px;
	font-weight:bold;
}
.blue-hdr_s {
	background:#9BB9E2;
	padding:3px 5px;
}
.yellow-hdr {
	background:#CFB136;
	color:#FFF;
	padding:3px 5px;
	font-weight:bold;
}
.yellow-hdr_s {
	background:#E2D086;
	padding:3px 5px;
}
.green-hdr {
	background:#6EB141;
	color:#FFF;
	padding:3px 5px;
	font-weight:bold;
}
.green-hdr_s {
	background:#A8D08D;
	padding:3px 5px;
}
.darkGray-hdr {
	background:#666666;
	color:#FFF;
	padding:3px 5px;
	font-weight:bold;
}
.darkGray-hdr_s {
	margin-bottom: 10px;
	padding: 3px 5px;
	font-size: 12px;
	background: #EDEDED;
}
/* anchor */
ul.anchor {
	list-style:none;
}
ul.anchor li {
	float: left;
	padding-right: 20px;
}
p.anchorButton {
	width:170px;
	background: url("../images/bg_anchorbtn.png") no-repeat 0 52%;
	border: 1px solid #BCBCBC;
	border-radius: 3px 3px 3px 3px;
	color: #333333;
	cursor: pointer;
	display: inline-block;
	font-size: 12px;
	line-height: 1.4;
	padding: 10px 18px 10px 23px;
	transition: opacity 0.2s ease-in 0s;
}

/* checkArea */
ul.checkArea {
	list-style: none;
	margin: 3px 0 0;
	padding: 0;
}
ul.checkArea li {
	background: url("../images/ico_check.gif") no-repeat scroll 0 5px;
	margin: 0px 0 0;
	padding: 6px 0 0 27px;
}
div.productType {
	display:block;
	text-align:center;
}
/* bnr */
.bnr {
	margin: 30px 0 0 0;
	padding: 0;
	clear:both;
}

.boder-b {
	border-bottom:#E5E5E5 1px solid;
	padding-bottom:5px;
}
.boder-b-o {
	border-bottom:#F13413 1px solid;
	padding-bottom:2px;
}
.boder-b-b {
	border-bottom:#004274 1px solid;
	padding-bottom:2px;
}
.green {
	color:#199664;
}
.blue {
	color:#004BAF
}
.pink {
	color:#E74382;
}
p.Gray {
	background: #E5E5E5;
	padding: 5px 10px;
	font-weight:bold;
	clear:both;
}
.txt15 {
	font-size: 123.1%;
}
.txt18 {
	font-size: 150%;
}

/*===========================================
	pointArea
=============================================*/
div.pointArea {
	background:#FAF5C8;
	margin: 10px 0px 0px 0px;
	padding: 15px;
	clear:both;
}
div.pointArea div.pointBox {
	background:url(../images/ico_point.png) no-repeat;
	margin: 0;
	padding: 0 0 0 50px;
}
.txtlink li {
	float: none;
}
/*===========================================
	junbiArea 
=============================================*/
ul#junbiArea {
	width:760px;
	margin:15px 0px 0px 0px;
	padding:0px;
	list-style:none;
	background:url(/support/ichigan/movie/images/junbiArea-bg.gif) repeat-y;
}
ul#junbiArea li.line {
	width:232px;
	margin-right:32px;
	float: left;
}
ul#junbiArea li.line-none {
	width:212px;
	float: left;
}
ul#junbiArea div.img {
	width:200px;
	margin:10px auto 0px auto;
}
div.pc-none {
	display: none;
}

p.camera {
	margin-top:10px;
}
.txt10 {
	font-size: 90%;
}
.txt15 {
	font-size: 123.1%;
}
.txt18 {
	font-size: 150%;
}
.txt-c {
	text-align:center;
}

/*===========================================
	GraylineArea 
=============================================*/
div.GraylineArea {
	border:#EDEDED 10px solid;
	margin:30px 0px 0px 0px;
	padding:15px;
	clear:both;
}
ul.lessonArea {
	margin:0;
	padding:0;
	list-style:none;
}
ul.lessonArea li.img {
	width:100px;
	margin:15px 10px 0 0;
	float:left;
}
ul.lessonArea li.txt {
	width:230px;
	margin:15px 30px 0 0;
	float:left;
}

/*===========================================
	txtlink
=============================================*/
ul.txtlink-camera {
	margin:0px;
	padding: 0px;
	list-style:none;
}
ul.txtlink-camera li {
	width:100px;
	margin:5px 40px 0px 0px;
	padding: 0 0 0 11px;
	background:url(/support/share/images/arrow_black.gif) no-repeat left 0.4em;
	float: left;
}
ul.txtlink-camera_E,
ul.txtlink-camera_A {
	margin:0px;
	padding: 0px;
	list-style:none;
}
ul.txtlink-camera_E li {
	width:70px;
	margin:5px 20px 0px 0px;
	padding: 0 0 0 11px;
	background:url(/support/share/images/arrow_black.gif) no-repeat left 0.4em;
	float: left;
}
ul.txtlink-camera_A li {
	width:110px;
	margin:5px 40px 0px 0px;
	padding: 0 0 0 11px;
	background:url(/support/share/images/arrow_black.gif) no-repeat left 0.4em;
	float: left;
}
ul.txtlink {
	margin:0px;
	padding: 0px;
	list-style:none;
}
ul.txtlink li {
	width:auto;
	margin:7px 0px 0px 0px;
	padding: 0 0 0 11px;
	background:url(/support/share/images/arrow_black.gif) no-repeat left 0.4em;
	float: none;
}
.wifi-nfc li {
	float: none;
}
.pregArea_01 .howto li {
	float: none;
}
.anchor_box_inner {
	margin-bottom: 30px;
}
	.anchor_box_inner	li {
		float: left;
		margin-bottom: 10px;
		margin-right: 17px;
		list-style: none;
	}
		.anchor_box_inner	li.right {
			margin-right: 0;
		}
		.anchor_box_inner	li .anchorButtonA {
			width: 196px;
		}

/*===========================================
	mod-linkButton
=============================================*/
.mod-linkButton {
	list-style-type: none;
}

/*===========================================
	clearfix 
=============================================*/
.clearfix:after {
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
}

.clearfix { display: inline-block}

/* Hides from IE-mac \*/
* html .clearfix {height: 1%;}
.clearfix { display:block;}
/* End hide from IE-mac */


/*===========================================
	clear_both
=============================================*/
.clear_both {
	clear: both;
}

/*===========================================
	Space
=============================================*/
.mt_00 {
	margin: 0px;
}
.mt_02{
	margin: 2px 0px 0px 0px;
}
.mt_03{
	margin: 3px 0px 0px 0px;
}
.mt_05{
	margin: 5px 0px 0px 0px;
}
.mt_10 {
	margin: 10px 0px 0px 0px;
}
.mt_15 {
	margin: 15px 0px 0px 0px;
}
.mt_20 {
	margin: 20px 0px 0px 0px;
}
.mt_25 {
	margin: 25px 0px 0px 0px;
}
.mt_30 {
	margin: 30px 0px 0px 0px;
}
.mt_35 {
	margin: 35px 0px 0px 0px;
}
.mt_40 {
	margin: 40px 0px 0px 0px;
}
.mt_45 {
	margin: 45px 0px 0px 0px;
}
.mt_50 {
	margin: 50px 0px 0px 0px;
}

/*===========================================
	pagetopBox
=============================================*/
.pagetopBox{
	margin:5px 0px 0px 0px;
	padding:0px;
	text-align:right;
	clear:both;
}

/*===========================================
	movie_li_thumb
=============================================*/
.movie_li_thumb li{
	list-style-type: none;
	margin: 0px 6px 30px;
	width: 177px;
	float: left;
}
.movie_li_thumb li img{
	border-bottom:#000 1px solid;
	border-left:#000 1px solid;
	border-top:#000 1px solid;
	border-right:#000 1px solid;
}



@media (max-width: 640px){
	/*===========================================
		pregArea_01
	=============================================*/
	div.pregArea_01 {
		width: auto;
	}
	div.pregArea_01 div.pregBox {
		width: auto;
	}
	div.pregArea_01 div.pregBox div.leftArea {
		width: auto;
		float: none;
	}
	div.pregArea_01 div.pregBox div.rightArea {
		width: auto;
		float: none;
		margin-top:15px;
	}

	/* anchor */
	ul.anchor li {
		margin-top:10px;
		float:none;
	}
	p.anchorButton {
		width:200px; 
	}

	/* movieBox */
	div.pregArea_01 div.pregBox ul.movieBox li.img {
		width: auto;
		float: none;
	}
	div.pregArea_01 div.pregBox ul.movieBox li.img img {
		max-width: 100%;
		height:auto;
	}
	div.pregArea_01 div.pregBox ul.movieBox li.txt {
		width: auto;
		float: none;
		margin-top:15px;
	}

	div.pregArea_01 div.pregBox ul.camArea li.left {
		width: auto;
		float: none;
	}
	div.pregArea_01 div.pregBox ul.camArea li.right {
		width: auto;
		float: none;
		margin-top:15px;
	}

	/* camArea-2 */
	div.pregArea_01 div.pregBox ul.camArea-2 li.top {
		width: auto;
		float: none;
	}
	div.pregArea_01 div.pregBox ul.camArea-2 li.other {
		width: auto;
		float: none;
		margin:15px 0px 0px 0px;
	}

	/*===========================================
		pregBox 
	=============================================*/
	ul.pregBox li.img {
		width: auto;
		float: none;
		text-align:center;
	}
	ul.pregBox li.txt {
		width: auto;
		float: none;
		margin-left:0px;
		margin-top:15px;
	}
	ul.pregBox li.txt-long {
		width: auto;
		float: none;
		margin-left:0px;
		margin-top:15px;
	}

	/*===========================================
		GraylineArea 
	=============================================*/
	div.GraylineArea {
		border:#EDEDED 10px solid;
	}
	div.GraylineArea .st img {
		max-width:380px;
		width:100%;
		height:auto;
	}

	/* lessonArea */
	ul.lessonArea li.img {
		width:20%;
		margin:15px 10px 0 0;
	}
	ul.lessonArea li.img img {
		width:100%;
		height:auto;
	}
	ul.lessonArea li.txt {
		width:75%;
		margin:15px 0px 0 0;
	}

	/*===========================================
		junbiArea 
	=============================================*/
	ul#junbiArea {
		width: auto;
		background: none;
	}
	ul#junbiArea li.line {
		width: auto;
		border-right: none;
		margin-right:0px;
		padding-right:0px;
		border-bottom:#999 1px dotted;
		margin-bottom:30px;
		padding-bottom:30px;
		float: none;
	}
	ul#junbiArea li.line-none {
		width: auto;
		float: none;
	}

	/*===========================================
		txtlink
	=============================================*/
	ul.txtlink-camera {
		margin:0px 0px 0px 15px;
	}
	ul.txtlink-camera li {
		margin:5px 15px 0px 0px;
	}

	ul.txtlink-camera_E,
	ul.txtlink-camera_A {
		margin:0px 0px 0px 15px;
	}
	ul.txtlink-camera_E li,
	ul.txtlink-camera_A li {
		margin:5px 10px 0px 0px;
	}
	ul.txtlink-camera_E li {
	width: 100px;
  }
	div.mq-none {
		display: none;
	}
	div.pc-none {
		display:block;
		text-align:center;
	}
	div.productType img {
		max-width:100%;
		height:auto;
	}
	/* bnr */
	.bnr img {
		max-width:100%;
		height:auto;
	}
	.darkGray-hdr_s {
		height: auto !important;
	}
/*===========================================
	movie_li_thumb
=============================================*/
	.movie_li_thumb li {
		float:none;
		margin:10px auto 0 auto;
		list-style:none;
		width:177px;
	}

		.movie_li_thumb li:last-child {
		float:none;
		margin:10px auto 30px auto;
		list-style:none;
		width:177px;
	}
}



/* 20200427追加 */

#contents section h2.title, #contents section h3.title {
	border-bottom: #000 solid 1px;
}

#contents section h2 {
	font-size: 1.231em;
	margin-top: 3em;
}

/*===========================================
	内部リンクボタン
=============================================*/
#contents div.btnArea ul{
	list-style: none;
	margin-left: 0;
	margin-bottom: 2em;
	overflow: hidden;
}

#contents div.btnArea ul:after{
	content:unset;
}

#contents div.btnArea ul.two_btn > li{
	width: 32.5%;
	margin: 4px 2px;
	float: left;
}

#contents div.btnArea ul li a{
	display: block;
	vertical-align:middle;
	background: url(/support/share/images/bg_mod-linkButton.jpg) repeat-x scroll left center;
	border: solid 1px #CCCCCC;
	border-radius: 5px;
	color: #000;
	padding: 1em;
}


#contents div.btnArea ul li a span{
	background: url(/support/share/images/arrow_underline.gif) no-repeat 0 0.5em;
	font-weight:700;
	padding: 0 0 0 15px;
}

#contents div.btnArea ul li a.otherLink span{
	background: url(/support/share/images/arrow_black.gif) no-repeat 0 0.5em;
}

#contents div.btnArea ul li a:hover,
#contents div.btnArea ul li a:active,
#contents div.btnArea ul li a:focus{
	text-decoration:none;
	color:#000;
	opacity:0.7;
}
#contents div.btnArea ul li a:focus{
	outline: thin dotted;
}



@media screen and (max-width: 640px){
	#contents div.btnArea ul.two_btn > li{
		width: 98%;
		margin: 4px 2px 4px 0;
	}
	
}



@media screen and (max-width: 480px){
	#contents div.btnArea ul.two_btn{
		margin-left: 0;
		-webkit-flex-direction: column;
		-moz-flex-direction: column;
		-ms-flex-direction: column;
		-o-flex-direction: column;
		flex-direction: column;
		-webkit-flex-wrap: nowrap;
		-moz-flex-wrap: nowrap;
		-ms-flex-wrap: nowrap;
		-o-flex-wrap: nowrap;
		flex-wrap: nowrap;
	}

	#contents div.btnArea ul.two_btn > li{
		width: 100%;
		margin-left: 0;
		-webkit-flex-direction: column;
		-moz-flex-direction: column;
		-ms-flex-direction: column;
		-o-flex-direction: column;
		flex-direction: column;
	}
}


/*===========================================
	メニューリスト
=============================================*/

#contents ul.menu_list{
	margin:2em 0 2em 1em;
}

#contents ul.menu_list li{
	display:inline-table;
	width:30%;
	margin:0.5em 1em 0.5em 0;
}

#contents ul.menu_list li a{
	display:inline-block;
	background: #efefef;
	padding:1em;
	overflow:hidden;
}

#contents ul.menu_list li a:hover,
#contents ul.menu_list li a:active,
#contents ul.menu_list li a:focus{
	opacity:0.5;
	text-decoration:none;
	color:#000;
}


#contents ul.menu_list li a span.textLink {
	display:inline-block;
	height:3em;
	padding-left: 1em;
	background: url(/support/share/images/arrow_black.png) no-repeat;
	background-position: 0 6px;
	font-size: 12px;
}

#contents ul.menu_list li a img:not(.icon_window){
	display:block;
	width:180px;
	background-color:#ccc;
	margin: 0.2em 1em;
}

#contents ul.menu_list.txt1 li a span.textLink {
	height: 1em;
}

#contents span.link_out {
	background: url(/support/share/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;
	width: 11px;
	margin-left: 3px;
}

@media screen and (max-width: 640px){

	#contents ul.menu_list{
		margin:0;
	}
	#contents ul.menu_list li{
		display:block;
		width:100%;
	}
	#contents ul.menu_list li a img:not(.icon_window){
		display:inline-block;
		width:40%;
		margin:0 0 0 1em;
		vertical-align:middle;
	}
	#contents ul.menu_list li a{
		display:block;
		padding:0.5em;
	}
	#contents ul.menu_list li a span.textLink {
		display:inline-block;
		width:50%;
		height:auto;
		vertical-align:middle;
	}
}

/*===========================================
	ピックアップ 2021/10/05追記
=============================================*/

#contents .pickupArea{
    margin: 1em auto;
    padding: 1em;
    border: 1px solid #999999;
    width: 450px;
}

#contents .pickupArea a span.textLink {
	display:inline-block;
	padding-left: 1em;
	background: url(/support/share/images/arrow_black.png) no-repeat;
	background-position: 0 5px;
	font-size: 12px;
}

#contents .pickupArea a img{
    display: block;
    margin: 0.5em auto;
    width: 255px;
}

#contents .pickupArea a:hover,
#contents .pickupArea a:active,
#contents .pickupArea a:focus{
	opacity:0.5;
	text-decoration:none;
	color:#000;
}

@media screen and (max-width: 640px){
    #contents .pickupArea{
    width: auto;
    }
    
    #contents .pickupArea a img{
    width: 100%;
    max-width: 350px;
}
    
}

/* 20220304 */
a.textLink {
    display: inline;
    margin: 0 3px 0 7px;
    background-position: 0px;
}

#contents .notice_gray {
        background: #F0F0F0;
    margin: 0 0 1em;
    overflow: hidden;
    padding: 1em 1em 0;
}

#contents .notice_gray ul {
  margin: 1em 0 1em 2em;
}

#contents .notice_gray .fr {
    float: right;
}

#contents .notice_gray .pct {
    margin: 1em;
}

@media screen and (max-width: 640px){
	#contents .notice_gray .fr {
		float: none;
	}
    
    #contents .notice_gray .fr img {
		width: 100%;
        max-width: 300px;
	}
}

/* 20230127 */
#contents img.icon_window {
    padding-left: 0.25em;
}

/* 20240110 */
#contents p.annotation {
    padding-left: 1em;
    text-indent: -1em;
}

/* 20240318 */
#contents .mqonly {
    display: none;
}

@media screen and (max-width: 640px) {
	#contents .mqonly {
		display: block;
	}
}

/* 20240430 */
#contents div.txtbox {
    margin: 0.3em;
}

#contents div.txtbox a.textLink {
    display: block;
    padding: 0 0 0 10px;
    background: url(/share/images/arrow_black.gif) no-repeat left .4em;
}