@charset "utf-8";

/* page =============================================================

	中ページ共通
	Information(投稿)
	お問合せ
	資料請求
	会社案内
  採用情報
   - 募集要項
   - 先輩インタビュー
  設備概要
  コンパッソについて
	コンパッソ別注品
	東京製紙の強み
　製品情報一覧
　高級パッケージ用紙
  WEB商談
  
	
======================================================================== */

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

	中ページ共通
	
======================================================================== */

/*----------------------------------------------------
	pageVisual
----------------------------------------------------*/
	.p-pageVisual {
		width: 100%;
		position: relative;
		background-image: url(../img/common/pageVisual_image.jpg);
		background-repeat: no-repeat;
		background-size: cover;
		display: flex;
		justify-content: center;
		align-items: center;
		text-align: center;
		flex-flow: column nowrap;
		}
	.p-pageTitle,
	.p-pageTitle--en,
  .p-subTitle {
    font-family: 'Noto Serif JP', sans-serif;
    font-weight: 500;
		}
	.p-pageTitle {
		color: #000;
		box-sizing: border-box;
		letter-spacing: .3rem;
		text-indent: -.2rem;
		line-height: 1.4;
		}
	.p-pageTitle--en {
		color: #E6211B;
		letter-spacing: .15rem;
		text-transform: capitalize;
		}
@media (max-width: 768.98px) {
	.p-pageVisual {
		background-position: 30% center;
		height: 100px;
		box-shadow: 0px 1px 10px 0px rgba(0,0,0,0.15);
		}
	.p-pageTitle {
		font-size: 145%;
		}
	.p-pageTitle .u-db-sp2 {
		line-height: 140%;
		}
  .p-section .p-pageTitle--en {
    font-size: 12px;
    }
  .p-subTitle {
    font-size: 130%;
    }
}
@media (min-width: 769px) {
	.p-pageVisual {
		background-position: center center;
		height: 190px;
		}
  .p-pageVisual::after {
    content: '';
    display: inline-block;
    background-image: url("../img/common/pageVisual_shadow.png");
    background-position: center bottom;
    background-repeat: no-repeat;
    background-size: contain;
    width: 100%;
    height: 14px;
    position: relative;
    bottom: -51px;
    }
	.p-pageTitle {
		font-size: 3.2rem;
		}
  .p-pageVisual .p-pageTitle {
    padding-top: 25px;
    }
  .p-section .p-pageTitle {
    font-size: 2.6rem;
    padding-top: 0;
    }
	.p-pageTitle--en {
		font-size: 1.5rem;
		}
  .p-subTitle {
    font-size: 2.6rem;
    }
}

/*----------------------------------------------------
	テキストと画像の横並び
----------------------------------------------------*/
@media screen and (max-width: 768px) {
	.p-item--image {
		margin-top: 1.6rem;
		text-align: center;
		}
}
@media print, screen and (min-width: 769px) {
	.p-item {
		display: flex;
		justify-content: center;
		align-content: center;
		align-items: flex-start;
		}
}

/*----------------------------------------------------
	ナビゲーションメニュー
----------------------------------------------------*/
@media (min-width: 769px) {
	.c-accordionMenubtn {
		border: solid 1px #E6E6E6;
    background-color: #FFFFFF;
		text-align: center;
		line-height: 100%;
		}
	.c-accordionMenubtn a {
		padding: 1.8rem 0;
    box-shadow: 5px 5px 0px 0px #e6211b;
    -webkit-box-shadow: 5px 5px 0px 0px #e6211b;
    -moz-box-shadow: 5px 5px 0px 0px #e6211b;
    -o-box-shadow: 5px 5px 0px 0px #e6211b;
    -ms-box-shadow: 5px 5px 0px 0px #e6211b;
    position: relative;
		-webkit-transition: all .3s ease-in-out;
			 -moz-transition: all .3s ease-in-out;
				 -o-transition: all .3s ease-in-out;
				-ms-transition: all .3s ease-in-out;
						transition: all .3s ease-in-out;
    }
  _:-ms-input-placeholder, :root .c-accordionMenubtn a { /*forIE*/
    padding-top: 2.2rem;
    }  
	.c-accordionMenubtn a::after {
		content: '';
		display: block;
    background-image: url(../img/common/menu_arrow.png);
		width: 13px;
		height: 13px;
		position: absolute;
		right: 6px;
		bottom: 6px;
    -webkit-transition: all .2s ease-in-out;
			 -moz-transition: all .2s ease-in-out;
				 -o-transition: all .2s ease-in-out;
				-ms-transition: all .2s ease-in-out;
						transition: all .2s ease-in-out;
		}
  /*hover*/
  .c-accordionMenubtn a:hover,
  .c-accordionMenubtn.current a {
    color: #e6211b;
    }
  .c-accordionMenubtn a:hover::after,
  .c-accordionMenubtn.current a::after {
    right: 4px;
    bottom: 4px;
    }
}



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

	Information(投稿)
	
======================================================================== */
@media (max-width: 768.98px) {
	.p-main {
    margin-top: 5.5rem;
    }
  .p-side {
		margin: 4.8rem 0;
		}
}
@media (min-width: 769px) {
	.p-main {
    float: left;
    width: 68%;
    padding-top: 7rem;
    padding-bottom: 10rem;
		}
	.p-side {
		float: right;
    width: 28%;
    padding-top: 7rem;
    padding-bottom: 10rem;
		}
}

/*----------------------------------------------------
	記事1件分
----------------------------------------------------*/
	.p-post {
		padding-bottom: 3.2rem;
		}
	.c-subject,
	.c-subject a:link {
		color: #000;
		font-family: 'Noto Serif JP', sans-serif;
    font-weight: 500;
		}
	.c-subject {
		position: relative;
		border-top: solid 1px #CCCCCC;
		}
	.c-subject::after {
		position: absolute;
		top: -2px;
		left: 0;
		z-index: 2;
		content: '';
		width: 100px;
		height: 3px;
		background-color: #E6211B;
		}
	.c-entries .p-post-meta {
		text-align: right;
		}
	.c-entries .p-post-meta span {
		margin-left: .8rem;
		}
	.p-post-body {
		padding-top: 1.2rem;
		}
	.p-post-body p+p {
		margin-top: 10px;
		}
  .p-post-body a {
    color: #007cba !important;
    text-decoration: underline;
    }
@media (max-width: 768.98px) {
	.c-entries {
		margin-bottom: 4rem;
		}
	.c-subject {
		font-size: 145%;
		line-height: 140%;
		padding-top: 2rem;
		margin-bottom: 1.6rem;
		}
}
@media (min-width: 769px) {
	.c-entries {
		padding-bottom: 7rem;
		}
	.c-entries:last-child {
		margin-bottom: 0;
		}
	.c-subject {
		font-size: 2.6rem;
		line-height: 1.5;
		padding-top: 2.2rem;
		margin-bottom: 2rem;
		}
}

/*----------------------------------------------------
	「記事の続きを見る」ボタン
----------------------------------------------------*/
	.c-post-more-button {
		margin-top: 2rem;
		}
	.c-post-more-button a {
		border: solid 1px #000000;
		box-sizing: border-box;
		padding: 1rem 2.4rem 1rem;
		display: block;
		position: relative;
		}
  _:-ms-input-placeholder, :root .c-post-more-button a { /*forIE*/
    padding-top: 1.6rem;
    }
  .c-post-more-button a::after {
    content: "＞＞＞";
    padding-left: 1rem;
    font-size: 70%;
    letter-spacing: -0.2rem;
    position: relative;
    top: -1px;
		}
@media (max-width: 768.98px) {
	.c-post-more-button a {
		text-align: center;
		}
}
@media (min-width: 769px) {
	.c-post-more-button {
		width: 300px;
		text-align: center;
		margin-left: auto;
		}
  .c-post-more-button a:hover {
    text-decoration: none !important;
    opacity: 1 !important;
    box-shadow: 4px 4px 0px 0px #000000;
    -webkit-box-shadow: 4px 4px 0px 0px #000000;
    -moz-box-shadow: 4px 4px 0px 0px #000000;
    -o-box-shadow: 4px 4px 0px 0px #000000;
    -ms-box-shadow: 4px 4px 0px 0px #000000;
    }
}

/*----------------------------------------------------
	ウィジェット共通
----------------------------------------------------*/
	.p-widget+.p-widget {
		margin-top: 3.2rem;
		}
	.c-widget-tit {
		text-align: center;
		background-color: #E6211B;
		color: #FFF;
		padding-top: 1.4rem;
		padding-bottom: 1.4rem;
		}
	.p-widget ul {
		padding: 1.6rem;
		}
    .p-widget ul li {
      line-height: 1.6;
      }
		.p-widget ul li+li {
			margin-top: .8rem;
			}
      .p-widget ul li ul {
        border: none;
        padding: 0;
        }
  .p-widget .cat-item {
    padding-left: 1rem;
    }
  .cat-item a {
		display: block;
		position: relative;
    line-height: 1.6 !important;
		}
	.cat-item a::before {
    content: '';
    width: 4px;
    height: 4px;
    border: 0px;
    border-top: solid 1px #000;
    border-right: solid 1px #000;
    -ms-transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    position: absolute;
    top: 43%;
		margin-left: -16px;
		}
	.cat-item .children {
		text-indent: 1.6rem;
		}
	.p-widget .post-date {
		font-size: 11px;
		display: block;
    color: #888888;
    margin-top: 4px;
		}

	/*「カレンダー」ウィジェット*/
	#wp-calendar {
		width: 100%;
		}
	#wp-calendar caption {
		font-weight: bold;
    caption-side: inherit;
    text-align: center;
    color: inherit;
		}
	#wp-calendar tr {
		text-align: center;
		font-size: 13px;
		}
	#wp-calendar th {
		font-weight: bold;
		text-align: center;
		background-color: #F1F3F5;
		padding: 3px 0;
		}
	#wp-calendar td {
		padding: 4px 0;
    background-color: #FFFFFF;
		}
	#wp-calendar {
		border: solid 1px #CFCFCF;
		}
	#wp-calendar tbody td {
		border-bottom: solid 1px #CFCFCF;
		}
	#wp-calendar a {
		color: #E6211B;
		font-weight: bold;
		}
	#wp-calendar #today {
		font-weight: bold;
		}

/*----------------------------------------------------
	.wp-pagenavi(ページ送り「PageNavi」プラグイン使用)
----------------------------------------------------*/
	.wp-pagenavi {
		margin: 0 auto;
		overflow: hidden;
		text-align: center;
		}
	.wp-pagenavi a,
	.wp-pagenavi span {
		display: inline-block;
		text-align: center;
		white-space: nowrap;
		margin-left: 10px;
		margin-bottom: 10px;
		padding: 6px 16px;
		background-color: #FFF;
		border: solid 1px #E6E6E6;
		}
  _:-ms-input-placeholder, :root .wp-pagenavi a,
  _:-ms-input-placeholder, :root .wp-pagenavi span { /*forIE*/
    padding: 12px 18px 6px;
    } 
  .wp-pagenavi a:hover {
		background-color: #E6211B;
		color: #FFF;
    opacity: 1 !important;
    text-decoration: none !important;
		}
	.wp-pagenavi span.current {
		background-color: #E6211B;
		color: #FFF;
		}
	.wp-pagenavi .nextpostslink,
	.wp-pagenavi .prevpostslink {
		}
  .wp-pagenavi .nextpostslink:hover,
  .wp-pagenavi .prevpostslink:hover {
    }

/*----------------------------------------------------
	次の記事へ／前の記事へ
----------------------------------------------------*/
	.c-pager-items a {
		display: block;
		padding: 0.6rem 1.8rem 0.6rem;
		border: solid 1px #CCCCCC;
		box-sizing: border-box;
		text-align: center;
		text-decoration: none !important;
		}
	.c-pager-items a:hover {
		background-color: #E6211B;
    color: #FFFFFF;
    opacity: 1 !important;
		}
	.c-pager-items.previous a:before,
	.c-pager-items.next a:after {
		position: relative;
		font-size: 110%;
		}
	.c-pager-items.previous a:before {
		content: "«";
		margin-right: 0.8rem;
		}
	.c-pager-items.next a:after {
		content: "»";
		margin-left: 0.8rem;
		}			
@media (max-width: 768.98px) {
	html.tb .c-pager-items {
		display: inline-block;
		width: 38%;
		}
	html.tb .c-pager-items.previous {
		margin-left: 10%;
		}
	html.tb .c-pager-items.next {
		margin-right: 10%;
		}			
}
@media (min-width: 769px) {
	.p-pager {
		padding-top: 5rem;
		}	
	.c-pager-items {
		display: inline-block;
		width: 200px;
		}
	.c-pager-items.previous {
		margin-left: 15%;
		}
	.c-pager-items.next {
		margin-right: 15%;
		}		
	body.single-post .c-pager-items {
		width: 170px;
		}	
}



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

	お問合せ
	
======================================================================== */

/*----------------------------------------------------
	送信フォーム
----------------------------------------------------*/
	.p-contactTable {
		width: 100%;
		max-width: 100%;
		overflow-x: auto;
		border-collapse: collapse;
		}
	.p-contactTable th,
	.p-contactTable td {
		text-align: left;
		font-weight: normal;
		box-sizing: border-box;
		vertical-align: middle;
		}
	.p-contactTable th {
		color: #007AC5;
		font-weight: bold;
		}
@media screen and (max-width: 767px) {
	.p-contactTable {
		border-bottom: none;
		}
	.p-contactTable th,
	.p-contactTable td {
		display: block;
		padding: 0.8rem;
		}
	.p-contactTable th {
		padding-bottom: 0;
		}
	.p-contactTable td {
		padding-top: 0;
		padding-bottom: 0.8rem;
		}
}
@media print, screen and (min-width: 768px) {
	.p-contactTable th,
	.p-contactTable td {
		padding: 1rem 1.6rem;
		}
	.p-contactTable th {
		min-width: 250px;		
		}
}

/*----------------------------------------------------
	MW WP Form
----------------------------------------------------*/
  :focus {
    outline: none;
    }
	span.form-controls input[type="text"],
	span.form-controls input[type="email"],
	span.form-controls-tel input[type="text"],
	span.form-controls textarea,
	span.form-controls-half input[type="text"],
  span.form-controls-medium input[type="text"] {
    width: auto !important;
		border: solid 1px #CCC;
		background-color: #FFFFFF;
		padding: 6px;
		font-family: -apple-system, blinkMacSystemFont, YuGothic-M, YuGothic, "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
		}
	span.form-controls select {
		width: auto !important;
		border: solid 1px #CCC;
		background-color: #FFF;
		padding: 4px;
		}
	.form-controls input[type="tel"].zip {
		width: 98% !important;
		border: solid 1px #CCC;
		background-color: #FFFFFF;
		padding: 6px;
		font-family: -apple-system, blinkMacSystemFont, YuGothic-M, YuGothic, "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
		}
		::-webkit-input-placeholder {font-size: 94%;}
		:-ms-input-placeholder {font-size: 94%;}
		::-moz-placeholder {font-size: 94%;}
	span.form-controls-half input[type="text"] {
		width: 20% !important;
		}
    span.form-controls-medium input[type="text"] {
      width: 98% !important;
      }
  span.form-controls input[type="text"]:focus,
	span.form-controls-tel input[type="text"]:focus,
	span.form-controls .zip:focus,
	span.form-controls textarea:focus,
  span.form-controls-medium input[type="text"]:focus {
		border: solid 1px #000000;
		}
@media (max-width: 768.98px) {
		span.form-controls input[type="text"],
		span.form-controls input[type="email"],
		span.form-controls textarea {
			margin-top: .4rem;
			width: 97% !important;
			font-size: 110%;
			}
		span.form-controls-tel input[type="text"] {
			margin-top: .4rem;
			font-size: 110%;
			width: 20% !important;
			}
		span.form-controls-half input[type="text"],
    span.form-controls-medium input[type="text"] {
			font-size: 110%;
			}
}
@media (min-width: 769px) {
		span.form-controls input[type="text"],
		span.form-controls input[type="email"],
		span.form-controls textarea {
			width: 98% !important;
			font-size: 1.6rem;
			}
		span.form-controls-half input[type="text"],
    span.form-controls-medium input[type="text"] {
			font-size: 1.6rem;
			}
    span.form-controls-medium input[type="text"] {
      width: 50% !important;
      }
}
  /*確認画面ページでは個人情報保護方針ボタンを非表示にする*/
  .mw_wp_form_preview .btn-pp {
    display: none !important;
    }

/*----------------------------------------------------
	送信ボタン
----------------------------------------------------*/  
	#sendbtn {
		text-align: center;
		}
	#sendbtn input[type="submit"] {
		display: inline-block;
		cursor: pointer;
		font-weight: normal;
		padding: 2rem;
		line-height: 100%;
		background-color: #FFFFFF;
		border: solid 1px #000000;
    color: #000000;
		box-sizing: border-box;
		-webkit-box-sizing: border-box;
		-moz-box-sizing: border-box;
		box-sizing: border-box;
		-webkit-transition: all .4s;
		transition: all .4s;
    }
  #sendbtn input[type="submit"]:hover {
		cursor: pointer;
		background-color: #000000;
    color: #FFFFFF;
		}
  #sendbtn .btn-back:hover {
    background-color: #CCCCCC !important;
		border: solid 1px #000000;
    color: #000000 !important;
    }

@media (max-width: 768.98px) {
  #sendbtn input[type="submit"] {
		width: 100%;
    background-color: #000;
    color: #FFF;
		}
  #sendbtn .btn-back {
    background-color: #FFFFFF !important;
    color: #000000 !important;
    margin-bottom: 2rem;
    }
  .mw_wp_form_preview #sendbtn {
  	margin-top: 3rem;
  	}
}
@media (min-width: 769px) {
  #sendbtn input[type="submit"] {
		width: 400px;
    margin-bottom: 2rem;
		}
}

/*----------------------------------------------------
	個人情報保護方針ボタン
----------------------------------------------------*/
	.c-privacyButton {
		text-align: center;
		}
	.c-privacyButton .icon-pdf {
		font-size: 160%;
		padding-right: .6rem;
		}
	.c-privacyButton .c-button {
		padding: 1.6rem 2.4rem;
		}
	.c-privacyButton span {
		vertical-align: middle;
		}
@media screen and (min-width: 768px) {
	.c-privacyButton {
    padding-top: 3.2rem;
		margin-left: auto;
		margin-right: auto;
		}
	.c-privacyButton .c-button {
		width: 100%;
		}
}



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

	採用情報top
	
======================================================================== */
  .index-recruit {
    padding-top: 3rem;
    padding-bottom: 50px;
    }
  .index-recruit .p-title,
  .p-title.-recruit {
    font-family: 'Noto Serif JP', sans-serif;
    font-weight: 500;
    font-size: 24px;
    letter-spacing: .05em;
    }
  .index-recruit .btn-outline-black {
    background-color: rgba(255,255,255,0.7);
    }
@media (min-width: 768px) {
  .index-recruit .p-title,
  .p-title.-recruit {
    font-size: 35px;
    }
  .p-recruit-target {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    }
}
@media (min-width: 992px) {
  .index-recruit {
    padding-top: 120px;
    padding-bottom: 70px;
    background-image: url("../img/home/img_recruit-pc.jpg");
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    height: 848px;
    }
}

/*----------------------------------------------------
	採用情報top -> 先輩インタビュー
----------------------------------------------------*/
  .p-interviewCard-title {
    letter-spacing: 0.05em;
    font-size: 1.6rem;
    }
  .p-interviewCard-title--en {
    font-size: 10px;
    margin-top: 0.5rem;
    font-family: 'Noto Serif JP', sans-serif;
    font-weight: 400;
    }
@media (min-width: 768px) {
  .p-interviewCard-title {
    font-size: 1.8rem;
    }
  .p-interviewCard-title--en {
    font-size: 1.1rem;
    margin-top: 1rem;
    }
  .p-interviewCard {
		-webkit-transition: all .3s ease-in-out;
			 -moz-transition: all .3s ease-in-out;
				 -o-transition: all .3s ease-in-out;
				-ms-transition: all .3s ease-in-out;
						transition: all .3s ease-in-out;    
    }
  .p-interviewCard:hover {
    cursor: pointer;
    box-shadow: 0 0 3rem rgba(0,0,0,.3);
    }
}

/*----------------------------------------------------
	採用情報top -> キラリと光る！
----------------------------------------------------*/
  .text-kirari {
    color: #FFFF00;
    position: relative;
    }
    .text-kirari::before {
      content: "";
      display: inline-block;
      background-image: url("../img/recruit/illust_kira01.png");
      background-size: 44px 44px;
      width: 44px;
      height: 44px;
      position: absolute;
      bottom: -20px;
      left: -25px;
      }
    .text-kirari::after {
      content: "";
      display: inline-block;
      background-image: url("../img/recruit/illust_kira02.png");
      background-size: 36px 41px;
      width: 36px;
      height: 41px;
      position: absolute;
      top: -30px;
      right: -12px;
      }
@media (min-width: 768px) {
    .text-kirari::before {
      bottom: -28px;
      left: -40px;
      background-size: 66px 66px;
      width: 66px;
      height: 66px;
      }
    .text-kirari::after {
      top: -40px;
      right: -15px;
      background-size: 54px 62px;
      width: 54px;
      height: 62px;
      }
}
  /*赤い円形（大）*/
  .p-big-circle-red {
    width: 290px;
    height: 290px;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-left: auto;
    margin-right: auto;
    background-color: #E5211B;
    color: #FFFFFF;
    font-family: 'Noto Serif JP', sans-serif;
    font-weight: 500;
    font-size: 2.4rem;
    border-radius: 50%;
    }
@media (min-width: 992px) {
  .p-big-circle-red {
    width: 350px;
    height: 350px;
    }
}

/*----------------------------------------------------
	採用情報top -> 求める人材
----------------------------------------------------*/
  .p-recruit-jinzai {
    background-image: url("../img/recruit/bg_jinzai.jpg");
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
    }
@media (min-width: 992px) {
  .p-recruit-jinzai {
    } 
  }


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

	採用情報 -> 募集要項
	JOB DESCRIPTION
	
======================================================================== */

/*----------------------------------------------------
	「この記事を編集する」リンク
----------------------------------------------------*/
	.icon-edit {
		background-color: #F0F8FD;
		border: solid 1px #39C;
		display: inline-block;
		padding: 1.6rem;
		margin-bottom: 1rem;
		-webkit-border-radius: 4px;
			 -moz-border-radius: 4px;
						border-radius: 4px;
				-ms-border-radius: 4px;
				-webkit-appearance: none;
		}
	.icon-edit,
	.post-edit-link {
		color: #39C !important;
		}
	.icon-edit::before {
		margin-right: .4rem;
		-webkit-transition: all .3s ease-in-out;
		-moz-transition: all .3s ease-in-out;
		-o-transition: all .3s ease-in-out;
		-ms-transition: all .3s ease-in-out;
		transition: all .3s ease-in-out;
		}
	.icon-edit a:hover,
	.icon-edit:hover::before {
		color: #007AC5 !important;
    opacity: 1 !important;
		}



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

	採用情報 -> 先輩インタビュー
  INTERVIEW
	
======================================================================== */
  .p-interviewBlock + .p-interviewBlock {
    margin-top: 4rem;
    }
  .p-interviewBlock-title {
    color: #000000;
		padding: 1.6rem 4.4rem 1.6rem 1.6rem;
    border: solid 1px #CCCCCC;
    box-shadow: 0 0 0 1px #FFFFFF inset;
		background: rgb(255,255,255);
		background: -moz-linear-gradient(top,  rgba(255,255,255,1) 60%, rgba(243,169,166,0.6) 100%);
		background: -webkit-linear-gradient(top,  rgba(255,255,255,1) 60%,rgba(243,169,166,0.6) 100%);
		background: linear-gradient(to bottom,  rgba(255,255,255,1) 60%,rgba(243,169,166,0.6) 100%);
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#F3A9A6',GradientType=0 );
    }
  .p-interviewBlock-title .department {
    display: block;
    line-height: 1.6;
    font-family: 'Noto Serif JP', sans-serif;
    font-weight: 500;
    font-size: 135%;
    color: #E5211B;
    }
  .p-interviewBlock-title .name {
    display: block;
    font-size: 120%;
    margin-top: .8rem;
    }
  .p-interviewBlock-inner {
    padding: 1.4rem 1.6rem 0;
    }
@media (min-width: 769px) {
  .p-interviewBlock + .p-interviewBlock {
    margin-top: 5rem;
    }
  .p-interviewBlock-title {
    padding: 25px 30px;
    }
  .p-interviewBlock-title .department,
  .p-interviewBlock-title .name {
    display: table-cell;
    vertical-align: middle;
    }
  .p-interviewBlock-title .name {
    padding-left: 25px;
    }
  _:-ms-input-placeholder, :root .p-interviewBlock-title { /*forIE*/
    padding-top: 30px;
    }
  .p-interviewBlock-inner {
    padding: 25px 30px 0;
    }
}
  /*開閉パネル設定*/
  .p-interviewBlock-title {
    position: relative;
    cursor: pointer;
    }
  .p-interviewBlock-title.active {
    background: rgb(255,255,255);
		background: -moz-linear-gradient(top,  rgba(255,255,255,1) 60%, rgba(229,229,229,1) 100%);
		background: -webkit-linear-gradient(top,  rgba(255,255,255,1) 60%,rgba(229,229,229,1) 100%);
		background: linear-gradient(to bottom,  rgba(255,255,255,1) 60%,rgba(229,229,229,1) 100%);
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#e5e5e5',GradientType=0 );
    }
  .p-interviewBlock-title::after {
    font-family: 'Font Awesome 5 Free';
    content: '\f067';
    font-weight: bold;
    float: right;
    color: #E5211B;
    font-size: 200%;
    line-height: 1;
    position: absolute;
    right: 1.6rem;
    top: 50%;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    }
  .p-interviewBlock-title.active::after {
    font-family: 'Font Awesome 5 Free';
		content: '\f068';
		font-weight: bold;
    color: #989898;
		}
  .p-interviewBlock-content {
    display: none;
    }
@media (min-width: 769px) {
  .p-interviewBlock-title::after {
    right: 30px;
    }
}

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

	資料請求
	Saple
	
======================================================================== */

/*----------------------------------------------------
	見本サンプル
----------------------------------------------------*/
@media screen and (max-width: 768px) {
	.p-sample-list--item+.p-sample-list--item {
		margin-top: 3rem;
		}
	.p-sample-list--item .c-product-item--title,
	.p-sample-list-block .c-product-item--title {
		margin: .8rem 0 .4rem;
		}
	.tb .p-sample-list--item {
		width: 48%;
		}
	.tb .p-sample-list--item:nth-child(n+3) {
		margin-top: 4rem;
		}
}
@media print, screen and (min-width: 769px) {
	.p-sample-list--item {
		width: 48%;
		}
	.p-sample-list--item:nth-child(n+3) {
		margin-top: 4rem;
		}
	.p-sample-list--item .c-product-item--title,
	.p-sample-list-block .c-product-item--title {
		margin: .8rem 0;
		}
}

  .p-sample-list--item+.p-sample-list-block,
	.p-sample-list-block+.p-sample-list-block {
		margin-top: 4rem;
		}
	.p-sample-list-block--text {
		margin-top: 0.8rem;
		}

  span.form-controls.w-200 input[type="text"] { width: 200px !important; }


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

	会社案内
	Company
	
======================================================================== */
  .p-officer dt {
    float: left;
    width: 100px;
    }
  .p-officer dd {
    overflow: hidden;
    }


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

	設備概要
	Facilities
	
======================================================================== */
  .p-table--facilities {
    width: 100%;
    max-width: 100%;
    overflow-x: auto;
    border-collapse: collapse;
    }
  .p-table--facilities th {
    border: solid 1px #CCCCCC;
    padding: 10px;
    }
  .p-table--facilities td {
    border: solid 1px #CCCCCC;
    padding: 10px;
    background-color: #FFFFFF;
    }
  .p-table--facilities thead th {
    text-align: center;
    background-color: #F2F2F2;
    }
  .p-table--facilities tbody th {
    font-weight: 400;
    }
@media (max-width: 767.98px) {
  .p-table--facilities th,
  .p-table--facilities td {
    border-bottom: none;
    display: block;
    width: 100%;
    }
  .p-table--facilities thead {
    display: none;
    }
  .p-table--facilities tbody th {
    background-color: #F2F2F2;
    font-weight: bold;
    }
  .p-table--facilities tbody tr::after {
    content: "";
    display: block;
    border-bottom: solid 1px #CCCCCC;
    margin-bottom: 3rem;
    }
  .p-table--facilities tbody td.vw::before {
    content: "【縦幅(mm)】";    
    }
  .p-table--facilities tbody td.kg::before {
    content: "【日産能力(kg)】";    
    }
  .p-table--facilities tbody td.pb::before {
    content: "【製品銘柄】";
    display: block;
    }
}
@media (min-width: 768px) {
  .p-table--facilities thead th {
    white-space: nowrap;
    padding-top: 1.6rem;
    padding-bottom: 1.6rem;
    }
  .p-table--facilities tbody th {
    background-color: #FFFFFF;
    width: 30%;
    vertical-align: middle;
    }
  .p-table--facilities tbody td {
    vertical-align: middle;
    }
  .p-table--facilities tbody .d-md-block {
    border-top: none;
    border-left: none;
    }
}


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

	コンパッソについて
	Compasso
	
======================================================================== */	
   /*コンパッソの2つのタイプ*/
  .p-compassoType-title {
    background-color: #808080;
    color: #FFFFFF;
    font-size: 130%;
    text-align: center;
    width: 270px;
    margin-left: auto;
    margin-right: auto;
    }
@media (min-width: 768px) {
  .p-compassoType-card {
		-webkit-transition: all .3s ease-in-out;
			 -moz-transition: all .3s ease-in-out;
				 -o-transition: all .3s ease-in-out;
				-ms-transition: all .3s ease-in-out;
						transition: all .3s ease-in-out;    
    }
  .p-compassoType-card:hover {
    cursor: pointer;
    box-shadow: 0 0 3rem rgba(0,0,0,.2);
    }
}
@media (min-width: 992px) {
  .p-compassoType-card a:hover {
    opacity: 1 !important;
    text-decoration: none !important;
    }
}
  /*コンパッソについてよくある質問*/
  .p-qaDl {
    border: solid 1px #CCCCCC;
    }
  .p-qaDl + .p-qaDl {
    border-top: none;
    }
  .p-qaDl dt {
    padding:  1rem 4.5rem 1rem 1rem;
    font-weight: normal;
    background-color: #F2F2F2;
    }
  .p-qaDl dd {
    padding: 1rem;
    background-color: #FFFFFF;
    }
  .p-qaDl-q, .p-qaDl-q-text,
  .p-qaDl-a, .p-qaDl-a-text {
    display: table-cell;
    }
  .p-qaDl-q, .p-qaDl-a {
    min-width: 34px;
    }
@media (min-width: 768px) {
  .p-qaDl dt,
  .p-qaDl dd {
    padding: 1.6rem 2rem;
    }
  .p-qaDl-q, .p-qaDl-a {
    min-width: 40px;
    }
  .p-qaDl-a {
    padding-left: 40px;
    padding-right: 15px;
    }
}
  /*開閉パネル設定*/
  .p-qaDl dt {
    position: relative;
    cursor: pointer;
    display: block;
    }
  .p-qaDl dt::after {
    content: '\f067';
    font-family: 'Font Awesome 5 Free';
    font-weight: bold;
    float: right;
    color: #E5211B;
    font-size: 150%;
    line-height: 1;
    position: absolute;
    right: 1.6rem;
    top: 50%;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    }
  .p-qaDl dt.active::after {
		content: '\f068';
		font-family: 'Font Awesome 5 Free';
		font-weight: bold;
    color: #989898;
		}
  .p-qaDl dd {
    display: none;
    }
@media (min-width: 769px) {
  .p-qaDl dt::after {
    right: 20px;
    }
}


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

	コンパッソ一般品
	Compasso GENERAL PRODUCT
	
======================================================================== */
  .p-productGbox {
    margin-top: 4rem;
    border: solid 1px #E5E5E5;
    width: 100%;
    background: rgb(254,255,255);
    background: -moz-linear-gradient(top,  rgba(254,255,255,1) 85%, rgba(230,230,230,1) 100%);
    background: -webkit-linear-gradient(top,  rgba(254,255,255,1) 85%,rgba(230,230,230,1) 100%);
    background: linear-gradient(to bottom,  rgba(254,255,255,1) 85%,rgba(230,230,230,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#feffff', endColorstr='#e6e6e6',GradientType=0 );
    }
  .p-productGbox-title {
    text-align: center;
    font-size: 120%;
    font-weight: 500;
    line-height: 170%;
    color: #333333;
    }
  .p-productGbox-hr {
    border-color: #E6211B;
    border-width: 4px;
    width: 50px;
    margin-left: auto;
    margin-right: auto;
    }
@media (max-width: 767.98px) {
  .p-productGbox {
    box-shadow: 0 0 0 1px #FFFFFF inset;
    }
  .p-productGbox:first-of-type {
    margin-top: 2.4rem;
    }
}
@media (min-width: 768px) {
  .p-productGbox {
    width: 48%;
		-webkit-transition: all .3s ease-in-out;
			 -moz-transition: all .3s ease-in-out;
				 -o-transition: all .3s ease-in-out;
				-ms-transition: all .3s ease-in-out;
						transition: all .3s ease-in-out;
    }
  /*.p-productGbox:hover {
    cursor: pointer;
    box-shadow: 0 0 3rem rgba(0,0,0,.15);
    }*/
}
@media (min-width: 992px) {
  .p-product-lineup::after {
    display: block;
    content: "";
    width: 32%;
    }  
  .p-productGbox {
    width: 32%;
    }
}
  

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

	コンパッソ別注品
	Compasso BESPOKE PRODUCT
	
======================================================================== */	
  .p-bespokeFlow {
    padding-top: 1rem;
    }
  .p-bespokeFlow-title {
    color: #000000;
		padding: 1.6rem;
    border: solid 1px #CCCCCC;
    box-shadow: 0 0 0 1px #FFFFFF inset;
		background: rgb(255,255,255);
		background: -moz-linear-gradient(top,  rgba(255,255,255,1) 80%, rgba(229,229,229,1) 100%);
		background: -webkit-linear-gradient(top,  rgba(255,255,255,1) 80%,rgba(229,229,229,1) 100%);
		background: linear-gradient(to bottom,  rgba(255,255,255,1) 80%,rgba(229,229,229,1) 100%);
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#e5e5e5',GradientType=0 );
		}
  .p-bespokeFlow-title .step,
  .p-bespokeFlow-title .number {
    display: block;
    font-size: 140%;
    letter-spacing: 0.1rem;
    }
  .p-bespokeFlow-title .subject {
    display: block;
    margin-top: .8rem;
    font-size: 110%;
    line-height: 1.6;
    }
  .p-bespokeFlow-content {
    padding: 1.4rem 1.6rem 0;
    }
@media (min-width: 769px) {
  .p-bespokeFlow-title {
    padding: 25px 30px;
    }
  .p-bespokeFlow-title .step,
  .p-bespokeFlow-title .subject,
  .p-bespokeFlow-title .number {
    display: table-cell;
    vertical-align: middle;
    }
  .p-bespokeFlow-title .step {
    font-size: 26px;
    width: 110px;
    }
  .p-bespokeFlow-title .number {
    font-size: 26px;
    width: 80px;
    }
  _:-ms-input-placeholder, :root .p-bespokeFlow-title .subject { /*forIE*/
    padding-top: 7px;
    }
  .p-bespokeFlow-content {
    padding: 25px 30px 0;
    margin-left: 110px;
    }
  .p-bespokeFlow-content.number {
    margin-left: 80px;
    }
}
  

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

	東京製紙の強み
	ADVANTAGE
	
======================================================================== */	
  .p-circle-red {
    width: 55px;
    height: 55px;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-left: auto;
    margin-right: auto;
    background-color: #E5211B;
    color: #FFFFFF;
    font-family: 'Noto Serif JP', sans-serif;
    font-size: 110%;
    }
  .p-advantage-arrow {
    position: relative;
    }
  .p-advantage-arrow::before {
    content: '';
    display: inline-block;
    background-image: url("../img/advantage/icon_arrow.png");
    background-repeat: no-repeat;
    background-size: contain;
    width: 51px;
    height: 31.5px;
    position: absolute;
    top: 50%;
    left: -25px;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    }
  .p-advantage-arrow.size::before {
    top: 40%;
    transform: translateY(-40%);
    -webkit-transform: translateY(-40%);
    -ms-transform: translateY(-40%);
    }



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

  製品情報一覧
  PRODUCT INFORMATION
	
======================================================================== */

/*----------------------------------------------------
	製品情報一覧トップページ
----------------------------------------------------*/
  .p-productsTop-lineup,
  .c-gradation-gray-box {
    border: solid 1px #E6E6E6;
    background: rgb(255,255,255);
    background: -moz-linear-gradient(top,  rgba(255,255,255,1) 50%, rgba(255,255,255,1) 50%, rgba(230,230,230,1) 100%);
    background: -webkit-linear-gradient(top,  rgba(255,255,255,1) 50%,rgba(255,255,255,1) 50%,rgba(230,230,230,1) 100%);
    background: linear-gradient(to bottom,  rgba(255,255,255,1) 50%,rgba(255,255,255,1) 50%,rgba(230,230,230,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#e6e6e6',GradientType=0 );
    box-shadow: 0 0 0 1px #FFFFFF inset;
    }
    .p-productsTop-lineup--image img {
      width: 240px;
      }
@media (min-width: 768px) {
    .p-productsTop-lineup--image img {
      width: 300px;
      }
  /*hover*/
  .p-productsTop-link {
		padding: 1.5rem;
    margin: -1.5rem;
    -webkit-transition: all .3s ease-in-out;
			 -moz-transition: all .3s ease-in-out;
				 -o-transition: all .3s ease-in-out;
				-ms-transition: all .3s ease-in-out;
						transition: all .3s ease-in-out;    
    }
  .p-productsTop-card {
    padding: 1.5rem;
    -webkit-transition: all .3s ease-in-out;
			 -moz-transition: all .3s ease-in-out;
				 -o-transition: all .3s ease-in-out;
				-ms-transition: all .3s ease-in-out;
						transition: all .3s ease-in-out;       
    }
  .p-productsTop-link:hover,
  .p-productsTop-card:hover {
    cursor: pointer;
    box-shadow: 0 0 3rem rgba(0,0,0,.15);
    background-color: #FFFFFF;
    }
}



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

  高級パッケージ用紙
  EXCLUSIVE PACKAGE
	
======================================================================== */

/*----------------------------------------------------
	アーカイブページ
----------------------------------------------------*/
@media (max-width: 991.98px) {
  .p-exclusive-side {
    margin-top: 3.8rem;
    }
}
  /**1件分**/
  .p-exclusive-archive .col .card {
    border-radius: 0 !important;
    }
    .p-exclusive-archive .col .card img {
      border: solid 1px #FFFFFF;
      }
  .p-exclusive-archive .col .card-title {
    margin-top: 6px;
    background-color: #B2B2B2;
    color: #FFFFFF;
    padding: 6px 8px;
    text-align: center;
    }
  _:-ms-input-placeholder, :root .p-exclusive-archive .col .card-title { /*forIE*/
    padding-top: 10px;
    padding-bottom: 4px;
    }
  /*NEWアイコン*/
  .p-exclusive-archive .col img.icon-new {
    position: absolute;
    top: 10px;
    left: 25px;
    }

@media (min-width: 768px) {
  /*hover*/ 
  .p-exclusive-archive .col .card,
  .p-exclusive-archive .col .card-title {
    -webkit-transition: all .3s ease-in-out;
			 -moz-transition: all .3s ease-in-out;
				 -o-transition: all .3s ease-in-out;
				-ms-transition: all .3s ease-in-out;
						transition: all .3s ease-in-out;
    }
  .p-exclusive-archive .col a:hover {
    opacity: 1 !important;
    text-decoration: none !important;
    }
  .p-exclusive-archive .col a:hover .card {
    border-color: #999999;
    }
  .p-exclusive-archive .col a:hover .card-title {
    background-color: #E6211B;
    }
}

/*----------------------------------------------------
	詳細ページ
----------------------------------------------------*/
  .slide-item img {
    width: 100%;
    }
	.thumbnail-item {
		position: relative;
		width: 24%;
		cursor: pointer;
    border: 1px solid rgba(0,0,0,.125);
    box-sizing: border-box;
		}
  .thumbnail-item+.thumbnail-item {
    margin-left: 1.5%;
    }
  .thumbnail-item img {
    padding: 1px;
    }
  .thumbnail-item:after {
    content: "";
    background-color: rgba(255, 255, 255, 0.7);
    position: absolute;
    display: block;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: 1;
    transition: 0.3s opacity linear;
    }
  .thumbnail-item.thumbnail-current:after {
    opacity: 0;
    }


/*----------------------------------------------------

	WEB商談
	
----------------------------------------------------*/
	.p-point {
    display: inline-block;
    padding: .6rem 1rem;
    color: #FFFFFF;
    background-color: #E6211B;
    line-height: 100%;
    font-family: 'Noto Serif JP', sans-serif;
    font-weight: 500;
    letter-spacing: .15rem;
    }
  .p-circle-75 {
    width: 75px;
    height: 75px;
    line-height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    margin-left: auto;
    margin-right: auto;
    }