@charset "UTF-8";


/* news --------------------------------------------------------------- */
#layer {
	display: none;
	width: 100%;
	height: 100vh;
	z-index: 900;
	background-color: #000000;
	opacity: 0.5;
	position: fixed;
	left: 0;
	top: 0;
	}

#layer.open {
	display: block;
	}
	
#trigger {
	width: 450px;
	z-index: 901;

	background-color: #ffffff;

	position: fixed;
	right: 0;
	top: 0;

	transform: translate(450px, 0);
	transition: transform 0.35s ease-in-out;
	}

#trigger.open {
	transform: translate(0, 0);
	}

#trigger,
#label,
#content {
	height: 100vh;
	}

	#wrap {
		position: relative;
		}

		#label {
			width: 30px;
			height: 150px;
			background-color: #ffdb90;
			position: absolute;
			left: -30px;
			top: calc(50% - 30px);
			transform: translate(0, -50%);
			}

			#label p {
				font-size: 14px;
				text-align: center;
				writing-mode: vertical-rl;
				line-height: 1;
				letter-spacing: 3px;
				position: absolute;
				left: 50%;
				top: 50%;
				transform: translate(-50%, -50%);
				}

		#content {
			width: 100%;
			position: relative;
			overflow-x: hidden;
			overflow-y: scroll;
			}

			#content .article {
				padding: 60px 30px 30px 30px;
				box-sizing: border-box;
				position: relative;
				}
			
			#content .article:nth-of-type(even) {
				background-color: #eeeeee;
				}

				#content .article h2 {
					font-size: 18px;
					line-height: 1.5;
					margin-bottom: 10px;
					}

				#content .article p,
				#content .article p a {
					font-size: 15px;
					line-height: 1.5;
					}

				#content .article p {
					margin-bottom: 30px;
					}
				
				#content .article p:last-of-type {
					margin-bottom: 0;
					}

					#content .article p a {
						display: inline-block;
						background-color: #ffdb90;
						}

					#content .article p img {
						width: 100% !important;
						height: auto !important;;
						}

				#content .article .date {
					font-size: 15px;
					text-align: right;
					position: absolute;
					right: 10px;
					top: 10px;
					}

@media(max-width: 1024px){
	#trigger {
		width: calc(100% - 30px);
		transform: translate(100%, 0);
		}
			#label {
				height: 100px;
				top: 0;
				transform: none;
				}
	}