@charset "utf-8";
/* PhotoMagazine　INDEX page */

/***********************
reset
***********************/

p { margin: 0; }



/***********************
メインビジュアル
***********************/
#sect_mv {
	margin: 0 auto;
	position: relative;
}
#sect_mv .mvforPc {
	max-width: 1200px;
}
#sect_mv .ttl {
	position: absolute;
	top: 20%;
	right: 180px;
    text-align: center;
}
#sect_mv .ttl h1 {
	color: #202021;
	margin: 0;
	font-size: 2.9rem;
}
#sect_mv .ttl h1 span {
    padding-left: 1em;
	display: inline-block;
}
#sect_mv .ttl .subttl {
	font-size: 1.5rem;
	
}
#sect_mv .ttl img {
	width: 100%;
	max-width: 435px; 
}
#sect_mv .mvforSp {
	display: none;
}
.ttlh2 {
	font-weight: normal;
	margin: 30px auto;
	padding-left: 1em;
	font-size: 1.25rem;
	max-width: 34em;
}
@media screen and (max-width: 1200px) {
	#sect_mv .ttl {
		right: 1%;
	}
}
@media screen and (max-width: 980px) {
	article {
		margin-top: 50px;
	}
	#sect_mv .ttl {
		position: unset;
	}
	#sect_mv .ttl h1 {
		font-size: 2.5rem;
	}
	#sect_mv .ttl .subttl {
		font-size: 1.3rem;
	}
	#sect_mv .mvforSp {
		display: block;
		margin: 0 auto;
		width: 100%;
		max-width: 570px;
	}
	#sect_mv .mvforPc {
		display: none;
	}
	.ttlh2 {
		font-size: 0.95rem;
	}
}


/***********************
記事サムネイル
***********************/
#sect_tips {
	display: flex;
    flex-wrap: wrap;
	justify-content: center;
    margin: 0 auto 50px;
	font-size: 0;　/* hac */
}
#sect_tips .tips {
	width: 23%;
	max-width: 275px;
    margin: 10px;
	position: relative;
    background-color: #fff;
	box-shadow: 2px 0px 6px 1px #b5b9bb;
	border: 1px solid #d1cfcf;
}
#sect_tips .tips a:hover {
	opacity: 0.9;
	text-decoration: none;
	transition: .3s;
}
#sect_tips .tips:hover {
	box-shadow: 2px 0px 6px 1px #4f5457;
}
#sect_tips .tips img {
	width: 100%;	
}
#sect_tips .tips h3 {
	font-size: 1.2rem;
    padding: 1.2em 0.9em 0 2.5em;
    line-height: 1.3em;
    margin: 0;
    min-height: 2.6em;
}
#sect_tips .tips h3 span {
	display: inline-block;
}
#sect_tips .tips p {
	font-size: 1rem;
	line-height: 1.6em;
	padding: 1em;
	min-height: 6.5em;
}
#sect_tips .tips .flag {
	/*background-color: rgb(231 229 229 / 88%);*/
    border-left: 2px dotted rgba(0, 0, 0, .1);
    border-right: 2px dotted rgba(0, 0, 0, .1);
    box-shadow: 0 0 5px rgba(0,0,0,0.2);
    transform: rotate(-45deg);
    font-size: 16px;
    color: #000;
	padding: 5px 8px;
    line-height: 1;
    position: absolute;
    top: -1px;
    left: -15px;
    min-width: 2.4em;
    min-height: 1em;
	opacity: 0.7;
}

#sect_tips .tips.hiddenclass {
	height: 0;
	border: none;
	box-shadow: unset !important;
}

.flag.__cNew {
	background-color:#B22A2A;
	color: #FFF !important;
	opacity: unset !important;
}
.flag.__c01 {
	background-color:#b5cdd7;
}
.flag.__c02 {
	background-color:#dfedb1;
}
/*
.flag.__c03 {
	background-color:#cbc7c7;
}
.flag.__c04 {
	background-color:#dfcccc;
}
.flag.__c05 {
	background-color:#c0d7d5;
}
.flag.__c06 {
	background-color:#c9cdbc;
}
.flag.__c07 {
	background-color:#f0f1e7;
}
*/

.__SPX {
	display: none;
}


.thumSp {
	display: none;
}

@media screen and (max-width: 1180px) {
	#sect_tips .tips {
		width: 30%;
	}
}
@media screen and (max-width: 920px) {
	#sect_tips .tips {
		width: 40%;
	}
	#sect_tips .tips h3 {
    	font-size: 1.05rem;
	}
}
/*
@media screen and (max-width: 600px) {
	#sect_tips .tips {
		width: 100%;
	}
}
*/
@media screen and (max-width: 750px) {
	/* 横長タイプ */
	#sect_tips {
		flex-direction: column;
	}
	#sect_tips .tips {
		width: 99%;
		max-width: unset;
		margin: 10px auto;
	}
	#sect_tips .tips a {
		display: flex;
		align-items: center;
		justify-content: space-between;
	}
	#sect_tips .tips p {
		font-size: 0.9rem;
		line-height: 1.2em;
		padding: 0.5em 0.5em 0.5em 0.8em;
		min-height: 5em;
	}
	#sect_tips .tips img {
		width: 40vw;
		height: 100%;
	}
	#sect_tips .tips h3 {
		/*font-size: 1rem;*/
		padding: 1.2em 0 0 1.2em;
	}
	#sect_tips .tips .flag {
		padding: 3px 8px;
	}
}

@media screen and (max-width: 560px) {
	.thumSp {
		display: block;
	}
	.thumPc {
		display: none;
	}
	#sect_tips .tips img {
		width: 34vw;
	}
	#sect_tips .tips .flag {
		min-width: 1.5em;
	}
}

@media screen and (max-width: 450px) {
	.__SPX {
		display: block;
	}
	.__PCX {
		display: none;
	}
	#sect_tips .tips.__SPX h3 {
		font-size: 1.3rem;
	}
	#sect_tips .tips.__SPX a {
		display: block;
	}
	#sect_tips .tips.__SPX img {
		width: 100%;
	}
	#sect_tips .tips.__SPX p {
		padding: 0 0.8em;
	}
	#sect_tips .tips h3 {
		font-size: 1rem;
		padding: 1.2em 0.5em 0 1.2em;
	}
}


/***********************
他リンクバナー
***********************/
/* 20240909 */
.bggray {
    background-color: #E7E7E7;
    margin: 0 calc(50% - 50vw);
    width: 99vw;
    padding: 30px 0;
}
#sect_otherlink {
    margin-bottom: 0;
}
#sect_otherlink ul {
    display: flex;
    justify-content: center;
    padding: 0 20px;
}
#sect_otherlink ul li {
    list-style: none;
    margin: 0 10px;
}
#sect_otherlink ul li img {
    width: 100%;
    max-width: 380px;
}
#sect_otherlink ul li img:hover {
    opacity: 0.6;
    transition: .3s;
}

@media screen and (max-width: 580px) {
    #sect_otherlink ul {
        flex-direction: column;
        align-items: center;
    }
}