@charset "utf-8";

/* =========================================================
  サイト ： シチズンの歴史
  タイプ ： ホーム
  更新日 ： 2022-11-17
========================================================= */



/* 全体
========================================================= */

body#home { background-color: #000000; }




/* アンカーナビ
========================================================= */

@media screen and (min-width: 1024px) {
	#ankerNav { position: fixed; top: 50%; left: 10px; z-index: 400; width: 33px; height: 264px; margin-top: -132px; }
	#ankerNav #ankerNavBt0,
	#ankerNav #ankerNavBt1,
	#ankerNav #ankerNavBt2,
	#ankerNav #ankerNavBt3 { width: 33px; height: 33px; position: relative; cursor: pointer; }
	#ankerNav .ankerNavPointer { position: absolute; top: 12px; left: 12px; content: ""; width: 9px; height: 9px; border: 2px solid #ffffff; border-radius: 50%; transition: background-color 0.2s ease; }
	#ankerNav .ankerNavActive { top: 11px; left: 11px; width: 11px; height: 11px; background-color: #ffffff; }
}

@media screen and (min-width: 767px) {
	#ankerNav #ankerNavBt0:hover .ankerNavPointer { background-color: #ffffff; }
	#ankerNav #ankerNavBt1:hover .ankerNavPointer { background-color: #ffffff; }
	#ankerNav #ankerNavBt2:hover .ankerNavPointer { background-color: #ffffff; }
	#ankerNav #ankerNavBt3:hover .ankerNavPointer { background-color: #ffffff; }
}



/* ヴィジュアル
========================================================= */

#visualWrap { width: 100%; background-color: #000000; position: relative; z-index: 200; }
#visualWrap #visuaIinner { max-width: 1920px; margin: 0 auto; }
#visualWrap #visuaIinner #visualBox { width: 100%; height: 0; padding-top: calc(100% / 7 * 4); position: relative; }

#visualWrap #visuaIinner #visualBox #snsIconTop { position: absolute; top: 22px; right: 22px; z-index: 190; overflow: hidden; }
#visualWrap #visuaIinner #visualBox #snsIconTop div { float: left; width: 36px; height: 36px; }
#visualWrap #visuaIinner #visualBox #snsIconTop div:not(:last-child) { margin-right: 12px; }
#visualWrap #visuaIinner #visualBox #snsIconTop div a { width: 36px; height: 36px; display: block; }
#visualWrap #visuaIinner #visualBox #snsIconTop div a img { opacity: 0; transition: opacity 0.3s ease; }
#visualWrap #visuaIinner #visualBox #snsIconTop div a:hover img { opacity: 1; }
#visualWrap #visuaIinner #visualBox #snsIconTop div:nth-child(1) a { background: url(../../images/top_sns_icon1_n.png) no-repeat left top; background-size: 36px 36px; }
#visualWrap #visuaIinner #visualBox #snsIconTop div:nth-child(2) a { background: url(../../images/top_sns_icon2_n.png) no-repeat left top; background-size: 36px 36px; }
#visualWrap #visuaIinner #visualBox #snsIconTop div:nth-child(3) a { background: url(../../images/top_sns_icon3_n.png) no-repeat left top; background-size: 36px 36px; }

#visualWrap #visuaIinner #visualBox #scrollBtn { position: absolute; bottom: 27px; left: 50%; z-index: 190; width: 44px; height: 44px; margin-left: -22px; text-align: center; }
#visualWrap #visuaIinner #visualBox #scrollBtn span { color: #ffffff; font-size: 1.2rem; font-weight: 700; line-height: 1.8rem; text-decoration: none; display: block; width: 44px; height: 44px; cursor: pointer; padding-top: 3px; position: relative; }
#visualWrap #visuaIinner #visualBox #scrollBtn span::before { animation: mainScrollAnima1 1.8s ease 1s infinite backwards; position: absolute; bottom: 14px; left: 50%; content: ""; width: 8px; height: 8px; margin-left: -4px; border-top: 1px solid #ffffff; border-right: 1px solid #ffffff; transform: rotate(135deg); }
#visualWrap #visuaIinner #visualBox #scrollBtn span::after { animation: mainScrollAnima2 1.8s ease 1s infinite backwards; position: absolute; bottom: 6px; left: 50%; content: ""; width: 14px; height: 14px; margin-left: -7px; border-top: 1px solid #ffffff; border-right: 1px solid #ffffff; transform: rotate(135deg); }
@keyframes mainScrollAnima1 { 0% { opacity: 1; } 20% { opacity: 0; } 50% { opacity: 1; } 100% { opacity: 1; } }
@keyframes mainScrollAnima2 { 0% { opacity: 1; } 40% { opacity: 0; } 70% { opacity: 1; } 100% { opacity: 1; } }

#visualWrap #visuaIinner #visualBox #blackScreen { width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: 120; background-color: rgba(0,0,0,0.2); }

#visualWrap #visuaIinner #visualBox #photo_01_frame { width: calc(100% / 7 * 2); height: 0; padding-top: calc(100% / 7 * 2); position: absolute; top: 0; left: 0; }
#visualWrap #visuaIinner #visualBox #photo_02_frame { width: calc(100% / 7 * 2); height: 0; padding-top: calc(100% / 7); position: absolute; top: 0; left: calc(100% / 7 * 2); }
#visualWrap #visuaIinner #visualBox #photo_03_frame { width: calc(100% / 7); height: 0; padding-top: calc(100% / 7); position: absolute; top: 0; left: calc(100% / 7 * 4); }
#visualWrap #visuaIinner #visualBox #photo_04_frame { width: calc(100% / 7); height: 0; padding-top: calc(100% / 7); position: absolute; top: 0; left: calc(100% / 7 * 5); }
#visualWrap #visuaIinner #visualBox #photo_05_frame { width: calc(100% / 7); height: 0; padding-top: calc(100% / 7 * 2); position: absolute; top: 0; left: calc(100% / 7 * 6); }
#visualWrap #visuaIinner #visualBox #photo_06_frame { width: calc(100% / 7); height: 0; padding-top: calc(100% / 7); position: absolute; top: calc(100% / 4); left: calc(100% / 7 * 2); }
#visualWrap #visuaIinner #visualBox #photo_07_frame { width: calc(100% / 7 * 2); height: 0; padding-top: calc(100% / 7 * 2); position: absolute; top: calc(100% / 4); left: calc(100% / 7 * 3); }
#visualWrap #visuaIinner #visualBox #photo_08_frame { width: calc(100% / 7); height: 0; padding-top: calc(100% / 7); position: absolute; top: calc(100% / 4); left: calc(100% / 7 * 5); }
#visualWrap #visuaIinner #visualBox #photo_09_frame { width: calc(100% / 7); height: 0; padding-top: calc(100% / 7); position: absolute; top: calc(100% / 4 * 2); left: calc(100% / 7 * 6); }
#visualWrap #visuaIinner #visualBox #photo_10_frame { width: calc(100% / 7); height: 0; padding-top: calc(100% / 7); position: absolute; top: calc(100% / 4 * 2); left: calc(100% / 7); }
#visualWrap #visuaIinner #visualBox #photo_11_frame { width: calc(100% / 7); height: 0; padding-top: calc(100% / 7); position: absolute; top: calc(100% / 4 * 2); left: calc(100% / 7 * 2); }
#visualWrap #visuaIinner #visualBox #photo_12_frame { width: calc(100% / 7); height: 0; padding-top: calc(100% / 7); position: absolute; top: calc(100% / 4 * 2); left: calc(100% / 7 * 5); }
#visualWrap #visuaIinner #visualBox #photo_13_frame { width: calc(100% / 7); height: 0; padding-top: calc(100% / 7); position: absolute; top: calc(100% / 4 * 2); left: 0; }
#visualWrap #visuaIinner #visualBox #photo_14_frame { width: calc(100% / 7); height: 0; padding-top: calc(100% / 7); position: absolute; top: calc(100% / 4 * 3); left: 0; }
#visualWrap #visuaIinner #visualBox #photo_15_frame { width: calc(100% / 7 * 2); height: 0; padding-top: calc(100% / 7); position: absolute; top: calc(100% / 4 * 3); left: calc(100% / 7); }
#visualWrap #visuaIinner #visualBox #photo_16_frame { width: calc(100% / 7); height: 0; padding-top: calc(100% / 7); position: absolute; top: calc(100% / 4 * 3); left: calc(100% / 7 * 3); }
#visualWrap #visuaIinner #visualBox #photo_17_frame { width: calc(100% / 7 * 2); height: 0; padding-top: calc(100% / 7); position: absolute; top: calc(100% / 4 * 3); left: calc(100% / 7 * 4); }
#visualWrap #visuaIinner #visualBox #photo_18_frame { width: calc(100% / 7); height: 0; padding-top: calc(100% / 7); position: absolute; top: calc(100% / 4 * 3); left: calc(100% / 7 * 6); }

#visualWrap #visuaIinner #visualBox #photo_01_frame::after { position: absolute; width: 100%; height: 100%; top: 0; left: 0; content: ""; z-index: 110; border-right: 1px solid #000000; border-bottom: 1px solid #000000; }
#visualWrap #visuaIinner #visualBox #photo_02_frame::after { position: absolute; width: 100%; height: 100%; top: 0; left: 0; content: ""; z-index: 110; border-right: 1px solid #000000; border-bottom: 1px solid #000000; }
#visualWrap #visuaIinner #visualBox #photo_03_frame::after { position: absolute; width: 100%; height: 100%; top: 0; left: 0; content: ""; z-index: 110; border-right: 1px solid #000000; border-bottom: 1px solid #000000; }
#visualWrap #visuaIinner #visualBox #photo_04_frame::after { position: absolute; width: 100%; height: 100%; top: 0; left: 0; content: ""; z-index: 110; border-right: 1px solid #000000; border-bottom: 1px solid #000000; }
#visualWrap #visuaIinner #visualBox #photo_05_frame::after { position: absolute; width: 100%; height: 100%; top: 0; left: 0; content: ""; z-index: 110; border-bottom: 1px solid #000000; }
#visualWrap #visuaIinner #visualBox #photo_06_frame::after { position: absolute; width: 100%; height: 100%; top: 0; left: 0; content: ""; z-index: 110; border-right: 1px solid #000000; border-bottom: 1px solid #000000; }
#visualWrap #visuaIinner #visualBox #photo_07_frame::after { position: absolute; width: 100%; height: 100%; top: 0; left: 0; content: ""; z-index: 110; border-right: 1px solid #000000; border-bottom: 1px solid #000000; }
#visualWrap #visuaIinner #visualBox #photo_08_frame::after { position: absolute; width: 100%; height: 100%; top: 0; left: 0; content: ""; z-index: 110; border-right: 1px solid #000000; border-bottom: 1px solid #000000; }
#visualWrap #visuaIinner #visualBox #photo_09_frame::after { position: absolute; width: 100%; height: 100%; top: 0; left: 0; content: ""; z-index: 110; border-bottom: 1px solid #000000; }
#visualWrap #visuaIinner #visualBox #photo_10_frame::after { position: absolute; width: 100%; height: 100%; top: 0; left: 0; content: ""; z-index: 110; border-right: 1px solid #000000; border-bottom: 1px solid #000000; }
#visualWrap #visuaIinner #visualBox #photo_11_frame::after { position: absolute; width: 100%; height: 100%; top: 0; left: 0; content: ""; z-index: 110; border-right: 1px solid #000000; border-bottom: 1px solid #000000; }
#visualWrap #visuaIinner #visualBox #photo_12_frame::after { position: absolute; width: 100%; height: 100%; top: 0; left: 0; content: ""; z-index: 110; border-right: 1px solid #000000; border-bottom: 1px solid #000000; }
#visualWrap #visuaIinner #visualBox #photo_13_frame::after { position: absolute; width: 100%; height: 100%; top: 0; left: 0; content: ""; z-index: 110; border-right: 1px solid #000000; border-bottom: 1px solid #000000; }
#visualWrap #visuaIinner #visualBox #photo_14_frame::after { position: absolute; width: 100%; height: 100%; top: 0; left: 0; content: ""; z-index: 110; border-right: 1px solid #000000; }
#visualWrap #visuaIinner #visualBox #photo_15_frame::after { position: absolute; width: 100%; height: 100%; top: 0; left: 0; content: ""; z-index: 110; border-right: 1px solid #000000; }
#visualWrap #visuaIinner #visualBox #photo_16_frame::after { position: absolute; width: 100%; height: 100%; top: 0; left: 0; content: ""; z-index: 110; border-right: 1px solid #000000; }
#visualWrap #visuaIinner #visualBox #photo_17_frame::after { position: absolute; width: 100%; height: 100%; top: 0; left: 0; content: ""; z-index: 110; border-right: 1px solid #000000; }
#visualWrap #visuaIinner #visualBox #photo_18_frame::after { position: absolute; width: 100%; height: 100%; top: 0; left: 0; content: ""; z-index: 110; }

#visualWrap #visuaIinner #visualBox .photo_area { width: 100%; height: 100%; position: absolute; top: 0; left: 0; }
#visualWrap #visuaIinner #visualBox .active { opacity: 0; transition: opacity 2s ease-out; }

#visualWrap #photo_01_bg1 { width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: 3; background-size: 100%; }
#visualWrap #photo_01_bg2 { width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: 2; background-size: 100%; }
#visualWrap #photo_01_bg3 { width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: 1; background-size: 100%; }

#visualWrap #photo_02_bg1 { width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: 3; background-size: 100%; }
#visualWrap #photo_02_bg2 { width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: 2; background-size: 100%; }
#visualWrap #photo_02_bg3 { width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: 1; background-size: 100%; }

#visualWrap #photo_03_bg1 { width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: 3; background-size: 100%; }
#visualWrap #photo_03_bg2 { width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: 2; background-size: 100%; }
#visualWrap #photo_03_bg3 { width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: 1; background-size: 100%; }

#visualWrap #photo_04_bg1 { width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: 3; background-size: 100%; }
#visualWrap #photo_04_bg2 { width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: 2; background-size: 100%; }
#visualWrap #photo_04_bg3 { width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: 1; background-size: 100%; }

#visualWrap #photo_05_bg1 { width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: 3; background-size: 100%; }
#visualWrap #photo_05_bg2 { width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: 2; background-size: 100%; }
#visualWrap #photo_05_bg3 { width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: 1; background-size: 100%; }

#visualWrap #photo_06_bg1 { width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: 3; background-size: 100%; }
#visualWrap #photo_06_bg2 { width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: 2; background-size: 100%; }
#visualWrap #photo_06_bg3 { width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: 1; background-size: 100%; }

#visualWrap #photo_07_bg1 { width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: 3; background-size: 100%; }
#visualWrap #photo_07_bg2 { width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: 2; background-size: 100%; }
#visualWrap #photo_07_bg3 { width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: 1; background-size: 100%; }

#visualWrap #photo_08_bg1 { width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: 3; background-size: 100%; }
#visualWrap #photo_08_bg2 { width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: 2; background-size: 100%; }
#visualWrap #photo_08_bg3 { width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: 1; background-size: 100%; }

#visualWrap #photo_09_bg1 { width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: 3; background-size: 100%; }
#visualWrap #photo_09_bg2 { width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: 2; background-size: 100%; }
#visualWrap #photo_09_bg3 { width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: 1; background-size: 100%; }

#visualWrap #photo_10_bg1 { width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: 3; background-size: 100%; }
#visualWrap #photo_10_bg2 { width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: 2; background-size: 100%; }
#visualWrap #photo_10_bg3 { width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: 1; background-size: 100%; }

#visualWrap #photo_11_bg1 { width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: 3; background-size: 100%; }
#visualWrap #photo_11_bg2 { width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: 2; background-size: 100%; }
#visualWrap #photo_11_bg3 { width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: 1; background-size: 100%; }

#visualWrap #photo_12_bg1 { width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: 3; background-size: 100%; }
#visualWrap #photo_12_bg2 { width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: 2; background-size: 100%; }
#visualWrap #photo_12_bg3 { width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: 1; background-size: 100%; }

#visualWrap #photo_13_bg1 { width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: 3; background-size: 100%; }
#visualWrap #photo_13_bg2 { width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: 2; background-size: 100%; }
#visualWrap #photo_13_bg3 { width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: 1; background-size: 100%; }

#visualWrap #photo_14_bg1 { width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: 3; background-size: 100%; }
#visualWrap #photo_14_bg2 { width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: 2; background-size: 100%; }
#visualWrap #photo_14_bg3 { width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: 1; background-size: 100%; }

#visualWrap #photo_15_bg1 { width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: 3; background-size: 100%; }
#visualWrap #photo_15_bg2 { width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: 2; background-size: 100%; }
#visualWrap #photo_15_bg3 { width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: 1; background-size: 100%; }

#visualWrap #photo_16_bg1 { width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: 3; background-size: 100%; }
#visualWrap #photo_16_bg2 { width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: 2; background-size: 100%; }
#visualWrap #photo_16_bg3 { width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: 1; background-size: 100%; }

#visualWrap #photo_17_bg1 { width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: 3; background-size: 100%; }
#visualWrap #photo_17_bg2 { width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: 2; background-size: 100%; }
#visualWrap #photo_17_bg3 { width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: 1; background-size: 100%; }

#visualWrap #photo_18_bg1 { width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: 3; background-size: 100%; }
#visualWrap #photo_18_bg2 { width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: 2; background-size: 100%; }
#visualWrap #photo_18_bg3 { width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: 1; background-size: 100%; }

@media screen and (max-width: 1280px) {
	#visualWrap #visuaIinner #visualBox { padding-top: calc(100% / 5 * 5); }
	
	#visualWrap #visuaIinner #visualBox #photo_01_frame { width: calc(100% / 5 * 2); padding-top: calc(100% / 5 * 2); top: 0; left: 0; }
	#visualWrap #visuaIinner #visualBox #photo_02_frame { width: calc(100% / 5 * 2); padding-top: calc(100% / 5); top: 0; left: calc(100% / 5 * 2); }
	#visualWrap #visuaIinner #visualBox #photo_03_frame { width: calc(100% / 5); padding-top: calc(100% / 5); top: 0; left: calc(100% / 5 * 4); }
	#visualWrap #visuaIinner #visualBox #photo_04_frame { width: calc(100% / 5); padding-top: calc(100% / 5); top: calc(100% / 5); left: calc(100% / 5 * 3); }
	#visualWrap #visuaIinner #visualBox #photo_05_frame { width: calc(100% / 5); padding-top: calc(100% / 5 * 2); top: calc(100% / 5); left: calc(100% / 5 * 4); }
	#visualWrap #visuaIinner #visualBox #photo_06_frame { width: calc(100% / 5); padding-top: calc(100% / 5); top: calc(100% / 5); left: calc(100% / 5 * 2); }
	#visualWrap #visuaIinner #visualBox #photo_07_frame { width: calc(100% / 5); padding-top: calc(100% / 5); top: calc(100% / 5 * 3); left: calc(100% / 5 * 2); }
	#visualWrap #visuaIinner #visualBox #photo_08_frame { width: calc(100% / 5); padding-top: calc(100% / 5); top: calc(100% / 5 * 2); left: calc(100% / 5 * 3); }
	#visualWrap #visuaIinner #visualBox #photo_09_frame { width: calc(100% / 5); padding-top: calc(100% / 5); top: calc(100% / 5 * 3); left: calc(100% / 5 * 4); }
	#visualWrap #visuaIinner #visualBox #photo_10_frame { width: calc(100% / 5); padding-top: calc(100% / 5); top: calc(100% / 5 * 2); left: calc(100% / 5); }
	#visualWrap #visuaIinner #visualBox #photo_11_frame { width: calc(100% / 5); padding-top: calc(100% / 5); top: calc(100% / 5 * 2); left: calc(100% / 5 * 2); }
	#visualWrap #visuaIinner #visualBox #photo_12_frame { width: calc(100% / 5); padding-top: calc(100% / 5); top: calc(100% / 5 * 3); left: calc(100% / 5 * 3); }
	#visualWrap #visuaIinner #visualBox #photo_13_frame { width: calc(100% / 5); padding-top: calc(100% / 5); top: calc(100% / 5 * 2); left: 0; }
	#visualWrap #visuaIinner #visualBox #photo_14_frame { width: calc(100% / 5); padding-top: calc(100% / 5); top: calc(100% / 5 * 3); left: 0; }
	#visualWrap #visuaIinner #visualBox #photo_15_frame { width: calc(100% / 5 * 2); padding-top: calc(100% / 5); top: calc(100% / 5 * 4); left: 0; }
	#visualWrap #visuaIinner #visualBox #photo_16_frame { width: calc(100% / 5); padding-top: calc(100% / 5); top: calc(100% / 5 * 3); left: calc(100% / 5); }
	#visualWrap #visuaIinner #visualBox #photo_17_frame { width: calc(100% / 5 * 2); padding-top: calc(100% / 5); top: calc(100% / 5 * 4); left: calc(100% / 5 * 2); }
	#visualWrap #visuaIinner #visualBox #photo_18_frame { width: calc(100% / 5); padding-top: calc(100% / 5); top: calc(100% / 5 * 4); left: calc(100% / 5 * 4); }
	
	#visualWrap #visuaIinner #visualBox #photo_01_frame::after { border-right: 1px solid #000000; border-bottom: 1px solid #000000; }
	#visualWrap #visuaIinner #visualBox #photo_02_frame::after { border-right: 1px solid #000000; border-bottom: 1px solid #000000; }
	#visualWrap #visuaIinner #visualBox #photo_03_frame::after { border-right: none; border-bottom: 1px solid #000000; }
	#visualWrap #visuaIinner #visualBox #photo_04_frame::after { border-right: 1px solid #000000; border-bottom: 1px solid #000000; }
	#visualWrap #visuaIinner #visualBox #photo_05_frame::after { border-bottom: 1px solid #000000; }
	#visualWrap #visuaIinner #visualBox #photo_06_frame::after { border-right: 1px solid #000000; border-bottom: 1px solid #000000; }
	#visualWrap #visuaIinner #visualBox #photo_07_frame::after { border-right: 1px solid #000000; border-bottom: 1px solid #000000; }
	#visualWrap #visuaIinner #visualBox #photo_08_frame::after { border-right: 1px solid #000000; border-bottom: 1px solid #000000; }
	#visualWrap #visuaIinner #visualBox #photo_09_frame::after { border-bottom: 1px solid #000000; }
	#visualWrap #visuaIinner #visualBox #photo_10_frame::after { border-right: 1px solid #000000; border-bottom: 1px solid #000000; }
	#visualWrap #visuaIinner #visualBox #photo_11_frame::after { border-right: 1px solid #000000; border-bottom: 1px solid #000000; }
	#visualWrap #visuaIinner #visualBox #photo_12_frame::after { border-right: 1px solid #000000; border-bottom: 1px solid #000000; }
	#visualWrap #visuaIinner #visualBox #photo_13_frame::after { border-right: 1px solid #000000; border-bottom: 1px solid #000000; }
	#visualWrap #visuaIinner #visualBox #photo_14_frame::after { border-right: 1px solid #000000; border-bottom: 1px solid #000000; }
	#visualWrap #visuaIinner #visualBox #photo_15_frame::after { border-right: 1px solid #000000; }
	#visualWrap #visuaIinner #visualBox #photo_16_frame::after { border-right: 1px solid #000000; border-bottom: 1px solid #000000; }
	#visualWrap #visuaIinner #visualBox #photo_17_frame::after { border-right: 1px solid #000000; }
}

@media screen and (max-width: 767px) {
	#visualWrap #visuaIinner #visualBox { padding-top: calc(100% / 4 * 7); }
	
	#visualWrap #visuaIinner #visualBox #snsIconTop { display: none; }
	
	#visualWrap #visuaIinner #visualBox #photo_01_frame { width: calc(100% / 4 * 2); padding-top: calc(100% / 4 * 2); top: 0; left: 0; }
	#visualWrap #visuaIinner #visualBox #photo_02_frame { width: calc(100% / 4 * 2); padding-top: calc(100% / 4); top: 0; left: calc(100% / 4 * 2); }
	#visualWrap #visuaIinner #visualBox #photo_03_frame { width: calc(100% / 4); padding-top: calc(100% / 4); top: calc(100% / 7 * 2); left: calc(100% / 4 * 3); }
	#visualWrap #visuaIinner #visualBox #photo_04_frame { width: calc(100% / 4); padding-top: calc(100% / 4); top: calc(100% / 7 * 4); left: calc(100% / 4 * 2); }
	#visualWrap #visuaIinner #visualBox #photo_05_frame { width: calc(100% / 4); padding-top: calc(100% / 4 * 2); top: calc(100% / 7 * 3); left: calc(100% / 4 * 3); }
	#visualWrap #visuaIinner #visualBox #photo_06_frame { width: calc(100% / 4); padding-top: calc(100% / 4); top: calc(100% / 7); left: calc(100% / 4 * 2); }
	#visualWrap #visuaIinner #visualBox #photo_07_frame { width: calc(100% / 4 * 2); padding-top: calc(100% / 4 * 2); top: calc(100% / 7 * 2); left: calc(100% / 4); }
	#visualWrap #visuaIinner #visualBox #photo_08_frame { width: calc(100% / 4); padding-top: calc(100% / 4); top: calc(100% / 7 * 5); left: calc(100% / 4 * 2); }
	#visualWrap #visuaIinner #visualBox #photo_09_frame { width: calc(100% / 4); padding-top: calc(100% / 4); top: calc(100% / 7 * 5); left: calc(100% / 4 * 3); }
	#visualWrap #visuaIinner #visualBox #photo_10_frame { width: calc(100% / 4); padding-top: calc(100% / 4); top: calc(100% / 7); left: calc(100% / 4 * 3); }
	#visualWrap #visuaIinner #visualBox #photo_11_frame { width: calc(100% / 4); padding-top: calc(100% / 4); top: calc(100% / 7 * 2); left: 0; }
	#visualWrap #visuaIinner #visualBox #photo_12_frame { width: calc(100% / 4); padding-top: calc(100% / 4); top: calc(100% / 7 * 3); left: 0; }
	#visualWrap #visuaIinner #visualBox #photo_13_frame { width: calc(100% / 4); padding-top: calc(100% / 4); top: calc(100% / 7 * 5); left: 0; }
	#visualWrap #visuaIinner #visualBox #photo_14_frame { width: calc(100% / 4); padding-top: calc(100% / 4); top: calc(100% / 7 * 6); left: 0; }
	#visualWrap #visuaIinner #visualBox #photo_15_frame { width: calc(100% / 4 * 2); padding-top: calc(100% / 4); top: calc(100% / 7 * 6); left: calc(100% / 4); }
	#visualWrap #visuaIinner #visualBox #photo_16_frame { width: calc(100% / 4); padding-top: calc(100% / 4); top: calc(100% / 7 * 5); left: calc(100% / 4); }
	#visualWrap #visuaIinner #visualBox #photo_17_frame { width: calc(100% / 4 * 2); padding-top: calc(100% / 4); top: calc(100% / 7 * 4); left: 0; }
	#visualWrap #visuaIinner #visualBox #photo_18_frame { width: calc(100% / 4); padding-top: calc(100% / 4); top: calc(100% / 7 * 6); left: calc(100% / 4 * 3); }
	
	#visualWrap #visuaIinner #visualBox #photo_01_frame::after { border-right: 1px solid #000000; border-bottom: 1px solid #000000; }
	#visualWrap #visuaIinner #visualBox #photo_02_frame::after { border-right: none; border-bottom: 1px solid #000000; }
	#visualWrap #visuaIinner #visualBox #photo_03_frame::after { border-right: none; border-bottom: 1px solid #000000; }
	#visualWrap #visuaIinner #visualBox #photo_04_frame::after { border-right: 1px solid #000000; border-bottom: 1px solid #000000; }
	#visualWrap #visuaIinner #visualBox #photo_05_frame::after { border-bottom: 1px solid #000000; }
	#visualWrap #visuaIinner #visualBox #photo_06_frame::after { border-right: 1px solid #000000; border-bottom: 1px solid #000000; }
	#visualWrap #visuaIinner #visualBox #photo_07_frame::after { border-right: 1px solid #000000; border-bottom: 1px solid #000000; }
	#visualWrap #visuaIinner #visualBox #photo_08_frame::after { border-right: 1px solid #000000; border-bottom: 1px solid #000000; }
	#visualWrap #visuaIinner #visualBox #photo_09_frame::after { border-bottom: 1px solid #000000; }
	#visualWrap #visuaIinner #visualBox #photo_10_frame::after { border-right: none; border-bottom: 1px solid #000000; }
	#visualWrap #visuaIinner #visualBox #photo_11_frame::after { border-right: 1px solid #000000; border-bottom: 1px solid #000000; }
	#visualWrap #visuaIinner #visualBox #photo_12_frame::after { border-right: 1px solid #000000; border-bottom: 1px solid #000000; }
	#visualWrap #visuaIinner #visualBox #photo_13_frame::after { border-right: 1px solid #000000; border-bottom: 1px solid #000000; }
	#visualWrap #visuaIinner #visualBox #photo_14_frame::after { border-right: 1px solid #000000; border-bottom: none; }
	#visualWrap #visuaIinner #visualBox #photo_15_frame::after { border-right: 1px solid #000000; }
	#visualWrap #visuaIinner #visualBox #photo_16_frame::after { border-right: 1px solid #000000; border-bottom: 1px solid #000000; }
	#visualWrap #visuaIinner #visualBox #photo_17_frame::after { border-right: 1px solid #000000; border-bottom: 1px solid #000000; }
}



/* 各セクション背景
========================================================= */

#wrapperBg { width: 100%; height: 100%; position: fixed; top: 0; left: 0; z-index: 1; overflow: hidden; }
#wrapperBg .wrapper1Bg { width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: 70; background: url(../../images/wrapper_bg_section1.jpg) no-repeat center center; background-size: cover; transition: opacity 0.7s ease 0s; }
#wrapperBg .wrapper2Bg { width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: 60; background: url(../../images/wrapper_bg_section2.jpg) no-repeat center center; background-size: cover; transition: opacity 0.7s ease 0s; }
#wrapperBg .wrapper3Bg { width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: 50; background: url(../../images/wrapper_bg_section3.jpg) no-repeat center center; background-size: cover; transition: opacity 0.7s ease 0s; }
#wrapperBg .wrapperOpacityBg { opacity: 0; }

@media screen and (max-width: 767px) {
	#wrapperBg { display: none; }
}



/* 各セクション
========================================================= */

/* デバッグ用CSS */
/*
#section1Wrap { border-top: 1px solid rgba(255,0,0,0.8); border-left: 1px solid rgba(255,0,0,0.8); border-right: 1px solid rgba(255,0,0,0.8); }
#section2Wrap { border-top: 1px solid rgba(255,0,0,0.8); border-left: 1px solid rgba(255,0,0,0.8); border-right: 1px solid rgba(255,0,0,0.8); }
#section3Wrap { border-top: 1px solid rgba(255,0,0,0.8); border-left: 1px solid rgba(255,0,0,0.8); border-right: 1px solid rgba(255,0,0,0.8); }
*/

#section1Wrap { position: relative; z-index: 100; overflow: hidden; }
#section2Wrap { position: relative; z-index: 100; overflow: hidden; }
#section3Wrap { position: relative; z-index: 100; overflow: hidden; }

.section0WrapOpacity { transition: opacity 0.3s linear; opacity: 1; }
.section1WrapOpacity { transition: opacity 0.3s linear; opacity: 0; }
.section2WrapOpacity { transition: opacity 0.3s linear; opacity: 0; }
.section3WrapOpacity { transition: opacity 0.3s linear; opacity: 0; }

.sectionOpacityShow { opacity: 1; }
.sectionOpacityHide { opacity: 0; }

@media screen and (max-width: 767px) {
	#section1Wrap { position: static; overflow: visible; }
	#section2Wrap { position: static; overflow: visible; }
	#section3Wrap { position: static; overflow: visible; }
	
	.section1WrapOpacity { transition: none; opacity: 1; }
	.section2WrapOpacity { transition: none; opacity: 1; }
	.section3WrapOpacity { transition: none; opacity: 1; }
}



/* セクション 1 | History
========================================================= */

#section1Box { height: 100vh; min-height: 800px; position: relative; overflow: hidden; }
#section1BoxInner { width: 100%; height: auto; max-height: 980px; position: absolute; top: 50%; left: 50%; z-index: 150; transform: translateY(-50%) translateX(-50%); text-align: center; }

#section1Box .section1_photo1 { transform: scale(0.2); opacity: 0; -webkit-backface-visibility: hidden; width: 295px; height: 325px; position: absolute; top: calc(190 / 980 * 100%); left: 75px; z-index: 110; }
#section1Box .section1_photo2 { transform: scale(0.2); opacity: 0; -webkit-backface-visibility: hidden; width: 633px; height: 749px; position: absolute; top: calc(75 / 980 * 100%); right: -234px; z-index: 110; }
#section1Box .section1_photo3 { transform: scale(0.2); opacity: 0; -webkit-backface-visibility: hidden; width: 251px; height: 206px; position: absolute; top: calc(620 / 980 * 100%); left: 128px; z-index: 110; }
#section1Box .section1_photo_show { transition: all 0.8s ease 0.3s; transform: scale(1); opacity: 1; }

#section1Box .section1_h2   { transform: translateY(100px); opacity: 0; color: #ffffff; font-family: "Yu Mincho", "YuMincho"; font-size: 4.6rem; font-weight: 400; line-height: 5rem; text-shadow: 0px 0px 9px rgba(0,0,0,0.7); letter-spacing: 28px; padding-left: 14px; margin-bottom: 47px; }
#section1Box .section1_h3   { transform: translateY(100px); opacity: 0; color: #ffffff; font-family: "Yu Mincho", "YuMincho"; font-size: 4.2rem; font-weight: 400; font-feature-settings: "palt"; line-height: 5.8rem; text-shadow: 0px 0px 9px rgba(0,0,0,0.7); margin-bottom: 28px; }
#section1Box .section1_p    { transform: translateY(100px); opacity: 0; width: 100%; color: #ffffff; font-family: "Yu Mincho", "YuMincho"; font-size: 1.6rem; font-weight: 400; line-height: 3.6rem; text-shadow: 0px 0px 9px rgba(0,0,0,0.7); margin-bottom: 68px; }
#section1Box .section1_link { transform: translateY(100px); opacity: 0; width: 190px; margin: 0 auto; background-color: #796353; font-family: "Yu Mincho", "YuMincho"; font-size: 1.5rem; font-weight: 400; line-height: 2.2rem; }
#section1Box .section1_link a { color: #ffffff; text-align: left; text-decoration: none; position: relative; display: block; padding: 12px 0 10px 17px; }
#section1Box .section1_link a::before { position: absolute; top: 50%; right: 15px; margin-top: -6px; content: ""; width: 12px; height: 12px; border-top: 1px solid #ffffff; border-right: 1px solid #ffffff; transform: rotate(45deg); transition: right 0.3s ease; }
#section1Box .section1_link a::after { position: absolute; top: 50%; right: 14px; margin-top: -1px; content: ""; width: 17px; height: 1px; background-color: #ffffff; transition: right 0.3s ease; }
#section1Box .section1_txt_show { transition: all 0.8s ease 0.3s; transform: translateY(0px); opacity: 1; }

@media screen and (min-width: 769px) {
	#section1Box .section1_link a:hover::before { right: 9px; }
	#section1Box .section1_link a:hover::after { right: 8px; }
}

@media screen and (max-width: 1280px) {
	#section1Box .section1_photo1 { top: calc(210 / 980 * 100%); left: 40px; }
	#section1Box .section1_photo2 { top: calc(80 / 980 * 100%); right: -260px; }
	#section1Box .section1_photo3 { top: calc(620 / 980 * 100%); left: 100px; }
	#section1Box .section1_photo_show { transform: scale(0.8); }
}

@media screen and (max-width: 1080px) {
	#section1Box { min-height: 530px; }
	#section1BoxInner { max-height: 530px; }
	
	#section1Box .section1_photo1 { top: calc(190 / 980 * 100%); left: 15px; }
	#section1Box .section1_photo2 { top: calc(75 / 980 * 100%); right: -260px; }
	#section1Box .section1_photo3 { top: calc(600 / 980 * 100%); left: 55px; }
	#section1Box .section1_photo_show { transform: scale(0.65); }
	
	#section1Box .section1_h2 { font-size: 3.8rem; line-height: 4.2rem; letter-spacing: 20px; padding-left: 10px; margin-bottom: 35px; }
	#section1Box .section1_h3 { font-size: 3.6rem; line-height: 5.2rem; margin-bottom: 20px; }
	#section1Box .section1_p { font-size: 1.5rem; line-height: 3.2rem; margin-bottom: 50px; }
}

@media screen and (max-width: 920px) {
	#section1Box .section1_photo1 { top: calc(140 / 980 * 100%); left: -30px; }
	#section1Box .section1_photo2 { top: calc(76 / 980 * 100%); right: -320px; }
	#section1Box .section1_photo3 { top: calc(595 / 980 * 100%); left: 15px; }
	#section1Box .section1_photo_show { transform: scale(0.55); }
}

@media screen and (max-width: 767px) {
	#section1Box { min-height: 477px; background: url(../../images/section1_wrap_bg_sp.jpg) no-repeat center center; background-size: cover; }
	#section1BoxInner { width: 81.25%; max-width: 360px; max-height: 477px; }
	
	#section1Box .section1_photo1 { display: none; }
	#section1Box .section1_photo2 { display: none; }
	#section1Box .section1_photo3 { display: none; }
	
	#section1Box .section1_h2 { transform: none; transition: none; opacity: 1; font-size: 2.4rem; line-height: 2.8rem; letter-spacing: 8px; padding-left: 4px; margin-bottom: 19px; }
	#section1Box .section1_h3 { transform: none; transition: none; opacity: 1; font-size: 2.6rem; line-height: 3.4rem; margin-bottom: 14px; }
	#section1Box .section1_p { transform: none; transition: none; opacity: 1; font-size: 1.4rem; line-height: 2.6rem; text-align: left; margin-bottom: 22px; }
	#section1Box .section1_p br { display: none; }
	#section1Box .section1_link { transform: none; transition: none; opacity: 1; width: 170px; font-size: 1.4rem; }
	#section1Box .section1_link a { padding: 10px 0 8px 17px; }
}



/* セクション 2 | Genealogy
========================================================= */

#section2Box { height: 100vh; min-height: 614px; position: relative; overflow: hidden; }
#section2BoxInner { width: 100%; height: 100%; max-height: 614px; position: absolute; top: 50%; left: 50%; z-index: 150; transform: translateY(-50%) translateX(-50%); text-align: center; }

#section2Box .section2_grd { transform: translateY(150px); opacity: 0; width: 100%; background: url(../../images/section2_grd_bg.png) no-repeat center center; background-size: 100% 100%; padding-top: 75px; padding-bottom: 70px; }
#section2Box .section2_grd_show { transition: all 0.8s ease 0.3s; transform: translateY(0px); opacity: 1; }

#section2Box .section2_h2 { transform: translateY(100px); opacity: 0; font-family: "Yu Mincho", "YuMincho"; font-size: 4.6rem; font-weight: 400; line-height: 5rem; letter-spacing: 28px; padding-left: 14px; margin-bottom: 43px; }
#section2Box .section2_h3 { transform: translateY(100px); opacity: 0; font-family: "Yu Mincho", "YuMincho"; font-size: 3.2rem; font-weight: 400; font-feature-settings: "palt"; line-height: 4.6rem; margin-bottom: 20px; }
#section2Box .section2_p  { transform: translateY(100px); opacity: 0; font-family: "Yu Mincho", "YuMincho"; font-size: 1.6rem; font-weight: 400; line-height: 3.6rem; margin-bottom: 50px; }
#section2Box .section2_link { transform: translateY(100px); opacity: 0; width: 190px; margin: 0 auto; background-color: #2aa59b; font-family: "Yu Mincho", "YuMincho"; font-size: 1.5rem; font-weight: 400; line-height: 2.2rem; }
#section2Box .section2_link a { color: #ffffff; text-align: left; text-decoration: none; position: relative; display: block; padding: 12px 0 10px 17px; }
#section2Box .section2_link a::before { position: absolute; top: 50%; right: 15px; margin-top: -6px; content: ""; width: 12px; height: 12px; border-top: 1px solid #ffffff; border-right: 1px solid #ffffff; transform: rotate(45deg); transition: right 0.3s ease; }
#section2Box .section2_link a::after { position: absolute; top: 50%; right: 14px; margin-top: -1px; content: ""; width: 17px; height: 1px; background-color: #ffffff; transition: right 0.3s ease; }

#section2Box .section2_h2_show { transition: all 0.9s ease 0.4s; transform: translateY(0px); opacity: 1; }
#section2Box .section2_h3_show { transition: all 0.9s ease 0.6s; transform: translateY(0px); opacity: 1; }
#section2Box .section2_p_show { transition: all 0.9s ease 0.8s; transform: translateY(0px); opacity: 1; }
#section2Box .section2_link_show { transition: all 0.9s ease 1.0s; transform: translateY(0px); opacity: 1; }

@media screen and (min-width: 769px) {
	#section2Box .section2_link a:hover::before { right: 9px; }
	#section2Box .section2_link a:hover::after { right: 8px; }
}

@media screen and (max-width: 1080px) {
	#section2Box { min-height: 536px; }
	#section2BoxInner { max-height: 536px; }
	
	#section2Box .section2_grd { padding-top: 55px; padding-bottom: 60px; }
	
	#section2Box .section2_h2 { font-size: 3.8rem; line-height: 4.2rem; letter-spacing: 20px; padding-left: 10px; margin-bottom: 35px; }
	#section2Box .section2_h3 { font-size: 2.5rem; line-height: 3.7rem; margin-bottom: 15px; }
	#section2Box .section2_p { font-size: 1.5rem; line-height: 3.2rem; margin-bottom: 40px; }
}

@media screen and (max-width: 920px) {
	#section2Box { min-height: 500px; }
	#section2BoxInner { max-height: 500px; }
	
	#section2Box .section2_h2 { font-size: 3.6rem; line-height: 4rem; letter-spacing: 18px; padding-left: 9px; margin-bottom: 31px; }
	#section2Box .section2_h3 { font-size: 2.5rem; line-height: 3.7rem; margin-bottom: 18px; }
	#section2Box .section2_p { font-size: 1.4rem; line-height: 3rem; margin-bottom: 35px; }
}

@media screen and (max-width: 767px) {
	#section2Box { min-height: auto; background: url(../../images/section2_wrap_bg_sp.jpg) no-repeat center center; background-size: cover; }
	#section2BoxInner { max-height: auto; height: auto; }
	
	#section2Box .section2_grd { transform: none; transition: none; opacity: 1; padding-top: 27px; padding-bottom: 30px; background-color: rgba(255,255,255,0.5); }
	
	#section2Box .section2_h2 { transform: none; transition: none; opacity: 1; font-size: 2.4rem; line-height: 2.8rem; letter-spacing: 8px; padding-left: 4px; margin-bottom: 18px; }
	#section2Box .section2_h3 { transform: none; transition: none; opacity: 1; font-size: 2rem; line-height: 3rem; margin-bottom: 14px; }
	#section2Box .section2_h3 br { display: block; }
	#section2Box .section2_p { width: 81.25%; max-width: 360px; margin: 0 auto; transform: none; transition: none; opacity: 1; font-size: 1.4rem; line-height: 2.4rem; margin-bottom: 20px; text-align: left; }
	#section2Box .section2_p br { display: none; }
	#section2Box .section2_link { transform: none; transition: none; opacity: 1; width: 170px; font-size: 1.4rem; line-height: 2.2rem; }
	#section2Box .section2_link a { padding: 10px 0 8px 17px; }
	/* リンク後削除 */
	#section2Box .section2_link span { padding: 10px 0 8px 17px; }
}



/* セクション 3 | Movie
========================================================= */
/*
#section3Box { height: 100vh; min-height: 630px; position: relative; overflow: hidden; }
#section3BoxInner { width: 81.25%; max-width: 1140px; height: auto; max-height: 630px; position: absolute; top: 50%; left: 50%; z-index: 150; transform: translateY(-50%) translateX(-50%); text-align: center; }

#section3Box .section3_h2 { transform: translateY(150px); opacity: 0; color:#000000; font-family: "Yu Mincho", "YuMincho"; font-size: 4.6rem; font-weight: 400; font-feature-settings: "palt"; line-height: 5rem; letter-spacing: 28px; padding-left: 14px; margin-bottom: 28px; }
#section3Box .section3_p { transform: translateY(150px); opacity: 0; color:#000000; font-family: "Yu Mincho", "YuMincho"; font-size: 2.6rem; font-weight: 400; line-height: 4.6rem; margin-bottom: 58px; }
#section3Box .section3_p br:nth-child(1) { display: none; }
#section3Box .section3_p br:nth-child(3) { display: none; }
#section3Box .section3_h2_show { transition: all 0.8s ease 0.5s; transform: translateY(0px); opacity: 1; }
#section3Box .section3_p_show  { transition: all 0.8s ease 0.7s; transform: translateY(0px); opacity: 1; }

#section3Box .section3_movie { max-width: 500px; width: 100%; margin: 0 auto; }
#section3Box .section3_movie1 { transform: translateY(150px); opacity: 0; }
#section3Box .section3_movie1_show { transition: all 0.8s ease 0.5s; transform: translateY(0px); opacity: 1; }
#section3Box .section3_movie1 a { width: 100%; height: 0; padding-top: 75.769%; display: block; position: relative; }
#section3Box .section3_movie1 a .section3_movie1_bg1 { position: absolute; top: 0; left: 0; z-index: 11; width: 100%; height: 100%; background: url(../../images/section3_movie1.png) no-repeat; background-size: 100% 100%; opacity: 1; }
#section3Box .section3_movie1 a .section3_movie1_bg2 { position: absolute; top: 0; left: 0; z-index: 12; width: 100%; height: 100%; background: url(../../images/section3_movie1_hover.png) no-repeat; background-size: 100% 100%; opacity: 0; transition: all 0.6s ease; }

@media screen and (min-width: 769px) {
	#section3Box .section3_movie1 a:hover .section3_movie1_bg2 { opacity: 1; }
}

@media screen and (max-width: 1080px) {
	#section3Box .section3_h2 { font-size: 3.8rem; line-height: 4.2rem; letter-spacing: 20px; padding-left: 10px; margin-bottom: 18px; }
	#section3Box .section3_p { font-size: 1.8rem; line-height: 3rem; margin-bottom: 30px; }
}

@media screen and (max-width: 920px) {
	#section3BoxInner { max-width: 1140px; height: auto; max-height: 710px; }
	
	#section3Box .section3_h2 { font-size: 3.6rem; line-height: 4rem; letter-spacing: 18px; padding-left: 9px; margin-bottom: 15px; }
	#section3Box .section3_p { font-size: 1.7rem; line-height: 2.8rem; margin-bottom: 20px; }
	
	#section3Box .section3_movie { max-width: 370px; display: block; }
	#section3Box .section3_movie1 { width: 100%; display: block; margin-bottom: 10px; }
}

@media screen and (max-width: 767px) {
	#section3Box { min-height: 700px; background: url(../../images/section3_wrap_bg_sp.jpg) no-repeat center center; background-size: cover; }
	#section3BoxInner { max-height: 700px; }
	
	#section3Box .section3_p br:nth-child(1) { display: block; }
	#section3Box .section3_p br:nth-child(3) { display: block; }
	
	#section3Box .section3_h2 { transform: none; transition: none; opacity: 1; font-size: 2.4rem; line-height: 2.8rem; letter-spacing: 8px; padding-left: 4px; margin-bottom: 19px; }
	#section3Box .section3_p { transform: none; transition: none; opacity: 1; font-size: 1.4rem; line-height: 2.4rem; margin-bottom: 15px; }
	
	#section3Box .section3_movie { max-width: 350px; }
	#section3Box .section3_movie1 { transform: none; transition: none; opacity: 1; margin-bottom: 5px; }
}

*/