@charset "utf-8";

/****************************** PC・SP共通 ******************************/
.top{}

/* =========================================
	
	表紙
	
========================================= */
.top #coverArea{
	width:100%;
	min-width:1200px;
	height:100%;
	display:table;
}
.top #coverArea #titleBox{
	float:left;
	width:50%;
	height:100%;
	display:table-cell;
	position:relative;
}
.top #coverArea #titleBox:before{
	content: "";
	position: absolute;
	height: 50%;
	width: 1px;
	background-color: #00a7ac;
	top: 50%;
	left: 50%;
	z-index: 100;
}
.top #coverArea #titleBox:after{
	content:"";
	width: 9px;
	height: 9px;
	margin-left: -4px;
	-webkit-border-radius:4.5px;
	-moz-border-radius:4.5px;
	border-radius: 4.5px;
	background-color: #00a7ac;
	animation: readmore 3.5s infinite;	
	position: absolute;
	top: 75%;
	left: 50%;
}
@keyframes readmore {
	0% {
		top:80%;
		opacity: 0;
	}
	40% {
		opacity: 1;
	}
	60% {
		opacity: 1;
	}
	100% {
		top:100%;
		opacity: 0;
	}
}
.top #coverArea #titleBox #title{
	width:320px;
	position:absolute;
	top: 50%;
	left: 50%;
	background-color: #ffffff;
	margin-right: -50%;
/*追加*/	padding-bottom: 30px;
/*追加*/	z-index: 150;
	-webkit-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
	color:#00a7ac;
}
.top #coverArea #titleBox #title h1{
	margin-bottom:20px;
}
.top #coverArea #titleBox #title p{
	font-size:90%;
	margin-bottom:30px;
}
.top #coverArea #titleBox #title p#volume{
	text-align:right;
	font-weight:700;
	letter-spacing:1px;
	margin:0;
}
.top #coverArea #titleBox #title p#volume span{
	font-weight:300;
	padding-left:10px;

}
.top #coverArea #titleBox #title p#theme{
	background-color:#00a7ac;
	margin:0;
	padding:8px 0;
	text-align:center;
	font-size:34px;
	line-height:1.0;
	letter-spacing:1px;
	font-weight:700;
	color:#ffffff;
	position:relative;
}
.top #coverArea #titleBox #title p#theme:before{
	position:absolute;
	content:"";
	top:0;
	left:0;
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 15px 15px 0 0;
	border-color: #ffffff transparent transparent transparent;
}
.top #coverArea #titleBox #title p#theme:after{
	position:absolute;
	content:"";
	bottom:0;
	right:0;
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 0 0 15px 15px;
	border-color: transparent transparent #ffffff transparent;
}
.top #coverArea #titleBox #title p#theme span{
	position:absolute	;
	top:5px;
	left:15px;
	color:#ffffff;
	text-align:left;
	font-size:15px;
}
.top #coverArea #slider{
	float:right;
	width:50%;
	height:100% !important;
	display:table-cell;
	background-color:#00a7ac;
	background-size:cover;
}

/* vol.30 -------------------- */
/* vol.37 -------------------- */
/* vol.38 -------------------- */
.vol30 #coverArea #titleBox #newyear,
.vol37 #coverArea #titleBox #ico_90th,
.vol38 #coverArea #titleBox #ico_90th ,
.vol39 #coverArea #titleBox #ico_90th {
	background: url(../images/top/vol30/img_newyear.png) no-repeat;
	background-size: contain;
	width: 140px;
	height: 140px;
	display: block;
	position: absolute;
	top: 10px;
	left: 10px/*calc(50% - 70px)*/;
	z-index: 1000;
}
.vol37 #coverArea #titleBox #ico_90th{
	background: url(../images/top/vol37/img_ico_90th.png) no-repeat;
	background-size: contain;
}
.vol38 #coverArea #titleBox #ico_90th{
	background: url(../images/top/vol38/img_ico_90th.png) no-repeat;
	background-size: contain;
}
.vol39 #coverArea #titleBox #ico_90th{
	background: url(../images/top/vol39/img_ico_90th.png) no-repeat;
	background-size: contain;
}


/* =========================================
	
	特集
	
========================================= */
.top #pickupArea{
	width:100%;
	min-width:1200px;
	padding:120px 0 100px;
	background:#00a7ac no-repeat center top;
	background-size:cover;
}
.vol28JP #pickupArea,.vol28 #pickupArea{background-image: url(../../pickup/vol28/images/bg_pickup.jpg);}
.vol29JP #pickupArea,.vol29 #pickupArea{background-image: url(../../pickup/vol29/images/bg_pickup.jpg);}
.vol30JP #pickupArea{background-image: url(../../pickup/vol30/images/bg_pickup.jpg);}
.vol31JP #pickupArea{background-image: url(../../pickup/vol31/images/bg_pickup.jpg);}
.vol32JP #pickupArea{background-image: url(../../pickup/vol32/images/bg_pickup.jpg);}
.vol33JP #pickupArea{background-image: url(../../pickup/vol33/images/bg_pickup.jpg);}
.vol34JP #pickupArea{background-image: url(../../pickup/vol34/images/bg_pickup.jpg);}
.vol35JP #pickupArea{background-image: url(../../pickup/vol35/images/bg_pickup.jpg);}
.vol36JP #pickupArea{background-image: url(../../pickup/vol36/images/bg_pickup.jpg);}
.vol37JP #pickupArea{background-image: url(../../pickup/vol37/images/bg_pickup.jpg);}
.vol38JP #pickupArea{background-image: url(../../pickup/vol38/images/bg_pickup.jpg);}
.vol39JP #pickupArea{background-image: url(../../pickup/vol39/images/bg_pickup.jpg);}
.vol40JP #pickupArea{background-image: url(../../pickup/vol40/images/bg_pickup.jpg);}

.top #pickupArea #pickupBox{
	width:1000px;
	margin:0 auto;
}
.top #pickupArea #pickupBox #pickupMark{
	text-align:center;
	letter-spacing:1px;
	font-size:18px;
	line-height:1.0;
	font-weight:400;
	border:1px solid #ffffff;
	display:table;
	margin:0 auto 30px;
	padding:3px;
}
.top #pickupArea #pickupBox #pickupMark span{
	font-size:12px;
}
.top #pickupArea #pickupBox h1{
	text-align:center;
	font-size:54px;
	line-height:62px;
	letter-spacing:2px;
	color:#ffffff;
	font-weight:800;
	margin-bottom:20px;
}
.top #pickupArea #pickupBox p{
	color:#ffffff;
	text-align:center;
	font-size:90%;
	margin-bottom:60px;
}
.top #pickupArea #pickupBox ul{
	margin:0 !important;
	padding:0 !important;
	overflow:visible;
}
.top #pickupArea #pickupBox ul li{
	background-color: #ffffff;
	width:270px;
	padding:20px;
	margin-right:30px;
	position:relative;
	font-size:13px;
	line-height:22px;
	display:inline-table;
	overflow:visible;
	transition: background-color 0.3s;
}
.top #pickupArea #pickupBox ul li:hover{
	background-color:#e5f6f7;
}

.top #pickupArea #pickupBox ul li.ico01:before{
	content:url(../images/top/pickup_no01.png);
	position:absolute;
	top:-25px;
	left:0;
}
.top #pickupArea #pickupBox ul li.ico02:before{
	content:url(../images/top/pickup_no02.png);
	position:absolute;
	top:-25px;
	left:0;
}
.top #pickupArea #pickupBox ul li.ico03:before{
	content:url(../images/top/pickup_no03.png);
	position:absolute;
	top:-25px;
	left:0;
}
.top #pickupArea #pickupBox ul li.ico04:before{
	content:url(../images/top/pickup_no04.png);
	position:absolute;
	top:-25px;
	left:-1px;
}
.top #pickupArea #pickupBox ul li.ico05:before{
	content:url(../images/top/pickup_no05.png);
	position:absolute;
	top:-25px;
	left:-1px;
}
.top #pickupArea #pickupBox ul li:last-child{
	margin-right:0px;
}
.top #pickupArea #pickupBox ul li div {
	margin-bottom:20px;
	padding-top:20px;
	background: url(../images/ico_linkGreen.png) no-repeat right top;
}
.top #pickupArea #pickupBox ul li div a{
	font-size:22px;
	letter-spacing:1px;
	display:block;
	line-height:32px;
	font-weight:700;
	margin-bottom:10px;
}
.top #pickupArea #pickupBox ul li img{
	height: auto;
}

/* vol.29- --------------------------------- */
.top #pickupArea #pickupBox h1 span{
	font-size:30px;
	font-weight:600;
}
.top #pickupArea #pickupBox ul#twopickup li{
	width:442px;
}

/* vol.36 --------------------------------- */
.vol36 #pickupArea #pickupBox h1{margin-bottom: 45px;}
.vol36 #pickupArea #pickupBox ul#twopickup li{
	width:442px;
}
.vol36 #pickupArea #pickupBox ul#twopickup li:nth-child(1){
	width: 100%;
	margin: 0 0 40px 0;
	box-sizing: border-box;
}
.vol36 #pickupArea #pickupBox ul#twopickup li:nth-child(2),
.vol36 #pickupArea #pickupBox ul#twopickup li:nth-child(3){margin-bottom: 40px;}
.vol36 #pickupArea #pickupBox ul#twopickup li:nth-child(3),
.vol36 #pickupArea #pickupBox ul#twopickup li:nth-child(5){margin-right: 0px;}

/* vol.40 --------------------------------- */
.vol40JP #pickupArea #pickupBox ul{
	width: 70%;
	margin: 0 auto !important;
}
.vol40JP #pickupArea #pickupBox ul#twopickup li {
	width: 100%;
	box-sizing: border-box;
}



/* =========================================
	
	メッセージ
	
========================================= */
.top #messageArea{
	width:100%;
	min-width:1200px;
	padding:130px 0;
	background:#00a7ac no-repeat center center;
	background-size:cover;
}
.vol31JP #messageArea{background-image: url(../../shared/images/top/vol31/bg_message.jpg);}
.vol32JP #messageArea{background-image: url(../../shared/images/top/vol32/bg_message.jpg);}
.vol39JP #messageArea{background-image: url(../../shared/images/top/vol39/bg_message.jpg);}
.vol40JP #messageArea{
	background-image: url(../../shared/images/top/vol40/bg_message.jpg);
	padding: 0;
}
.top #messageArea h1{
	width: 718px;
	margin: 0 auto;	
}
.top #messageArea p{
	width: 400px;
	margin: 30px auto 0;
}
.top #messageArea a{
	border:1px solid #fff;
	text-decoration:none;
	text-align:center;
	padding:10px;
	font-size: 14px;
	color: #ffffff;
	display:block;
	letter-spacing:1px;
	opacity: 1.0;
	transition: opacity 0.3s;
}
.top #messageArea a:hover{
	opacity: 0.55;
}

.vol40JP #messageArea a{
	border:none;
	padding:130px 0;
}
.vol40JP #messageArea a:hover{
	opacity: 1;
}
.vol40JP #messageArea p{
	width: 400px;
	border: 1px solid #fff;
	line-height: 50px;
	text-align: center;
	margin: 30px auto 0;
	opacity: 1.0;
	transition: opacity .2s;
	font-size: 14px;
}
.vol40JP #messageArea p:hover{
	opacity: 0.55;
}


/* =========================================

	頑固者に学ぶ 

========================================= */
.top #specialistArea{
	width:100%;
	min-width:1200px;
	padding:80px 0 60px;
	background:#eee;
}
.top #specialistArea #specialistBox{
	width:1000px;
	margin:0 auto;
}
.top #specialistArea #specialistBox #specialistTitle{
	display:table;
	height:100%;
	margin-bottom:20px;
}
.top #specialistArea #specialistBox #specialistTitle p{
	width:720px;
	color:#333f48;
	height:100%;
	font-size:13px;
	line-height:1.8;
	letter-spacing:0.5px;
	background-color:#fff;
	display:table-cell;
	padding:10px 20px;
	vertical-align:middle;
}
.top #specialistArea #specialistBox #specialistTitle p#titletxt{
	width:230px;
	padding:10px 0px;
	border-right:10px solid #eee;
	font-weight:700;
	font-size:22px;
	line-height:1.0;
	text-align:center;
}
.china #specialistArea #specialistBox #specialistTitle p#titletxt{
	width:320px;
}
.top #specialistArea #specialistBox #specialistTitle p#titletxt span{
	font-weight:400;
	font-size:12px;
	letter-spacing:1px;
	color:#00a7ac;
}
.top #specialistArea #specialistBox h1{
	text-align:center;
	font-size:54px;
	line-height:64px;
	letter-spacing:3px;
	color:#333f48;
	font-weight:800;
	margin-bottom:20px;
}
.top #specialistArea #specialistBox #specialistPht{
	margin-bottom:30px;
}
.top #specialistArea #specialistBox #specialistPht p{
	width:480px;
	float:left;
	margin-right:40px;
	text-align:center;
	font-size:13px;
	line-height:1.6;
	letter-spacing:1px;
}
.top #specialistArea #specialistBox #specialistPht p:last-child{
	margin-right:0px;
}
.top #specialistArea #specialistBox #specialistPht p img{
	display:block;
	margin-bottom:5px;
}
.top #specialistArea #specialistBox #specialistPht p span{
	font-size:24px;
	line-height:1.8;
	letter-spacing:5px;
	font-weight:800;
}
.top #specialistArea #specialistBox #specialistBtn{
	width:100%;
}
.top #specialistArea #specialistBox #specialistBtn a{
	display:block;
	background-color:#333f48;
	padding:16px 0;
	font-size: 18px;
	font-weight: 500;
	text-align:center;
	color:#ffffff;
	text-decoration:none;
	letter-spacing:3px;
	transition: all 0.3s;
}
.top #specialistArea #specialistBox #specialistBtn a:hover{
	background-color:#515c63;
}

/* vol.29- --------------------------------- */
.top #specialistArea #specialistBox .linkBox{
	opacity:1.0;
	transition:opacity linear 0.2s;
}
.top #specialistArea #specialistBox .linkBox:hover{
	opacity:0.75;
}
.top #specialistArea #specialistBox #specialistProfile{
	display:table;
	margin:20px auto;
}
.top #specialistArea #specialistBox #specialistProfile h1{
	display:table-cell;
	vertical-align:middle;
	padding-right:30px;
}
.top #specialistArea #specialistBox #specialistProfile p{
	display:table-cell;
	color:#333f48;
	font-size:13px;
	line-height:1.5;
	vertical-align:middle;
	padding-left:35px;
	border-left:1px solid #333f48;
}
.top #specialistArea #specialistBox #specialistProfile p strong{
	font-size:18px;
	padding-top:3px;
	letter-spacing:5px;
	font-weight:700;
}
.top #specialistArea #specialistBox  p .icoLinkGlay{
	line-height:1.6;
}

/* vol.40- --------------------------------- */
.vol40JP #specialistArea{
	width:100%;
	min-width:1200px;
	padding: 40px 0 40px;
	background:#eee;
}
/* =========================================

	トリビア 

========================================= */
.top #triviaArea{
	width:100%;
	min-width:1200px;
	padding:60px 0;
}
.top #triviaBox{
	width:1000px;
	margin: 0 auto;
}
.top .triviaCon{
	width:1000px;
	display: flex;
	-webkit-display: flex;
	-ms-display: flex;
	margin:30px auto !important;
	justify-content:space-between;
}
.top .triviaCon div{
	width:48%;
}
.top #triviaBox a{
	display: block;
	opacity:1.0;
	transition:opacity linear 0.2s;
	text-decoration: none;
}
.top #triviaBox a:hover{
	opacity:0.75;
}


/* vol.40- --------------------------------- */
.vol40JP #triviaArea{
	width: 100%;
	min-width: 1200px;
	padding: 40px 0;
}
#triviaArea .caption {
	position: relative;
	z-index: 2;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	margin: -20px auto 0;
	max-width: 90%;
	height: 90px;
	text-align: center;
	font-size: 1rem;
	color: #000;
	background: #fff;
	border: solid 1px #000;
	line-height: 1.6;
}

/* =========================================
	
	topics・Download
	
========================================= */
.top #otherArea{
	width:100%;
	min-width:1200px;
	padding: 0 0 80px;
	background:#fff;
	position:relative;
}
.top #otherArea:before{
	content:"";
	width:50%;
	height:12px;
	border-top:#00a7ac solid 12px;
	position:absolute;
	left:0;
	top:0;
}
.top #otherArea #otherBox{
	width:1000px;
	padding:80px 0;
	margin:0 auto;
	background:#fff;
	position:relative;
}
.top #otherArea #otherBox:before{
	content:"";
	width:100%;
	height:12px;
	background: url(../images/line_cut.png) #fff no-repeat left top;
	position:absolute;
	left:0;
	top:0;	
}

/* topics ------------------------------------------- */
.top #otherArea #otherBox #topicsArea{
	width:480px;
	float:left;
	margin-right:40px;	
}
.top #otherArea #otherBox #topicsArea h1{
	color:#00a7ac;
	font-weight:800;
	font-size:16px;
	letter-spacing:0.5px;
	margin-bottom:40px;
}
.top #otherArea #otherBox #topicsArea ul li{
	width:100%;
	border-bottom:dotted 1px #00a7ac;
	display:table;
}
.top #otherArea #otherBox #topicsArea ul li:first-child{
	border-top:solid 1px #00a7ac;
}
.top #otherArea #otherBox #topicsArea ul li:last-child{
	border-bottom:solid 1px #00a7ac;
}
.top #otherArea #otherBox #topicsArea ul li a{
	display:table;
	width:440px;
	padding:20px;	
	vertical-align:middle;
	text-decoration:none;
	background-color:inherit;
	transition: all 0.3s;
}
.top #otherArea #otherBox #topicsArea ul li a:hover{
	background-color:#e5f6f7;
}
.top #otherArea #otherBox #topicsArea ul li a img{
	display:table-cell;
	width:80px;
	height:80px;
	margin-right:20px;
}
.top #otherArea #otherBox #topicsArea ul li a p{
	display:table-cell;
	width:320px;
	padding-right:50px;
	background: url(../images/ico_linkGreen.png) no-repeat right 72%;
	font-size:14px;
	line-height:1.6;
	color:#333333;
	vertical-align:middle;
}

/* vol29- */
.top #otherArea #otherBox #topicsArea ul li a p span{
	display:inline-block;
	background-color:#00a7ac;
	color:#ffffff;
	font-size:12px;
	font-weight:500;
	letter-spacing:1.5px;
	line-height:1;
	padding:2px 3px 3px;
	margin:0 auto 4px;
}



/* download ---------------------------------- */
.top #otherArea #otherBox #downloadArea{
	width:480px;
	float:left;
}
.top #otherArea #otherBox #downloadArea h1{
	color:#00a7ac;
	font-weight:800;
	font-size:16px;
	letter-spacing:0.5px;
	margin-bottom:40px;
}
.top #otherArea #otherBox #downloadArea #downloadBox{
	width:300px;
	margin:0 auto;
	position:relative;
}
.top #otherArea #otherBox #downloadArea #downloadBox p{
	width:300px;
	height:283px;
	margin-bottom:30px;
	position:relative;
}
.top #otherArea #otherBox #downloadArea #downloadBox p:before{
	content:"";
	width:100%;
	height:183px;
	background-color:#e5f6f7;
	position:absolute;
	top:50px;
	left:0;
}
.top #otherArea #otherBox #downloadArea #downloadBox p img{
	width:200px;
	position:absolute;
	top:0;
	left:50px;
}
.top #otherArea #otherBox #downloadArea #downloadBox a{
	border:1px solid #00a7ac;
	text-decoration:none;
	text-align:center;
	padding:8px;
	display:block;
	font-size:13px;
	letter-spacing:1px;
	font-weight:700;
	background-color:#ffffff;
	transition: all 0.3s;
}
.top #otherArea #otherBox #downloadArea #downloadBox a:hover{
	background-color:#e5f6f7;
}

/* 180207_カレンダー追加*/
.top #otherArea #otherBox #downloadArea #downloadBox2{}
.top #otherArea #otherBox #downloadArea #downloadBox2 #download_calendar{
	float: right;
}
.top #otherArea #otherBox #downloadArea #downloadBox2 .download_innerBox{
	float: left;
	width: 230px;
	position: relative;
}
.top #otherArea #otherBox #downloadArea #downloadBox2 .download_innerBox p{
	width:230px;
	height:226px;
	margin-bottom:30px;
	position:relative;
}
.top #otherArea #otherBox #downloadArea #downloadBox2 .download_innerBox p:before{
	content:"";
	width:100%;
	height:160px;
	background-color:#e5f6f7;
	position:absolute;
	top:33px;
	left:0;
}
.top #otherArea #otherBox #downloadArea #downloadBox2 .download_innerBox p img{
	width:160px;
	position:absolute;
	top:0;
	left:35px;
}
.top #otherArea #otherBox #downloadArea #downloadBox2 .download_innerBox a{
	border:1px solid #00a7ac;
	text-decoration:none;
	text-align:center;
	padding:8px;
	display:block;
	font-size:13px;
	letter-spacing:1px;
	font-weight:700;
	background-color:#ffffff;
	transition: all 0.3s;
}
.top #otherArea #otherBox #downloadArea #downloadBox2 .download_innerBox a:hover{
	background-color:#e5f6f7;
}

/* vol.31 -------------------- */
.vol31 #otherArea #otherBox #downloadArea,
.vol32 #otherArea #otherBox #downloadArea,
.vol34 #otherArea #otherBox #downloadArea,
.vol36 #otherArea #otherBox #downloadArea{
	float: none;
	margin: auto;
}

/* 190226_34号スペシャルトピックス */
/* 200313_37号新機種紹介 */
/* VOl40_SK500 */
.vol34JP #sptopicsIE,
.vol37JP #sptopicsIE,
.vol40JP #sptopicsIE {
	width: 100%;
	min-width:1200px;
	height: 460px;
	position: relative;
	overflow: hidden;
}
.vol34JP #sptopicsArea,
.vol37JP #sptopicsArea,
.vol40JP #sptopicsArea {
	width: 100%;
	min-width:1200px;
	height: 460px;
	display: table;
	text-align: center;
}
.vol34JP #sptopicsArea::after,
.vol37JP #sptopicsArea::after,
.vol40JP #sptopicsArea::after{
	content: "";
	position:absolute;
	width: 100%;
	height: 460px;
	background: url(../images/top/vol34/bg_sptopics.jpg) no-repeat center center;
	background-size: cover;
	top: 0;
	left: 0;
	z-index: -1;
	transition: all .2s ease-out;
}
.vol37JP #sptopicsArea::after {
	background: url(../images/top/vol37/bg_sptopics.jpg) no-repeat center center;
}
.vol40JP #sptopicsArea::after {
	background: url(../images/top/vol40/bg_sptopics.jpg) no-repeat center center;
}
.vol34JP #sptopicsArea:hover::after,
.vol37JP #sptopicsArea:hover::after {
	-moz-transform: scale(1.03);
    -webkit-transform: scale(1.03);
    -ms-transform: scale(1.03);
    transform: scale(1.03);
}
.vol34JP #sptopicsArea #sptopicsBox,
.vol37JP #sptopicsArea #sptopicsBox,
.vol40JP #sptopicsArea #sptopicsBox{
	display: table-cell;
	vertical-align: middle;
	letter-spacing: 0.15em;
	color: #fff;
	text-decoration: none;
}
.vol34JP #sptopicsArea #sptopicsBox p:first-child,
.vol37JP #sptopicsArea #sptopicsBox p:first-child,
.vol40JP #sptopicsArea #sptopicsBox p:first-child{
	background-color: #00a7ac;
	margin: 0 auto 30px;
	display: inline-block;
	padding: 3px 5px 4px 5px;
	line-height: 1.0;
	font-size: 13px;
	font-weight: 700;	
}
.vol34JP #sptopicsArea #sptopicsBox h1,
.vol37JP #sptopicsArea #sptopicsBox h1,
.vol40JP #sptopicsArea #sptopicsBox h1{
	font-weight: 800;
	font-size: 56px;
	line-height: 1.0;
	letter-spacing: 0.2em;
	text-shadow:0px 0px 6px #333;
	margin-bottom: 10px;
}
.vol37JP #sptopicsArea #sptopicsBox h1,
.vol40JP #sptopicsArea #sptopicsBox h1{
	letter-spacing: 0.1em;
}
.vol34JP #sptopicsArea #sptopicsBox h1 span,
.vol37JP #sptopicsArea #sptopicsBox h1 span,
.vol40JP #sptopicsArea #sptopicsBox h1 span{
	display: block;
	font-size: 20px;
	font-weight: 400;
	margin-bottom: 12px;
}
.vol34JP #sptopicsArea #sptopicsBox p.btn_link,
.vol37JP #sptopicsArea #sptopicsBox p.btn_link {
	width: 380px;
	border: 1px solid #fff;
	line-height: 60px;
	text-align: center;
	margin: 30px auto 0;
	opacity: 1.0;
	transition: opacity .2s;
}

.vol40JP #sptopicsArea #sptopicsBox p.btn_link {
	width: 400px;
	border: 1px solid #fff;
	line-height: 50px;
	text-align: center;
	margin: 30px auto 0;
	opacity: 1.0;
	transition: opacity .2s;
	font-size: 14px;
}
.vol34JP #sptopicsArea #sptopicsBox p.btn_link:hover,
.vol37JP #sptopicsArea #sptopicsBox p.btn_link:hover,
.vol40JP #sptopicsArea #sptopicsBox p.btn_link:hover {
    opacity: 0.7;
}



/****************************** PC限定 ******************************/
@media screen and (min-width: 768px){

}

/****************************** SP限定 ******************************/
@media screen and (max-width: 767px){


/* SP_表紙 ========================================= */
.top #coverArea{
	min-width:100%;
	height:100%;
	margin-bottom: 20px;
	display:block;
	position: relative;
	/*width:100%;*/
}
.top #coverArea #slider{
	float:none;
	width:100%;
	height:56% !important;
	display:block;
	margin-bottom: 0;
	/*background-color:#00a7ac;
	background-size:cover;*/
}
.top #coverArea #titleBox{
	float:none;
	width:100%;
	height:44%;
	padding:0;
	margin: 0;
	display:block;
	position: relative;
}
.top #coverArea #titleBox:before{
	display: none;
}
.top #coverArea #titleBox:after{
	display: none;
}
.top #coverArea #titleBox #title{
	width:80%;
	margin:0 auto;
	-webkit-transform:none; 
	transform:none;
	padding-bottom: 0px;
	position:absolute;
	top: 50%;
	left: 50%;
	margin-right: -50%;
	-webkit-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
	
}
.top #coverArea #titleBox #title h1{
	width:50%;
	margin:0px auto 15px;
}
.top #coverArea #titleBox #title p{
	font-size:13px;
	line-height:22px;
	margin-bottom:20px;
}
.top #coverArea #titleBox #title p#volume{
	text-align:center;
	/*font-weight:700;
	letter-spacing:1px;
	margin:0;*/
}
.top #coverArea #titleBox #title p#volume span{
	/*font-weight:300;
	padding-left:10px;*/

}
.top #coverArea #titleBox #title p#theme{
	text-align:center;
	font-size:20px;
	padding:10px 0;
	/*background-color:#00a7ac;
	margin:0;
	line-height:1.0;
	letter-spacing:1px;
	font-weight:700;
	color:#ffffff;
	position:relative;*/
}
.top #coverArea #titleBox #title p#theme:before{
	/*position:absolute;
	content:"";
	top:0;
	left:0;
	width: 0;
	height: 0;
	border-style: solid;*/
	border-width: 14px 14px 0 0;
	border-color: #ffffff transparent transparent transparent;
}
.top #coverArea #titleBox #title p#theme:after{
	/*position:absolute;
	content:"";
	bottom:0;
	right:0;
	width: 0;
	height: 0;
	border-style: solid;*/
	border-width: 0 0 14px 14px;
	border-color: transparent transparent #ffffff transparent;
}
.top #coverArea #titleBox #title p#theme span{
	position:absolute	;
	top:3px;
	left:14px;
	color:#ffffff;
	text-align:left;
	font-size:12px;
}

/* vol.30 -------------------- */
/* vol.37 -------------------- */ 
/* vol.38 -------------------- */    
.vol30 #coverArea #titleBox #newyear,
.vol37 #coverArea #titleBox #ico_90th,
.vol38 #coverArea #titleBox #ico_90th,  
.vol39 #coverArea #titleBox #ico_90th  {
	width: 100px;
	height: 100px;
	top: -50px;
	left: 15px/*calc(50% - 70px)*/;
	/*background: url(../images/top/vol30/img_newyear.png) no-repeat;
	background-size: contain;
	display: block;
	position: absolute;
	z-index: 1000;*/
}
.vol37 #coverArea #titleBox #ico_90th,
.vol38 #coverArea #titleBox #ico_90th    {
	left: 20px
}



/* SP_特集 ========================================= */
.top #pickupArea{
	min-width:100%;
	padding:50px 0 40px;
	/*width:100%;
	background:#00a7ac no-repeat center top;
	background-size:cover;*/
}
.vol28JP #pickupArea{
	/*background-image: url(../images/top/vol28/bg_pickup.jpg);*/
}
.top #pickupArea #pickupBox{
	width:90%;
	padding: 0 5%;
	/*margin:0 auto;*/
}
.top #pickupArea #pickupBox #pickupMark{
	font-size:16px;
	margin:0 auto 20px;
	/*text-align:center;
	letter-spacing:1px;
	line-height:1.0;
	font-weight:400;
	border:1px solid #ffffff;
	display:table;
	padding:3px;*/
}
.top #pickupArea #pickupBox #pickupMark span{
	/*font-size:12px;*/
}
.top #pickupArea #pickupBox h1{
	font-size:30px;
	line-height:40px;
	letter-spacing:1px;
	/*text-align:center;
	font-weight:800;
	color:#ffffff;
	margin-bottom:20px;*/
}
.top #pickupArea #pickupBox h1 span{
	line-height: 30px;
	display: block;
	margin-top: 10px;
}
.top #pickupArea #pickupBox p{
	font-size:14px;
	text-align:left;
	margin-bottom:50px;
	/*color:#ffffff;*/
}
.top #pickupArea #pickupBox ul{
	/*margin:0 !important;
	padding:0 !important;
	overflow:visible;*/
}
.top #pickupArea #pickupBox ul li{
	width:90%;
	padding:5%;
	margin-bottom:35px;
	display:block;
	font-size:14px;
	/*background-color: #ffffff;
	position:relative;
	line-height:22px;
	overflow:visible;
	transition: all 0.3s;*/
}
.top #pickupArea #pickupBox ul li:hover{
	/*background-color:#e5f6f7;*/
}

.top #pickupArea #pickupBox ul li.ico01:before{
	/*content:url(../images/top/pickup_no01.png);
	position:absolute;
	top:-25px;
	left:0;*/
}
.top #pickupArea #pickupBox ul li.ico02:before{
	/*content:url(../images/top/pickup_no02.png);
	position:absolute;
	top:-25px;
	left:0;*/
}
.top #pickupArea #pickupBox ul li.ico03:before{
	/*content:url(../images/top/pickup_no03.png);
	position:absolute;
	top:-25px;
	left:0;*/
}
.top #pickupArea #pickupBox ul li:last-child{
	/*margin-right:0px;*/
}
.top #pickupArea #pickupBox ul li div {
	/*margin-bottom:20px;
	padding-top:20px;
	background: url(../images/ico_linkGreen.png) no-repeat right top;*/
}
.top #pickupArea #pickupBox ul li div a{
	font-size:18px;
	line-height:28px;
	/*letter-spacing:1px;
	display:block;
	font-weight:700;
	margin-bottom:10px;*/
}
/* vol.29- --------------------------------- */
.top #pickupArea #pickupBox h1 span{
	font-size:18px;
	font-weight:500;
	line-height: 1.8;
    display: block;
    margin-top: 10px;
}
.top #pickupArea #pickupBox ul#twopickup li{
	width:90%;
}
.top #pickupArea #pickupBox ul#twopickup li:last-child{
	margin-bottom:10px;
}
/* vol.40 --------------------------------- */
.vol40JP #pickupArea #pickupBox ul{
	width: 100%;
}
.vol40JP #pickupArea #pickupBox ul#twopickup li {
	width: 100%;
	box-sizing: border-box;
}

/* =========================================
	
	SP_メッセージ
	
========================================= */
.top #messageArea{
	min-width:100%;
	padding:50px 0;
	/*width:100%;
	background:#00a7ac no-repeat center center;
	background-size:cover;*/
}
.top #messageArea h1{
	width: 90%;
	margin: 0 auto;	
}
.top #messageArea p{
	width: 90%;
	margin: 20px auto 0;
}
.top #messageArea a{font-size: 13px;}
	
/* vol.40 --------------------------------- */
.vol40JP #messageArea a{
	border:none;
	padding:0;
}
.vol40JP #messageArea p{
	width: 75%;
	margin: 20px auto 0;
	line-height: 42px;
}
.vol40JP #messageArea img{
	width: 85%;
	margin-bottom: 15px;
}



/* SP_頑固者に学ぶ ========================================= */
.top #specialistArea{
	min-width:100%;
	padding:50px 0;
	/*width:100%;
	background:#eee;*/
}
.vol40JP #specialistArea{
	min-width:100%;
	padding:30px 0;
	/*width:100%;
	background:#eee;*/
}
.top #specialistArea #specialistBox{
	width:90%;
	padding: 0 5%;
	/*margin:0 auto;*/
}
.top #specialistArea #specialistBox #specialistTitle{
	height:auto;
	display:block;
	
	margin-bottom:30px;
}
.top #specialistArea #specialistBox #specialistTitle p{
	width:90%;
	height:auto;
	display:block;
	padding:0 5% 5%;
}
.top #specialistArea #specialistBox #specialistTitle p#titletxt{
	width:90%;
	padding:5% 5% 3%;
	border-right:0;
	font-size:16px;
}
.top #specialistArea #specialistBox #specialistTitle p#titletxt span{
	font-weight:400;
	font-size:12px;
	letter-spacing:1px;
	color:#00a7ac;
}
.top #specialistArea #specialistBox h1{
	font-size:30px;
	line-height:40px;
	letter-spacing:2px;
	/*color:#333f48;
	text-align:center;
	font-weight:800;
	margin-bottom:20px;*/
}
.top #specialistArea #specialistBox #specialistPht{
	margin-bottom:20px;
}
.top #specialistArea #specialistBox #specialistPht p{
	width:48.5%;
	margin-right:3%;
	font-size:12px;
	line-height:1.5;
	letter-spacing:0px;
	/*float:left;
	text-align:center;*/
}
.top #specialistArea #specialistBox #specialistPht p:last-child{
	/*margin-right:0px;*/
}
	
.top #specialistArea #specialistBox #specialistPht p img{
	/*display:block;
	margin-bottom:5px;*/
}
.top #specialistArea #specialistBox #specialistPht p span{
	font-size:16px;
	line-height:1.7;
	letter-spacing:3px;
	/*font-weight:800;*/
}
.top #specialistArea #specialistBox #specialistBtn{
	/*width:100%;*/
}
.top #specialistArea #specialistBox #specialistBtn a{
	font-size: 15px;
	padding:10px 0;
	letter-spacing:1px;
	font-weight: 400;
}


/* vol.29- --------------------------------- */
/*.top #specialistArea #specialistBox .linkBox{
	opacity:1.0;
	transition:opacity linear 0.2s;
}
.top #specialistArea #specialistBox .linkBox:hover{
	opacity:0.75;
}*/
.top #specialistArea #specialistBox #specialistProfile{
	/*display:table;*/
	margin:10px auto 0;
}
.top #specialistArea #specialistBox #specialistProfile h1{
	/*display:table-cell;
	vertical-align:middle;
	padding-right:20px;*/
	font-size:22px;
	line-height:30px;
}
.top #specialistArea #specialistBox #specialistProfile p{
	/*display:table-cell;
	color:#333f48;*/
	font-size:12px;
	line-height:1.4;
	padding-left:20px;
	/*vertical-align:middle;
	border-left:1px solid #333f48;*/
}
.top #specialistArea #specialistBox #specialistProfile p strong{
	font-size:15px;
	letter-spacing:1px;
	/*padding-top:3px;
	font-weight:700;*/
}
.top #specialistArea #specialistBox  p .icoLinkGlay{
	line-height:1.6;
}
/* vol.40- --------------------------------- */
	
.vol40JP #specialistArea #specialistBox #specialistProfile h1{
	font-size:17px;
}

/* =========================================

	トリビア 

========================================= */
.top #triviaArea{
	width:100%;
	min-width:inherit;
	padding:0;
}
.top #triviaBox{
	width:100%;
	/*margin: 0 auto;*/
}
/*.top #triviaBox a{
	opacity:1.0;
	transition:opacity linear 0.2s;
}
.top #triviaBox a:hover{
	opacity:0.75;
}*/
	
/* vol.40- --------------------------------- */

.vol40JP #triviaArea .caption {
	margin: -10px auto 0;
	max-width: 85%;
	height: auto;
	line-height: 1.6;
	font-size: 13px;
	padding: 10px 0;
}


/* SP_topics・Download ========================================= */

.top #otherArea{
	min-width:100%;
	padding: 0 0 50px;
	position:relative;
	/*width:100%;
	background:#fff;*/
}
.top #otherArea:before{
	content:"";
	width:50%;
	height:12px;
	border-top:#00a7ac solid 12px;
	position:absolute;
	left:0;
	top:0;
}
.top #otherArea #otherBox{
	width:90%;
	padding:30px 0 0 0;
	margin:0 5%;
	/*background:#fff;
	position:relative;*/
}



/* SP_topics ------------------------------------------- */
.top #otherArea #otherBox #topicsArea{
	width:100%;
	float:none;
	margin:0 0 30px 0;
}
.top #otherArea #otherBox #topicsArea h1{
	margin-bottom:20px;
	/*color:#00a7ac;
	font-weight:800;
	font-size:16px;
	letter-spacing:0.5px;*/
}
.top #otherArea #otherBox #topicsArea ul li{
	/*width:100%;
	border-bottom:dotted 1px #00a7ac;
	display:table;*/
}
.top #otherArea #otherBox #topicsArea ul li:first-child{
	/*border-top:solid 1px #00a7ac;*/
}
.top #otherArea #otherBox #topicsArea ul li:last-child{
	/*border-bottom:solid 1px #00a7ac;*/
}
.top #otherArea #otherBox #topicsArea ul li a{
	width:94%;
	padding:5% 3%;	

	/*display:table;
	vertical-align:middle;
	text-decoration:none;
	background-color:inherit;
	transition: all 0.3s;*/
}
.top #otherArea #otherBox #topicsArea ul li a:hover{
	/*background-color:#e5f6f7;*/
}
.top #otherArea #otherBox #topicsArea ul li a img{
	display: block;
	float:left;
	width:18%;
	height:18%;
	margin-right:0;
	/*display:table-cell;*/
}
.top #otherArea #otherBox #topicsArea ul li a p{
	font-size:13px;
	display:block;
	float: right;
	width:65%;
	padding-right:12%;
	background: url(../images/ico_linkGreen.png) no-repeat right 72%;
	/*line-height:1.6;
	color:#333333;
	vertical-align:middle;*/
}
/* vol29- */
.top #otherArea #otherBox #topicsArea ul li a p span{
	font-size:12px;
	font-weight:400;
}



/* SP_download ---------------------------------- */
.top #otherArea #otherBox #downloadArea{
	width:100%;
	float:none;
}
.top #otherArea #otherBox #downloadArea h1{margin-bottom:30px;}
.top #otherArea #otherBox #downloadArea #downloadBox{width:75%;}
.top #otherArea #otherBox #downloadArea #downloadBox p{
	width:100%;
	height:200px;
	margin-bottom:40px;
	/*position:relative;*/
}
.top #otherArea #otherBox #downloadArea #downloadBox p:before{
	width:100%;
	height:150px;
	top:25px;
	/*background-color:#e5f6f7;
	content:"";
	position:absolute;
	left:0;*/
}
.top #otherArea #otherBox #downloadArea #downloadBox p img{
	width:150px;
	height: auto;
	position:absolute;
	top: 50%;
	left: 50%;
	margin-right: -50%;
	-webkit-transform: translate(-50%, -50%); /* Safari用 */
	transform: translate(-50%, -50%);
}
.top #otherArea #otherBox #downloadArea #downloadBox a{
	/*border:1px solid #00a7ac;
	text-decoration:none;
	text-align:center;
	padding:8px;
	display:block;
	font-size:13px;
	letter-spacing:1px;
	font-weight:700;
	background-color:#ffffff;
	transition: all 0.3s;*/
}
.top #otherArea #otherBox #downloadArea a:hover{
	/*background-color:#e5f6f7;*/
}


/* 180207_カレンダー追加*/
.top #otherArea #otherBox #downloadArea #downloadBox2{}
.top #otherArea #otherBox #downloadArea #downloadBox2 #download_book{margin-bottom: 30px;}
.top #otherArea #otherBox #downloadArea #downloadBox2 #download_calendar{float: none;}
.top #otherArea #otherBox #downloadArea #downloadBox2 .download_innerBox{
	float: none;
	width: 100%;
	margin: 0 auto;
}
.top #otherArea #otherBox #downloadArea #downloadBox2 .download_innerBox p{
	width:100%;
	height:212px;
	margin-bottom:10px;
}
.top #otherArea #otherBox #downloadArea #downloadBox2 .download_innerBox p:before{
	content:"";
	width:100%;
	height:150px;
	top:31px;
}
.top #otherArea #otherBox #downloadArea #downloadBox2 .download_innerBox p img{
	width:150px;
	height: auto;
	position:absolute;
	top: 50%;
	left: 50%;
	margin-right: -50%;
	-webkit-transform: translate(-50%, -50%); /* Safari用 */
	transform: translate(-50%, -50%);
}


/* 190226_34号スペシャルトピックス */
/* 200313_37号新機種紹介 */    
.vol34JP #sptopicsIE,
.vol37JP #sptopicsIE,
.vol40JP #sptopicsIE	{
	min-width:100%;
	height: 240px;
}
.vol34JP #sptopicsArea,
.vol37JP #sptopicsArea,
.vol40JP #sptopicsArea	{
	width: 100%;
	min-width: 100%;
	height: 240px;
}
.vol34JP #sptopicsArea::after,
.vol37JP #sptopicsArea::after,
.vol40JP #sptopicsArea::after	{
	content: "";
	position: absolute;
	width: 100%;
	height: 240px;
	background: url(../images/top/vol34/bg_sptopics.jpg) no-repeat center center;
	background-size: cover;
	top: 0;
	left: 0;
	z-index: -1;
	transition: all .2s ease-out;
}
.vol37JP #sptopicsArea::after {
	background: url(../images/top/vol37/bg_sptopics.jpg) no-repeat center center;
	background-size: cover;
}
.vol40JP #sptopicsArea::after {
	background: url(../images/top/vol40/bg_sptopics.jpg) no-repeat center center;
	background-size: cover;
}    
.vol34JP #sptopicsArea:hover::after,
.vol37JP #sptopicsArea:hover::after {
    transform:none;
}
.vol34JP #sptopicsArea #sptopicsBox,
.vol37JP #sptopicsArea #sptopicsBox,
.vol40JP #sptopicsArea #sptopicsBox{
	letter-spacing: 0.1em;
	position: relative;
	width: 100%;
}
.vol34JP #sptopicsArea #sptopicsBox p:first-child,
.vol37JP #sptopicsArea #sptopicsBox p:first-child,
.vol40JP #sptopicsArea #sptopicsBox p:first-child	{
	font-size: 12px;
	font-weight: 400;
	margin: 0 auto 10px;
	padding: 3px 5px 4px;
}
.vol34JP #sptopicsArea #sptopicsBox h1,
.vol37JP #sptopicsArea #sptopicsBox h1,
.vol40JP #sptopicsArea #sptopicsBox h1	{
	font-weight: 700;
	font-size: 22px;
	letter-spacing:0.2em;
	margin-bottom: 10px;
}
.vol40JP #sptopicsArea #sptopicsBox h1 span	{
	line-height: 1.4;
}
.vol34JP #sptopicsArea #sptopicsBox h1 span,
.vol37JP #sptopicsArea #sptopicsBox h1 span,
.vol40JP #sptopicsArea #sptopicsBox h1 span	{
	font-size: 14px;
	font-weight: 400;
	letter-spacing:0.1em;
	margin-bottom: 8px;
}
.vol34JP #sptopicsArea #sptopicsBox p.btn_link,
.vol37JP #sptopicsArea #sptopicsBox p.btn_link,
.vol40JP #sptopicsArea #sptopicsBox p.btn_link	{
	width: 75%;
	line-height: 42px;
	margin: 20px auto 0;
	font-size: 14px;
}
.vol34JP #sptopicsArea #sptopicsBox p.btn_link:hover,
.vol37JP #sptopicsArea #sptopicsBox p.btn_link:hover,
.vol40JP #sptopicsArea #sptopicsBox p.btn_link:hover	{
    opacity: 1.0;
}







}

@media screen and (max-width: 360px){

}