#project .sec1 h2 { text-align: center; font-size: 24px; }
@media screen and (max-width: 584px) { #project .sec1 h2 { font-size: 20px; line-height: 2em; } }
#project .sec1 .sec1a { background-color: #FFF000; color: #000; box-sizing: border-box; padding-top: 40px; padding-bottom: 40px; }
#project .sec1 .sec1a p.lead { display: block; max-width: 800px; margin-left: auto; margin-right: auto; text-align: left; }
@media screen and (max-width: 584px) { #project .sec1 .sec1a { margin-bottom: 0px; padding: 20px; } }
#project .sec1 .secin { max-width: 800px; margin-left: auto; margin-right: auto; }
@media screen and (max-width: 584px) { #project .sec1 .secin { padding-top: 40px; } }
#project .ffig1 { width: 40%; float: right; margin-left: 10px; }
#project .ffig2 { width: 24%; max-width: 260px; float: left; margin-right: 10px; }
@media screen and (max-width: 584px) { #project .ffig2 { width: 43%; } }
#project .ffig3 { width: 40%; float: right; margin-left: 10px; }
@media screen and (max-width: 584px) { #project .ffig3 { width: 100%; } }
#project .ffig4 { width: 24%; max-width: 260px; float: left; margin-right: 10px; }
@media screen and (max-width: 584px) { #project .ffig4 { width: 43%; } }
#project .ffig5 { width: 40%; float: right; margin-left: 10px; }
@media screen and (max-width: 584px) { #project .ffig5 { width: 100%; } }
#project .sec1c { position: relative; background-color: #eeeeef; border-bottom: 2px solid #FFF000; max-width: 700px; margin-top: 1px; }
#project .sec1c figure { width: 36%; float: right; }
#project .sec1c figure img { display: block; vertical-align: bottom; width: 100%; }
#project .sec1c p.lead { width: 64%; float: left; box-sizing: border-box; padding: 20px; }
@media screen and (max-width: 584px) { #project .sec1c { width: 95%; max-width: 360px; margin-left: -15px; }
  #project .sec1c figure { height: 110px; overflow: hidden; }
  #project .sec1c figure img { width: auto; height: 100%; position: absolute; left: 50%; -webkit-transform: translateX(-50%); -moz-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); }
  #project .sec1c p.lead { font-size: 11px; line-height: 1.7em; padding: 10px; padding-left: 20px; padding-right: 10px; } }
#project .sec1b { position: relative; background-color: #eeeeef; border-bottom: 2px solid #FFF000; margin-bottom: 30px; max-width: 700px; margin-left: auto; margin-right: 0; }
#project .sec1b figure { width: 36%; float: left; }
#project .sec1b figure img { display: block; vertical-align: bottom; width: 100%; }
#project .sec1b p.lead { width: 64%; float: right; box-sizing: border-box; padding: 20px; }
@media screen and (max-width: 584px) { #project .sec1b { width: 95%; max-width: 360px; margin-right: -15px; }
  #project .sec1b figure { height: 110px; overflow: hidden; }
  #project .sec1b figure img { width: auto; height: 100%; position: absolute; left: 50%; -webkit-transform: translateX(-50%); -moz-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); }
  #project .sec1b p.lead { font-size: 11px; line-height: 1.7em; padding: 10px; padding-left: 10px; padding-right: 10px; } }
#project p.lead { line-height: 2em; text-align: left; }
#project p.lead span { font-weight: 700; margin-right: 10px; }
#project p.lead span.ico1 { color: #004FA0; }
#project p.lead span.ico2 { color: #E2007D; }
#project p.ico1 { color: #004FA0; }
#project p.ico2 { text-align: right; color: #E2007D; }
@media screen and (max-width: 584px) { #project p.ico2 { text-align: left; } }
#project p.ico12 { color: #000; text-align: right; }
@media screen and (max-width: 584px) { #project p.ico12 { margin-top: 10px; } }
#project .isec1 { margin-top: 60px; }
@media screen and (max-width: 584px) { #project .isec1 { margin-top: 40px; } }
#project h3 { border-left: 4px solid #FFF000; box-sizing: border-box; padding-left: 24px; padding-top: 10px; padding-bottom: 10px; line-height: 2em; font-size: 20px; }
@media screen and (max-width: 584px) { #project h3 { font-size: 16px; } }
#project .pagetit { position: relative; width: 100%; }
#project .pagetit .bg { display: block; vertical-align: bottom; width: 100%; }
#project .pagetit::after { content: ""; position: absolute; width: 100%; max-width: 1200px; height: 100%; left: 50%; -webkit-transform: translateX(-50%); -moz-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); top: 0; background-size: cover; background-position: center top; }
@media screen and (max-width: 584px) { #project .pagetit::after { background-image: url("../images/project/img_01@sp.jpg"); } }
#project .pagetit .secin { position: absolute; width: 100%; height: 100%; left: 0; top: 0; max-width: 100%; }
@media screen and (max-width: 584px) { #project .pagetit .secin { padding: 0; } }
#project .pagetit h2 { position: absolute; width: 100%; max-width: 800px; z-index: 3; left: 50%; bottom: 80px; background-color: rgba(255, 255, 255, 0.8); box-sizing: border-box; padding: 15px; -webkit-transform: translateX(-50%); -moz-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); margin-bottom: 0; font-size: 34px; font-weight: 700; line-height:1.5em; margin-bottom:20px; padding-bottom:30px;  }
#project .pagetit h2 p { color: #595757; padding-bottom: 14px; margin-bottom: 16px; }
#project .pagetit h2 p span { position: relative; color: #000; font-size: 24px; font-weight: 400; display: block; margin-left: auto; margin-right: auto; }
#project .pagetit h2 p::after { top: auto; bottom: 0; width: 160px; }
@media screen and (max-width: 584px) { #project .pagetit h2 p { padding-bottom: 8px; margin-bottom: 10px; padding-top: 0; } }
@media screen and (max-width: 584px) { #project .pagetit h2 { font-size: 18px; padding-bottom: 10px; padding-left: 10px; padding-right: 10px; bottom: 10px; } }
@media screen and (max-width: 584px) { #project .pagetit { height: 300px; } }