@charset "utf-8";

html, body, div, span, object, iframe,h1, h2, h3, h4, h5, h6, p,em, img,strong, dl, dt, dd,ol, ul, li, form, label,table, caption, tbody, tfoot, thead, tr, th, td,article, aside, dialog, figure, figcaption, footer, header,hgroup, menu, nav, section,time, mark, audio, video { color:#555; margin:0; padding:0; border:0; outline:0; font-size:100%; vertical-align:top;  background:transparent; list-style-type:none; font-family: "A-OTF A1明朝 Std", "ヒラギノ明朝 ProN W6", "HiraMinProN-W6", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif; font-style:normal; line-height:1.5; word-break: break-all; box-sizing:border-box; letter-spacing: 0.4px; }
html { font-size: 100%; overflow-y: scroll; -webkit-tap-highlight-color: rgba(0,0,0,0); -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; }
article, aside, dialog, div, figure, footer, header, hgroup, nav, section { display: block; }

@font-face {
    font-family: 'ipa';
        src: url('../font/ipa.eot');
        src: url('../font/ipa.eot?#iefix') format('embedded-opentype'),
            url('../font/ipa.woff') format('woff'),
            url('../font/ipa.ttf') format('truetype');
}

.fl { float: left; }
.fr { float: right; }
.tr { text-align: right; }

.fontBlue   { color: #1D2088; }
.fontPurple { color: #83517A; }
.fontWine   { color: #973F61; }
.fontRed    { color: #BA4244; }
.fontOrange { color: #BB4D38; }
.fontGold   { color: #C2955C; }

.inr { width: 1000px; margin: auto; }

h1 { color: #1D2088; font-size: 26px; font-weight: bold; }

header { min-width: 1000px; height: 75px; background: #252161; }
header .inr { display: table; }
header .logo { margin: 10px 0; }
header h1 { display: block; width: 876px; margin: auto; }

nav { width: 1000px; margin: auto; }
nav ul { overflow: hidden; width: 800px; margin: 60px auto; }
nav li { float: left; margin: 0 25px; }

article { position: relative; left: -120px; }

.ceremony { position: relative; right: 12px; display: block; margin: auto; }
.bottom { position: relative; top: -120px; display: block; margin: auto; }
.thanks { display: block; margin: 20px auto; }

#content { background: url(../img/bg.png) center top 440px no-repeat; }
#content  h2 { width: 700px; margin: 80px auto 0; font-size: 20px; }

.boxInvite { width: 800px; margin: 20px auto 40px; padding: 30px 0; background: #fff; border: 1px solid #eee; }
.boxInvite h1 { margin-bottom: 20px; text-align: center; }
.boxInvite p { width: 415px; margin: auto; font-weight: bold; font-family: Osaka, Meiryo, "メイリオ", "ＭＳ Ｐゴシック", "MS PGothic", sans-serif; }
.boxInvite span { display: block; text-align: center; font-weight: bold; font-family: Osaka, Meiryo, "メイリオ", "ＭＳ Ｐゴシック", "MS PGothic", sans-serif; }
.boxInvite a { color: #0E68CC; }

#y1961 { position: relative; left: 260px; }
#y1965 { position: relative; left: 360px; }
#y1966 { position: relative; left: 300px; bottom: 25px; }
#y1967 { position: relative; left: 330px; bottom: 35px; }
#y1968 { position: relative; left: 410px; bottom: 45px; }
#y1969 { position: relative; left: 270px; bottom: 75px; }
#y1971 { position: relative; left: 160px; bottom: 95px; }
#y1972 { position: relative; left: 245px; bottom: 125px; }
#y1973 { position: relative; left: 340px; bottom: 140px; }
#y1975 { position: relative; left: 380px; bottom: 155px; }
#y1980 { position: relative; left: 180px; bottom: 145px; }
#y1982 { position: relative; left: 300px; bottom: 160px; }
#y1984 { position: relative; left: 200px; bottom: 180px; }
#y1986 { position: relative; left: 220px; bottom: 190px; }
#y1991 { position: relative; left: 240px; bottom: 200px; }
#y1993 { position: relative; left: 280px; bottom: 210px; }
#y1996 { position: relative; left: 365px; bottom: 260px; }
#y2002 { position: relative; left: 310px; bottom: 260px; }
#y2007 { position: relative; left: 220px; bottom: 280px; }
#y2010 { position: relative; left: 190px; bottom: 290px; }
#y2012 { position: relative; left: 260px; bottom: 290px; }
#y2017 { position: relative; left: 400px; bottom: 220px; width: 520px; }
#aniv  { position: relative; left: 410px; bottom: 220px; width: 520px; }
#aniv2 { position: relative; left: 460px; bottom: 200px; width: 520px; }

.photo { position: absolute; transition: .8s; transition-delay: .8s; }
#y1961 .photo { top: 0; left: 620px; width: 260px; }
#y1965 .photo { top: 0; left: -240px; width: 200px; }
#y1966 .photo { top: -60px; left: 630px; width: 240px; }
#y1966 .photo02 { top: 30px; left: -160px; width: 140px; }
#y1966 .photo03 { top: 140px; left: 630px; width: 240px; }
#y1967 .photo { top: 40px; left: -160px; width: 120px; }
#y1971 .photo { top: 20px; left: 600px; width: 340px; }
#y1973 .photo { top: -20px; left: 560px; width: 260px; }
#y1975 .photo { top: 0px; left: -160px; width: 100px; }
#y1980 .photo { top: 0; left: 820px; }
#y1982 .photo { top: 10px; left: -120px; }
#y1986 .photo { top: 0; left: 530px; }
#y1993 .photo { top: -100px; left: 580px; }
#y1996 .photo { top: 50px; left: -240px; }
#y2002 .photo { top: -40px; left: 610px; }
#y2007 .photo { top: 15px; left: 520px; }
#y2012 .photo { top: -50px; left: 540px; }
#y2017 span { font-size: 26px; font-weight: 600; line-height: 1.2; }
#aniv h3 { font-size: 16px; line-height: 2; }

#y1982 h3 { padding-right: 10px; }

.effect, .odd { display: table; clear: both; padding: 20px 0; }
.effect i, .odd i { display: table-cell; float: left; transition: .8s; }
.effect h3, .effect p, .odd h3 { display: table-cell; padding: 0 30px; font-size: 22px; vertical-align: middle; transition: .8s; transition-delay: .8s; }

#pagetop { margin-top: -80px; }
#pagetop p { width:1100px; margin:0 auto 5px !important; text-align:right; font-size: 14px; font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif; }
#pagetop p a { padding: 10px 20px 10px 30px !important; margin: 0 0 20px; border-radius: 4px !important; text-decoration: none; display:inline-block; background: #666 url(/static/images/common/ico_pagetop_20x20.png) 8px center no-repeat !important; color: #fff !important; transition: all 0.25s ease !important; }
#pagetop p a:hover { background-color:#111; padding: 10px 30px 10px 40px !important; color: #fff; }

.socialBtnList { padding:10px 0; border-bottom:1px dotted #ddd; margin:0 0 20px; zoom:1; clear:both; }
.socialBtnList:after { content:''; display:block; clear:both; }
.socialBtnList ul { vertical-align:top; line-height:1px; }
.socialBtnList li { padding:0 0 0 10px; float:right; vertical-align:top; line-height:1px; position:relative; right:-30px; }
.socialBtnList li * { vertical-align:top; line-height:1px; }