1 行
242 KiB
Plaintext
1 行
242 KiB
Plaintext
{"version":3,"sources":["../../../src/scss/foundation/base/_base.scss","style.css","../../../src/scss/foundation/variable/_font-family.scss","../../../src/scss/foundation/base/_normalize.scss","../../../src/scss/foundation/base/_reset.scss","../../../src/scss/layout/_main.scss","../../../src/scss/layout/_content.scss","../../../src/scss/layout/_side.scss","../../../src/scss/object/component/_wrapper.scss","../../../src/scss/foundation/variable/_global.scss","../../../src/scss/object/component/_layout.scss","../../../src/scss/foundation/mixin/_layout.scss","../../../src/scss/foundation/mixin/_responsive.scss","../../../src/scss/object/project/_icon.scss","../../../src/scss/object/project/_button.scss","../../../src/scss/object/project/_breadcrumb.scss","../../../src/scss/foundation/mixin/_clearfix.scss","../../../src/scss/foundation/mixin/_box.scss","../../../src/scss/object/project/_box.scss","../../../src/scss/object/project/_card.scss","../../../src/scss/object/project/_form.scss","../../../src/scss/foundation/variable/_color.scss","../../../src/scss/object/project/_login.scss","../../../src/scss/foundation/mixin/_on-event.scss","../../../src/scss/object/project/_user.scss","../../../src/scss/object/project/_notification.scss","../../../src/scss/object/project/_meeting.scss","../../../src/scss/object/project/_article.scss","../../../src/scss/object/project/_modal.scss","../../../src/scss/object/project/_search.scss","../../../src/scss/object/project/_profile.scss","../../../src/scss/object/project/_edit.scss","../../../src/scss/object/utility/_text.scss","../../../src/scss/object/utility/_align.scss","../../../src/scss/object/utility/_margin.scss","../../../src/scss/object/utility/_display.scss","../../../src/scss/object/utility/_percent.scss","../../../src/scss/foundation/mixin/_pc.scss","../../../src/scss/object/utility/_sr-only.scss","../../../src/scss/foundation/mixin/_sp.scss"],"names":[],"mappings":"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a9gEA,SACE,kBbihEF,Ca/gEA,SACE,kBbkhEF,Ca3gEA,WACE,cbihEF,Ca/gEA,SACE,cbkhEF,CahhEA,UACE,ebmhEF,CajhEA,UACE,ebohEF,CalhEA,UACE,ebqhEF,CanhEA,UACE,ebshEF,CaphEA,UACE,ebuhEF,CarhEA,UACE,ebwhEF,CathEA,UACE,ebyhEF,CavhEA,UACE,eb0hEF,CanhEA,SACE,WbyhEF,CavhEA,SACE,Wb0hEF,CaxhEA,SACE,Wb2hEF,CazhEA,SACE,Wb4hEF,Ca1hEA,SACE,Wb6hEF,Ca3hEA,SACE,Wb8hEF,Ca5hEA,SACE,WAAA,CACA,gBb+hEF,Ca7hEA,SACE,WbgiEF,Ca9hEA,SACE,WAAA,CACA,gBbiiEF,Ca/hEA,SACE,WbkiEF,CahiEA,SACE,WbmiEF,Ca9hEA,SACE,WbsiEF,CapiEA,SACE,WbuiEF,CariEA,SACE,WbwiEF,CatiEA,SACE,WbyiEF,CchzEA,cACE,eAAA,CACA,QAAA,CACA,cAAA,CACA,kBAAA,CACA,sBAAA,CACA,oBd00EF,Ccv0EA,oBACE,oBd00EF,Ccz0EE,+BACE,cd20EJ,Ccv0EA,oBACE,oBd00EF,Cct0EA,+CACE,WAAA,CACA,ad00EF,Ceh2EE,oBCvBA,ahBg7EF,Cez5EE,aACE,UAAA,CAEA,Ufs5EJ,CiB54EA,cD/BE,iBAAA,CACA,ahB+6EF,CgB76EE,kBACE,UAAA,CACA,chB+6EJ,CiBj5EA,eDzBE,iBAAA,CACA,KAAA,CACA,OAAA,CACA,cAAA,CACA,oBhB86EF,Ce16EE,qBACE,UAAA,CACA,aAAA,CACA,Uf46EJ,CiB15EA,6BACE,QAAA,CACA,QjB65EF,CiB15EA,yBACE,UAAA,CACA,MjB65EF,CiB15EA,4BACE,QAAA,CACA,UAAA,CACA,QAAA,CACA,MjB65EF,CiB15EA,cDrCE,UhBm8EF,CiB15EA,gBDrCE,aAAA,CACA,ShBm8EF,CgBl8EE,6BACE,YhBo8EJ,CgBl8EE,4BACE,ehBo8EJ,CkBt6EA,wDAGE,cAAA,CACA,UlBu9EF,CkB58EA,cACE,QAAA,CACA,SAAA,CACA,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A,kC/BooIF,C+BjoIA,cACE,0B/BooIF,C+BloIA,eACE,2B/BqoIF,C+BnoIA,aACE,yB/BsoIF,C+B3lIA,YACE,4B/BgpIF,C+B9oIA,eACE,+B/BipIF,C+B/oIA,eACE,+B/BkpIF,C+BhpIA,iBACE,iC/BmpIF,CgC/yIA,cAEE,uBhCs0IF,CgCl0IA,8BALE,uBAAA,CAEA,2BhC20IF,CgCl0IA,+BAHE,0BhC20IF,CgCx0IA,eACE,uBAAA,CAEA,wBhCq0IF,CiCl1IA,WACE,4BjC02IF,CiCx2IA,OACE,yBjC22IF,CiCz2IA,OACE,2BjC42IF,CiC12IA,QACE,4BjC62IF,CiC32IA,QACE,4BjC82IF,CiC52IA,QACE,4BjC+2IF,CiC72IA,QACE,4BjCg3IF,CiC92IA,QACE,4BjCi3IF,CiC/2IA,QACE,4BjCk3IF,CiCh3IA,QACE,4BjCm3IF,CiCj3IA,QACE,4BjCo3IF,CiCl3IA,QACE,4BjCq3IF,CiCn3IA,QACE,4BjCs3IF,CiCp3IA,QACE,4BjCu3IF,CiCr3IA,QACE,4BjCw3IF,CiCt3IA,QACE,4BjCy3IF,CiCv3IA,QACE,4BjC03IF,CiCx3IA,QACE,4BjC23IF,CiCz3IA,YACE,4BjC43IF,CWt7IE,MuBCA,sBlC4lJF,CW7lJE,MuBKA,uBlCgnJF,CWrnJE,MuBSA,wBlCooJF,CW7oJE,OuBaA,8BlCwpJF,CmC3pJA,YAAc,kBnC+sJd,CmC9sJA,aAAe,mBnCktJf,CmCjtJA,aAAe,mBnCqtJf,CmCptJA,aAAe,mBnCwtJf,CmCvtJA,aAAe,mBnC2tJf,CmC1tJA,aAAe,mBnC8tJf,CmC7tJA,aAAe,mBnCiuJf,CmChuJA,aAAe,mBnCouJf,CmCnuJA,aAAe,mBnCuuJf,CmCtuJA,aAAe,mBnC0uJf,CmCzuJA,aAAe,mBnC6uJf,CmC5uJA,aAAe,mBnCgvJf,CmC/uJA,aAAe,mBnCmvJf,CmClvJA,aAAe,mBnCsvJf,CmCrvJA,aAAe,mBnCyvJf,CmCxvJA,aAAe,mBnC4vJf,CmC3vJA,aAAe,mBnC+vJf,CmC9vJA,aAAe,mBnCkwJf,CmCjwJA,aAAe,mBnCqwJf,CmCpwJA,cAAgB,oBnCwwJhB,CoClyJI,qCrCJJ,KAKI,kBC2pBF,CDnlBF,8IAYI,iBAAA,CACA,kBC0pBF,CDvpBF,mBAEI,kBC2pBF,CIlvBA,qBASI,eJo4BJ,CIh4BF,aAMI,kBJs4BF,CI93BA,oBAUI,WAAA,CACA,cAAA,CACA,iCAAA,CAAA,yBAAA,CACA,YJy4BJ,CIv4BE,uBAMI,kBAAA,CACA,gBJ44BN,CI33BE,4BAGI,eJo5BN,CI94BA,uCAEI,kBJk5BJ,CKn+BF,WAKI,qBAAA,CACA,cL8/BF,CKp/BA,gBAII,gBAAA,CACA,iCAAA,CACA,yBAAA,CACA,kBAAA,CACA,iBAAA,CACA,eLqgCJ,CKlgCA,gBAOI,gBAAA,CACA,wBAAA,CAAA,qBAAA,CAAA,6BAAA,CACA,kBLugCJ,CK7/BE,mBAII,iBAAA,CACA,cL4gCN,CKlgCA,gBAII,eLihCJ,CM5kCF,QAWI,YAAA,CACA,WN6mCF,CMjmCA,aAII,UNknCJ,CMplCQ,oCACE,kBczEO,Cd0EP,UNqnCV,CMpnCU,0CACE,SNsnCZ,CMxmCU,uDAGI,0DNmnCd,CMvmCU,uDAGI,4DNinCd,CM5mCU,sDAGI,4DNinCd,CM5mCU,uDAGI,6DNinCd,CMlmCI,iCAEI,YNgnCR,CM7mCI,yBAWI,kBNknCR,CMjnCQ,+BACE,UNmnCV,CMrmCI,6BAMI,oCAAA,CAAA,4BNwnCR,CM7kCM,qEA5CE,iBAAA,CAEA,UAAA,CACA,WN2pCR,CY3sCF,aAWI,WAAA,CACA,UZk0DF,CYh0DA,mBAOI,UAAA,CACA,WZq0DJ,CYj0DF,eAWI,WAAA,CACA,UZu0DF,Caz8DA,aAEI,mBbmgEJ,CajgEE,mBAKI,QAAA,CACA,iBAAA,CACA,UAAA,CACA,WbsgEN,Cal6DF,SAGI,kBbygEF,Can6DF,SAGI,WbqiEF,CmBvyEF,eASI,cnB0iFF,CmBthFE,2BACE,UnB8iFJ,CmBtiFA,YAEI,enB6iFJ,CmB1iFA,WAEI,WnB6iFJ,CmB1iFA,WAEI,WnB6iFJ,CqB7lFE,oBAII,gBrBioFN,CuB9nFE,gBAKI,gBvBmqFN,CuB5pFA,mBAGI,iBvBoqFJ,CuBxpFI,sBAOI,UAAA,CACA,WAAA,CACA,kBAAA,CACA,iBvBsqFR,CwB1sFE,qBAOI,UAAA,CACA,WxB0uFN,CwBnuFM,iCAqBI,cAAA,CACA,WxB8uFV,CyBtwFA,cAKI,kBzB40FJ,CyBt0FA,cAKI,WzBg1FJ,CyBh0FA,cAII,wBzBo1FJ,CyBnzFA,cAKI,kBzB41FJ,CyBn1FE,sBAGI,YzB61FN,CyBh1FM,2BACE,UzB81FR,CyBvzFQ,8BACE,UzB61FV,CyBz1FI,8BAMI,UAAA,CACA,WAAA,CACA,kBzB81FR,CyBz1FA,aASI,kBzB81FJ,CyBz1FE,uBAEI,sBzBi2FN,CyBx1FI,6BAaI,WzBo2FR,CyBr1FQ,gDAaI,WAAA,CACA,kBAAA,CACA,UzBo2FZ,CyBp1FE,kBAII,WzB61FN,CyBpyFE,+BAGE,mBzBs2FJ,CyBn2FE,+BAGE,mBzBw2FJ,CyB70FM,mDAGI,kBzBo2FV,C0B/sGA,gBAEI,sB1BowGJ,C0B5vGE,iCAEI,iB1BkwGN,C0B7rGA,YAMI,c1BkwGJ,C0B/vGA,YAOI,e1BowGJ,C0BltGM,oDACE,U1BswGR,C2Bn2GE,wBAII,Q3Bs9GN,C2B58GE,oBAGI,2B3Bw9GN,C4BhiHA,kBAEI,iB5BgoHJ,C4BzmHE,eAKI,c5B2nHN,C4B/lHI,0BAQI,iB5B0nHR,C6BzrHA,cAGI,mB7BwtHJ,C6BrtHA,iBAII,e7B0tHJ,C6BzpHA,cAOI,gBAAA,CACA,mB7B2tHJ,C6BxtHA,cAKI,kB7B6tHJ,C6B3tHE,oBAMI,2B7BguHN,C6BjtHE,oBAUI,S7BguHN,C6BttHA,kCAGI,e7B+tHJ,C8Bx2HA,WAEI,sB9Bg5HJ,C8B72HE,4BAGI,e9Bq5HN,C8Bt4HE,aAKI,iB9By5HN,C8Bv4HE,wBAGI,e9By5HN,C8Bp5HE,gBAGI,e9By5HN,C8B/3HE,gBAQI,gB9B25HN,C8Bx5HE,+BAJI,gB9Bs6HN,CiCx+HF,YAGI,2BjC83IF,CiC9zIA,YACE,yBjC04IF,CiCx4IA,YACE,2BjC24IF,CiCz4IA,aACE,4BjC44IF,CiC14IA,aACE,4BjC64IF,CiC34IA,aACE,4BjC84IF,CiC54IA,aACE,4BjC+4IF,CiC74IA,aACE,4BjCg5IF,CiC94IA,aACE,4BjCi5IF,CiC/4IA,aACE,4BjCk5IF,CiCh5IA,aACE,4BjCm5IF,CiCj5IA,aACE,4BjCo5IF,CiCl5IA,aACE,4BjCq5IF,CiCn5IA,aACE,4BjCs5IF,CiCp5IA,aACE,4BjCu5IF,CiCr5IA,aACE,4BjCw5IF,CiCt5IA,aACE,4BjCy5IF,CiCv5IA,aACE,4BjC05IF,CqCxkJA,YAEE,YrCyzJF,CA1pIF,CsC7pBI,qCvCyFJ,mBAKI,kBC6pBF,CI7sBE,uBAUI,oBJ84BN,CKt8BF,WASI,oBAAA,CACA,eAAA,CACA,6BAAA,CAAA,qBLggCF,CK59BE,mBAQI,oBL8gCN,CM9jCF,QAeI,mBAAA,CAAA,mBAAA,CAAA,YAAA,CACA,wBAAA,CAAA,qBAAA,CAAA,kBAAA,CACA,uBAAA,CAAA,oBAAA,CAAA,sBAAA,CACA,QAAA,CACA,SAAA,CACA,UAAA,CACA,kBAAA,CACA,uBN+mCF,CM7mCA,aAOI,YNonCJ,CM3mCF,YAEI,UAAA,CACA,WNmnCF,CMjnCA,iBAEI,mBAAA,CAAA,mBAAA,CAAA,YAAA,CACA,wBAAA,CAAA,qBAAA,CAAA,kBAAA,CACA,wBAAA,CAAA,qBAAA,CAAA,6BAAA,CACA,WAAA,CACA,aNonCJ,CMnlCU,oDAEI,qENinCd,CMlpCE,uBAgEI,SAAA,CACA,WN+mCN,CM7mCI,+BAEI,YNgnCR,CMxmCI,yBAiBI,uBAAA,CAAA,oBAAA,CAAA,sBAAA,CACA,6BAAA,CAAA,qBAAA,CACA,WNonCR,CMlnCM,8BAEI,YNqnCV,CMvjCQ,mDAOI,UAAA,CACA,WN8mCZ,CmB11CF,eAYI,gBnB4iFF,CmBjgFA,kBAKI,YnB8iFJ,CmBziFA,MACE,YnB8iFF,CwB/mFA,gBAII,iBAAA,CACA,UAAA,CACA,QAAA,CACA,SxBuuFJ,CyBxtFA,cAQI,UzB80FJ,CyB30FA,cAQI,kBAAA,CACA,gBzBk1FJ,CyB5zFA,aAQI,oBAAA,CAGA,iBzBw1FJ,CyBr1FA,0BAPI,2BAAA,CAEA,eAAA,CACA,mBzBw2FJ,CyBp2FA,aAQI,oBzB41FJ,CyB/vFA,aAYI,UzBg2FJ,CyBxxFE,kBAUI,cAAA,CACA,UAAA,CACA,WAAA,CACA,SzBi2FN,CyB71FM,0BACE,kBzBs2FR,CyBp2FM,2BACE,WzBw2FR,CyBl2FM,uBACE,YzB22FR,CyBr2FE,eAII,UAAA,CACA,cAAA,CACA,UAAA,CACA,WAAA,CACA,SzB02FN,CyBz2FM,uBACE,kBzB22FR,CyBz2FM,wBACE,WzB22FR,CyBx2FM,oBACE,gBzB02FR,CyBhzFI,gDAGI,gBAAA,CACA,aAAA,CACA,uBzBm2FR,CyBx0FA,8BAEI,azB41FJ,C0B1sGI,uBAEI,gB1BiwGR,C0B5vGA,iCAEI,Y1B+vGJ,C0B3vGE,yCAEI,UAAA,CACA,W1B8vGN,C0BtvGA,gCAEI,kB1B+vGJ,C0BrqGI,gCAEI,iB1BswGR,C0BrvGM,wCAYI,UAAA,CACA,WAAA,CACA,iB1BywGV,C2Bp6GA,YAWI,S3Bs9GJ,C2B95GA,WAII,gB3Bq9GJ,C4B/iHE,yBAEI,uC5BynHN,C4BtnHE,wBAEI,0C5BynHN,C8BloHA,SAMI,eAAA,CACA,sB9Bg5HJ,C8B94HE,mBAGI,kB9Bm5HN,C8B94HE,qBAGI,eAAA,CACA,gB9Bm5HN,C8Bv4HE,cAGI,yB9Bu5HN,C8B9yHA,YAMI,iB9B25HJ,C8Bz5HE,qBAII,kB9B85HN,C8B35HE,cAII,e9Bg6HN,CiCxgIA,YACE,yBjC63IF,CiC33IA,YACE,2BjC83IF,CiC53IA,aACE,4BjC+3IF,CiC73IA,aACE,4BjCg4IF,CiC93IA,aACE,4BjCi4IF,CiC/3IA,aACE,4BjCk4IF,CiCh4IA,aACE,4BjCm4IF,CiCj4IA,aACE,4BjCo4IF,CiCl4IA,aACE,4BjCq4IF,CiCn4IA,aACE,4BjCs4IF,CiCp4IA,aACE,4BjCu4IF,CiCr4IA,aACE,4BjCw4IF,CiCt4IA,aACE,4BjCy4IF,CiCv4IA,aACE,4BjC04IF,CiCx4IA,aACE,4BjC24IF,CiCz4IA,aACE,4BjC44IF,CiC14IA,aACE,4BjC64IF,CqC5/IA,YAEE,YrCyzJF,CAjkIF,CsCruBI,oClCuBA,uBAaI,gBJg5BN,CK55BE,mBAWI,cLghCN,CwBtkCE,qBAWI,UAAA,CACA,WxB4uFN,CwBzuFM,iCAyBI,cAAA,CACA,WAAA,CACA,cAAA,CACA,UAAA,CACA,QxBgvFV,CwB7uFM,gCAII,UAAA,CACA,WxBkvFV,C0B1vFE,yCAMI,UAAA,CACA,W1BgwGN,C2B1xGA,YAcI,S3Bw9GJ,CAvjFF,CsCj8BI,oClCoDF,gBAKI,UJi5BJ,CKr9BF,WAcI,oBLkgCF,CKp/BA,gBAYI,kBLygCJ,CyBhgCA,cAOI,kBzBs1FJ,CyB5oFE,kBAOI,UzB+1FN,CAlpEF,CWr9BI,oCFoGF,mCACE,STy8CF,CSp8CA,mCACE,oBT29CF,CSt9CA,mCACE,ST6+CF,CSx+CA,uDACE,oBTkgDF,CShgDA,sDACE,oBTkgDF,CS7/CA,sDACE,STgiDF,CS9hDA,qDACE,STgiDF,CS3hDA,sDACE,oBT8jDF,CS5jDA,qDACE,oBT8jDF,CSzjDA,sDACE,oBT4lDF,CS1lDA,qDACE,oBT4lDF,CWhvDI,sBF4JJ,eAAA,CACA,aT6nDA,CS5nDA,sCACE,eAAA,CACA,aT8nDF,CW9xDI,SuBJJ,sBlCimJA,CW7lJI,SuBAJ,uBlCqnJA,CWrnJI,SuBIJ,wBlCyoJA,CW7oJI,UuBQJ,8BlC6pJA,CAvnGF,CW/iDI,oCFoGF,mCACE,ST88CF,CSz8CA,mCACE,oBTg+CF,CS39CA,mCACE,STk/CF,CS7+CA,uDACE,oBT0gDF,CSxgDA,sDACE,oBT0gDF,CSrgDA,sDACE,STwiDF,CStiDA,qDACE,STwiDF,CSniDA,sDACE,oBTskDF,CSpkDA,qDACE,oBTskDF,CSjkDA,sDACE,oBTomDF,CSlmDA,qDACE,oBTomDF,CWxvDI,sBF4JJ,eAAA,CACA,aTuoDA,CStoDA,sCACE,eAAA,CACA,aTwoDF,CWxyDI,SuBJJ,sBlCsmJA,CWlmJI,SuBAJ,uBlC0nJA,CW1nJI,SuBIJ,wBlC8oJA,CWlpJI,UuBQJ,8BlCkqJA,CAvnGF,CWpjDI,qCFoGF,mCACE,STm9CF,CS98CA,mCACE,oBTq+CF,CSh+CA,mCACE,STu/CF,CSl/CA,uDACE,oBTkhDF,CShhDA,sDACE,oBTkhDF,CS7gDA,sDACE,STgjDF,CS9iDA,qDACE,STgjDF,CS3iDA,sDACE,oBT8kDF,CS5kDA,qDACE,oBT8kDF,CSzkDA,sDACE,oBT4mDF,CS1mDA,qDACE,oBT4mDF,CWhwDI,sBF4JJ,eAAA,CACA,aTipDA,CShpDA,sCACE,eAAA,CACA,aTkpDF,CWlzDI,SuBJJ,sBlC2mJA,CWvmJI,SuBAJ,uBlC+nJA,CW/nJI,SuBIJ,wBlCmpJA,CWvpJI,UuBQJ,8BlCuqJA,CAvnGF,CWzjDI,qCFoGF,mCACE,STw9CF,CSn9CA,mCACE,oBT0+CF,CSr+CA,mCACE,ST4/CF,CSv/CA,uDACE,oBT0hDF,CSxhDA,sDACE,oBT0hDF,CSrhDA,sDACE,STwjDF,CStjDA,qDACE,STwjDF,CSnjDA,sDACE,oBTslDF,CSplDA,qDACE,oBTslDF,CSjlDA,sDACE,oBTonDF,CSlnDA,qDACE,oBTonDF,CWxwDI,sBF4JJ,eAAA,CACA,aT2pDA,CS1pDA,sCACE,eAAA,CACA,aT4pDF,CW5zDI,SuBJJ,sBlCgnJA,CW5mJI,SuBAJ,uBlCooJA,CWpoJI,SuBIJ,wBlCwpJA,CW5pJI,UuBQJ,8BlC4qJA,CAvnGF,CsCpjDI,2DbuPA,kBAeM,WzBo2FR,CyB/1FM,2BAGI,WzB22FV,CAdF,C+B/gGA,qCACE,eACE,2B/BuoIF,C+BroIA,eACE,yB/BwoIF,C+BtoIA,eACE,0B/ByoIF,C+BvoIA,eACE,yB/B0oIF,C+BxoIA,eACE,2B/B2oIF,C+BzoIA,eACE,0B/B4oIF,CqCvvIA,MACE,YrCyzJF,CAlkBF,C+B1oIA,0CACE,eACE,2B/B4oIF,C+B1oIA,eACE,yB/B6oIF,C+B3oIA,eACE,0B/B8oIF,C+B5oIA,eACE,yB/B+oIF,C+B7oIA,eACE,2B/BgpIF,C+B9oIA,eACE,0B/BipIF,CACF,CqCvxIA,qCACE,MACE,YrCyzJF,CACF,CqClzJA,oCACE,MACE,YrCyzJF,CACF","file":"style.css","sourcesContent":["/* #Base\n -------------------------------------------------------------------------- */\n/**\n * Baseレイヤーにはプロジェクトにおける、基本的なベーススタイルを定義します。\n * 要素セレクタや属性セレクタなど、詳細度はできるかぎり低く保っておきます。\n * 基本的にclass属性は使用しません。\n */\n/**\n * `padding`と`border`を`width`に含めます。\n * https://css-tricks.com/inheriting-box-sizing-probably-slightly-better-best-practice/\n */\nhtml {\n overflow-x: hidden;\n font-size: 62.5%;\n min-height: 100%;\n}\n\nbody {\n min-width: 320px;\n background: #fff;\n font-family: \"Open Sans\", \"Myriad\", Helvetica, Arial, sans-serif;\n @include pc{\n background: #F7FAFC;\n }\n}\n\nbody, button, code, input, optgroup, pre, select, textarea {\n color: #080808;\n font-family: -apple-system, BlinkMacSystemFont, Helvetica Neue, Segoe UI, Hiragino Kaku Gothic ProN, Hiragino Sans, ヒラギノ角ゴ ProN W3, Arial, メイリオ, Meiryo, sans-serif;\n font-size: 1.6rem;\n word-wrap: break-word;\n -moz-osx-font-smoothing: grayscale;\n -webkit-font-smoothing: antialiased;\n -moz-font-smoothing: antialiased;\n font-smoothing: antialiased;\n -webkit-font-feature-settings: \"kern\";\n font-feature-settings: \"kern\";\n -webkit-font-kerning: normal;\n font-kerning: normal;\n line-height: 1.6;\n}\n\ninput[type=number], input[type=url], input[type=tel], input[type=text], input[type=email], input[type=password], select, textarea {\n font-family: inherit;\n -webkit-appearance: none; \n}\n\nimg[src$=\".svg\"]:not([width]), img[src*=\".svg?\"]:not([width]) {\n\n}\n\nimg, legend {\n max-width: 100%\n}\n\nprogress, sub, sup {\n vertical-align: baseline\n}\n\nbody, svg:not(:root) {\n overflow: hidden\n}\n\na, legend {\n color: inherit\n}\n\na[href^=\"tel:\"] {\n cursor: text;\n pointer-events: none;\n text-decoration: none\n}\n\n[type=submit], a, button{\n cursor: pointer;\n text-decoration: none;\n}\n\nol, ul{\n list-style: none;\n}\n\nbutton{\n padding: 0;\n}\n\nbutton:focus {\n outline: 0\n}\n\ninput[type=\"checkbox\"], input[type=\"radio\"]{\n margin-right: 0.5em;\n margin-top: -2px;\n}\ninput[type=number], input[type=url], input[type=tel], input[type=text], input[type=email], input[type=password], input[type=search], select, textarea {\n border: 1px solid #D0D0D0;\n background-color: #fff;\n outline: 0!important;\n width: 100%;\n border-radius: 10px;\n padding: 12px 18px;\n font-weight: 400;\n color: #414141;\n box-sizing: border-box;\n -webkit-appearance: none;\n @include pc{\n padding: 15px 20px;\n border-radius: 14px;\n }\n}\ninput[type=search]{\n @include pc{\n padding-right: 52px;\n }\n @include sp{\n padding-right: 40px;\n }\n}\n\nhtml:not(.sp) input[type=number]:focus, html:not(.sp) input[type=url]:focus, html:not(.sp) input[type=tel]:focus, html:not(.sp) input[type=text]:focus, \nhtml:not(.sp) input[type=email]:focus, html:not(.sp) input[type=password]:focus, html:not(.sp) select:focus, html:not(.sp) textarea:focus{\n border-color: #00c4ac;\n background-color: #fff;\n -webkit-transition: all 0.2s ease-out;\n transition: all 0.2s ease-out;\n}\n\nhtml.sp input[type=number], html.sp input[type=url], html.sp input[type=tel], html.sp input[type=text], html.sp input[type=email], html.sp input[type=password], html.sp select, html.sp textarea {\n font-size: 16px!important;\n font-size: 1.6rem!important\n}\n\ninput[type=file]{\n display: none;\n}\n\nselect {\n -moz-appearance: none;\n background-color: #fff\n}\n\ninput[type=number]::-webkit-input-placeholder, input[type=url]::-webkit-input-placeholder, input[type=tel]::-webkit-input-placeholder, input[type=text]::-webkit-input-placeholder, input[type=email]::-webkit-input-placeholder, input[type=password]::-webkit-input-placeholder, textarea::-webkit-input-placeholder {\n color: #999;\n font-size: 1.6rem;\n}\n\ninput[type=number]:-ms-input-placeholder, input[type=url]:-ms-input-placeholder, input[type=tel]:-ms-input-placeholder, input[type=text]:-ms-input-placeholder, input[type=email]:-ms-input-placeholder, input[type=password]:-ms-input-placeholder, textarea:-ms-input-placeholder {\n color: #999;\n font-size: 1.6rem;\n}\n\ninput[type=number]::-moz-placeholder, input[type=url]::-moz-placeholder, input[type=tel]::-moz-placeholder, input[type=text]::-moz-placeholder, input[type=email]::-moz-placeholder, input[type=password]::-moz-placeholder, textarea::-moz-placeholder {\n color: #999;\n font-size: 1.6rem;\n}\n\nh1,h2,h3,h4,h5{\n font-weight: bold;\n}","@charset \"UTF-8\";\n/**\n * VARIABLE\n * global...サイト全体に使用するサイズや数値に関する変数です。\n * breakpoint...メディアクエリで使用するブレイクポイントです。\n * font-family...font-family指定をまとめています。\n * color...グローバルに使用する色指定です。\n * z-index...z-indexの並び順を管理します。\n * easing...cubic-bezier関数を使用したタイミング関数を定義しています。\n *\n * FUNCTION\n * strip-unit...pxやremなどの単位を取り除きます。\n * em...pxをemに変換します。\n * rem...pxをremに変換します。\n * tint...白色を加えて明度を明るくします。\n * shade...黒色を加えて明度を暗くします。\n * z-index...z-indexの並び順を管理します。\n * tracking...Photoshopのカーニングをemに変換します。\n *\n * MIXIN\n * mq-up...メディアクエリを`min-width`で挿入します。\n * mq-down...メディアクエリを`max-width`で挿入します。\n * responsive...レスポンシブ対応クラスを生成します。\n * clearfix...floatの解除をします。\n * on-event...:hover, :active, :focusをまとめて指定します。\n * sr-only...非表示にしてスクリーンリーダーにだけ読み上げさせます。\n * layout...layoutオブジェクトのベーススタイルです。\n * media...mediaオブジェクトのベーススタイルです。\n * flag...flagオブジェクトのベーススタイルです。\n * list-unstyled...list-unstyledオブジェクトのベーススタイルです。\n * list-mark...list-markオブジェクトのベーススタイルです。\n * ratio...ratioオブジェクトのベーススタイルです。\n * box...boxオブジェクトのベーススタイルです。\n *\n * BASE\n * normalize...Normalize.cssをインポートしています。\n * base...タイプセレクタと属性セレクタのデフォルトスタイルです。\n *\n * LAYOUT\n * header...`<body>`タグ直下にある`<header>`タグのスタイルです。\n * footer...`<body>`タグ直下にある`<footer>`タグのスタイルです。\n * main...`<main>`タグのスタイルです。\n * content...`<article>`タグが使われるようなメインコンテンツのスタイルです。\n * side...`<aside>`タグが使われるようなサイドバーのスタイルです。\n * section...`<section>`要素を使うようなセクションの余白を管理します。\n *\n * COMPONENT\n * wrapper...最大幅を指定します。\n * layout...汎用的なレイアウトオブジェクトです。グリッドレイアウトなどに使用できます。\n * media...画像とテキストが横並びになるオブジェクトです。テキストを画像に回り込みさせます。\n * flag...画像とテキストが横並びになるオブジェクトです。縦方向の指定ができます。\n * list-unstyled...`<ul>`と`<ol>`でデフォルトスタイルをリセットします。\n * list-ordered...番号付きリストを入れ子レベルに応じて、1, 1.1のように区切り文字を付け加えます。\n * list-mark...リストアイテムの左にアイコンを配置します。\n * embed...Youtubeなどをアスペクト比を固定してレスポンシブ対応させる場合に使用します。\n * ratio...アスペクト比を固定したまま伸縮させます。\n * table...tableのレイアウトアルゴリズムの変更、余白の変更をします。\n *\n * PROJECT\n * icon...アイコンフォントです。テンプレートから自動で生成されます。\n * icon-extend...アイコンフォントを拡張するModifierです。\n * button...ボタンコンポーネントです。\n * breadcrumb...パンくずリストコンポーネントです。\n * label...インラインのラベルコンポーネントです。\n * box...画像やテキストなどを縦に並べるコンポーネントです。\n * card...カードタイプのコンポーネントです。\n * notification...お知らせエリアのコンポーネントです。\n * meeting...ミーティングエリアのコンポーネントです。\n * article...詳細ページのコンポーネントです。\n * modal...モーダルのコンポーネントです。 \n * search...検索ページのコンポーネントです。 \n * profile...プロフィールページのコンポーネントです。\n * edit...エディットページのコンポーネントです。\n * \n * SCOPE\n * blog...ブログページのスタイルです。\n *\n * UTILITY\n * text...テキストのスタイルに関する汎用クラスです。\n * align...画像などを中央や右側に配置します。\n * margin...マージンで余白の管理をします。常に下方向にだけ余白をとります。\n * display...要素の表示や改行をコントロールする場合に使用します。\n * width...おもにグリッドで使用する`width`を指定する汎用クラスです。\n * offset...おもにグリッドで使用する`margin-right`を指定する汎用クラスです。\n * percent...`width`プロパティを5%刻みで指定する汎用クラスです。\n * sr-only...要素を非表示にさせますが、スクリーンリーダーには読み上げられます。\n */\n/**\n * このスタイルシートは[FLOCSS](https://github.com/hiloki/flocss)をベースにしています。\n * 定義されているレイヤー以外にもThemeやTestなどのレイヤーを追加することもできます。\n * 詳しくは[CSSコーディングルール](https://github.com/manabuyasuda/styleguide/blob/master/css-coding-rule.md#flocss)を参照してください。\n */\n/* =============================================================================\n #Foundation\n ========================================================================== */\n.font-genju-p-r {\n font-family: GenJyuuGothic-P, sans-serif;\n font-weight: 400;\n -webkit-font-feature-settings: \"palt\";\n font-feature-settings: \"palt\";\n}\n\n.font-genju-p-b {\n font-family: GenJyuuGothic-P, sans-serif;\n font-weight: 700;\n -webkit-font-feature-settings: \"palt\";\n font-feature-settings: \"palt\";\n}\n\n@font-face {\n font-family: GenJyuuGothic-P;\n font-weight: 400;\n src: url(../../assets/fonts/GenJyuuGothic-P/GenJyuuGothic-P-Regular.woff2) format(\"woff2\"), url(../../assets/fonts/GenJyuuGothic-P/GenJyuuGothic-P-Regular.woff) format(\"woff\"), url(../../assets/fonts/GenJyuuGothic-P/GenJyuuGothic-P-Regular.ttf) format(\"TrueType\");\n}\n@font-face {\n font-family: GenJyuuGothic-P;\n font-weight: 700;\n src: url(../../assets/fonts/GenJyuuGothic-P/GenJyuuGothic-P-Bold.woff2) format(\"woff2\"), url(../../assets/fonts/GenJyuuGothic-P/GenJyuuGothic-P-Bold.woff) format(\"woff\"), url(../../assets/fonts/GenJyuuGothic-P/GenJyuuGothic-P-Bold.ttf) format(\"TrueType\");\n}\n@font-face {\n font-family: AdobeBlank;\n src: url(data:application/font-woff;base64,d09GRk9UVE8AAATUAAkAAAAACkAAAQAAAAAAAAAAAAAAAAAAAAAAAAAAAABDRkYgAAAA4AAAAOcAAAEhIl9jq09TLzIAAAHIAAAARQAAAGBRQK3+Y21hcAAAAhAAAAAmAAAALAAMAFNoZWFkAAACOAAAADAAAAA2BZfPvmhoZWEAAAJoAAAAGgAAACQHWf+LaG10eAAAAoQAAAAIAAAACAPoAYhtYXhwAAACjAAAAAYAAAAGAAJQAG5hbWUAAAKUAAACKwAAB2b3USAEcG9zdAAABMAAAAATAAAAIP+4ADJ42mNkYGFmYGRkFHRMyU9KdcpJzMvWLS5ITE4FCZr8kP4h080j183D+EOW8Ycc0w955h8SLN2/eX7V/GJh7eVRkmF4xS/DyCcow/CeR1WG4TuPCgMbEwMjAxsDH0M4QzpDOUM72GDPlNS8ksySSuf8gsqizPSMEgUFIwNDYx0QaaoAVqIQXFlckppbrOCZl5xfVJBflFiSmqKgkVFSUmClr19eXq6XCFKml5yfq6+ph+5cQnwGBpCzGJhBBJjNyMj1Q4FHbYoMI6tQD4/grxqRHx2iDEwsQFlGsAoGBla+Px18AK/lT1cAeNpjYGZ+wTiBgZWBgamLKYKBgcEbQjPGMRgx3GFABYzIHEcXJ38GBwYFBgXmgv8dDAzMBQwVCfqM/5GUKDAwAAArbQs0AAAAeNpjYGBgZGAGYgYGHgYWBgUgzQKEIL7C//8Q8v9DMJ8BAEreBlwAAHjaY2BkYGAA4vc75S7F89t8ZWBmfgEUYbjo4/oZQf/vYH7BXADkMjMwgUQBcKYMvHjaY2BkYGAu+N/BAAXMLxgYGVABEwBNCALqAAAD6AGIAAAAAAAAUAAAAgAAeNrtkz9r20AYxp+zpZhSCEnpBzgolKQk5/8m2FOSJckUYgi0U2VZtlzbkpAVG2+dSukYQj5Bh36A0KFzpw6dOvXLpI/k1ynNYkq3UB8n/+798zx3JwTgufoOhcXvmHPBChtcLTiHAl4K5xl/LWyRI2EbTbwVXmP8i3CB/I2s8DjT/ylMffVMmPqqKkx91RSmvjoRpr56JUx9dSVMffVR+An5JuXbWzwlf6Wash7R91L9EFbQuZ5wDuu5d8J5xq+ELfKNsI0kt+xdg84fCRfIvvAG+b3wJtbznzLeTH3zn4Xpax0J09fyhelrTYXpa10L09da9tLXfiFMX/tEmL72G2H62h8Ow2geD/p+onWlVK7upM+63u+GHU+355PEG0/0ceCGcRTGTuJ19ZafJFGzWJzNZsZJy4wbjovbJms5GDnBcHcSOa535vUvRk58P3x/fe7Fk0EY6LIp1eqt07aAHyZuGEzTldmrtMbO0AuTnhkNOhVTN41qrdRYpfxwT7ZqjUOE/MrmiDFAHz4SaI4KSiijip07rpP20WV1Bx65zZ4Jqz2M+a/57QVwmY2plj6dLNdlZitTTRhvosgxy4ZhxVLNZJ1j5rbJv10OMGJVgCF26RGRXUbPOPu4yHLxyupV+XPOmOsBqwLutswdlFDjeVs45Sn/jPisSrLdBpje5Qz2eEstnsChupfV9BgdUbXDjGGvQYP3WWN145/3/Hc39P8NP/A3/AvEJ2JBAHjaY2BmAIP/WxmMGLAAACzCAeoA) format(\"woff\");\n}\n@font-face {\n font-family: YakuHanJP;\n font-weight: 100;\n src: url(../../assets/fonts/YakuHanJP/YakuHanJP-Thin.woff2) format(\"woff2\"), url(../../assets/fonts/YakuHanJP/YakuHanJP-Thin.woff) format(\"woff\"), url(../../assets/fonts/YakuHanJP/YakuHanJP-Thin.eot);\n}\n@font-face {\n font-family: YakuHanJP;\n font-weight: 200;\n src: url(../../assets/fonts/YakuHanJP/YakuHanJP-Light.woff2) format(\"woff2\"), url(../../assets/fonts/YakuHanJP/YakuHanJP-Light.woff) format(\"woff\"), url(../../assets/fonts/YakuHanJP/YakuHanJP-Light.eot);\n}\n@font-face {\n font-family: YakuHanJP;\n font-weight: 300;\n src: url(../../assets/fonts/YakuHanJP/YakuHanJP-DemiLight.woff2) format(\"woff2\"), url(../../assets/fonts/YakuHanJP/YakuHanJP-DemiLight.woff) format(\"woff\"), url(../../assets/fonts/YakuHanJP/YakuHanJP-DemiLight.eot);\n}\n@font-face {\n font-family: YakuHanJP;\n font-weight: 400;\n src: url(../../assets/fonts/YakuHanJP/YakuHanJP-Regular.woff2) format(\"woff2\"), url(../../assets/fonts/YakuHanJP/YakuHanJP-Regular.woff) format(\"woff\"), url(../../assets/fonts/YakuHanJP/YakuHanJP-Regular.eot);\n}\n@font-face {\n font-family: YakuHanJP;\n font-weight: 500;\n src: url(../../assets/fonts/YakuHanJP/YakuHanJP-Medium.woff2) format(\"woff2\"), url(../../assets/fonts/YakuHanJP/YakuHanJP-Medium.woff) format(\"woff\"), url(../../assets/fonts/YakuHanJP/YakuHanJP-Medium.eot);\n}\n@font-face {\n font-family: YakuHanJP;\n font-weight: 700;\n src: url(../../assets/fonts/YakuHanJP/YakuHanJP-Bold.woff2) format(\"woff2\"), url(../../assets/fonts/YakuHanJP/YakuHanJP-Bold.woff) format(\"woff\"), url(../../assets/fonts/YakuHanJP/YakuHanJP-Bold.eot);\n}\n@font-face {\n font-family: YakuHanJP;\n font-weight: 900;\n src: url(../../assets/fonts/YakuHanJP/YakuHanJP-Black.woff2) format(\"woff2\"), url(../../assets/fonts/YakuHanJP/YakuHanJP-Black.woff) format(\"woff\"), url(../../assets/fonts/YakuHanJP/YakuHanJP-Black.eot);\n}\n/**\n * Foundationレイヤーでは`html`や`body`のような広範囲にわたるベーススタイル、\n * `h2`や`ul`のような基本的なタイプセレクタのデフォルトスタイルを定義します。\n * 装飾的なスタイルは避けて、できる限り低詳細度に保ちます。idセレクタやclassセレクタは使用しません。\n */\n/* #Normalize.css\n -------------------------------------------------------------------------- */\n/*! normalize.css v3.0.3 | MIT License | github.com/necolas/normalize.css */\n/**\n * 1. Set default font family to sans-serif.\n * 2. Prevent iOS and IE text size adjust after device orientation change,\n * without disabling user zoom.\n */\nhtml {\n font-family: sans-serif;\n /* 1 */\n -ms-text-size-adjust: 100%;\n /* 2 */\n -webkit-text-size-adjust: 100%;\n /* 2 */\n}\n\n/**\n * Remove default margin.\n */\nbody {\n margin: 0;\n}\n\n/* HTML5 display definitions\n ========================================================================== */\n/**\n * Correct `block` display not defined for any HTML5 element in IE 8/9.\n * Correct `block` display not defined for `details` or `summary` in IE 10/11\n * and Firefox.\n * Correct `block` display not defined for `main` in IE 11.\n */\narticle,\naside,\ndetails,\nfigcaption,\nfigure,\nfooter,\nheader,\nhgroup,\nmain,\nmenu,\nnav,\nsection,\nsummary {\n display: block;\n}\n\n/**\n * 1. Correct `inline-block` display not defined in IE 8/9.\n * 2. Normalize vertical alignment of `progress` in Chrome, Firefox, and Opera.\n */\naudio,\ncanvas,\nprogress,\nvideo {\n display: inline-block;\n /* 1 */\n vertical-align: baseline;\n /* 2 */\n}\n\n/**\n * Prevent modern browsers from displaying `audio` without controls.\n * Remove excess height in iOS 5 devices.\n */\naudio:not([controls]) {\n display: none;\n height: 0;\n}\n\n/**\n * Address `[hidden]` styling not present in IE 8/9/10.\n * Hide the `template` element in IE 8/9/10/11, Safari, and Firefox < 22.\n */\n[hidden],\ntemplate {\n display: none;\n}\n\n/* Links\n ========================================================================== */\n/**\n * Remove the gray background color from active links in IE 10.\n */\na {\n background-color: transparent;\n}\n\n/**\n * Improve readability of focused elements when they are also in an\n * active/hover state.\n */\na:active,\na:hover {\n outline: 0;\n}\n\n/* Text-level semantics\n ========================================================================== */\n/**\n * Address styling not present in IE 8/9/10/11, Safari, and Chrome.\n */\nabbr[title] {\n border-bottom: 1px dotted;\n}\n\n/**\n * Address style set to `bolder` in Firefox 4+, Safari, and Chrome.\n */\nb,\nstrong {\n font-weight: bold;\n}\n\n/**\n * Address styling not present in Safari and Chrome.\n */\ndfn {\n font-style: italic;\n}\n\n/**\n * Address variable `h1` font-size and margin within `section` and `article`\n * contexts in Firefox 4+, Safari, and Chrome.\n */\nh1 {\n font-size: 2em;\n margin: 0.67em 0;\n}\n\n/**\n * Address styling not present in IE 8/9.\n */\nmark {\n background: #ff0;\n color: #000;\n}\n\n/**\n * Address inconsistent and variable font size in all browsers.\n */\nsmall {\n font-size: 80%;\n}\n\n/**\n * Prevent `sub` and `sup` affecting `line-height` in all browsers.\n */\nsub,\nsup {\n font-size: 75%;\n line-height: 0;\n position: relative;\n vertical-align: baseline;\n}\n\nsup {\n top: -0.5em;\n}\n\nsub {\n bottom: -0.25em;\n}\n\n/* Embedded content\n ========================================================================== */\n/**\n * Remove border when inside `a` element in IE 8/9/10.\n */\nimg {\n border: 0;\n}\n\n/**\n * Correct overflow not hidden in IE 9/10/11.\n */\nsvg:not(:root) {\n overflow: hidden;\n}\n\n/* Grouping content\n ========================================================================== */\n/**\n * Address margin not present in IE 8/9 and Safari.\n */\nfigure {\n margin: 1em 40px;\n}\n\n/**\n * Address differences between Firefox and other browsers.\n */\nhr {\n box-sizing: content-box;\n height: 0;\n}\n\n/**\n * Contain overflow in all browsers.\n */\npre {\n overflow: auto;\n}\n\n/**\n * Address odd `em`-unit font size rendering in all browsers.\n */\ncode,\nkbd,\npre,\nsamp {\n font-family: monospace, monospace;\n font-size: 1em;\n}\n\n/* Forms\n ========================================================================== */\n/**\n * Known limitation: by default, Chrome and Safari on OS X allow very limited\n * styling of `select`, unless a `border` property is set.\n */\n/**\n * 1. Correct color not being inherited.\n * Known issue: affects color of disabled elements.\n * 2. Correct font properties not being inherited.\n * 3. Address margins set differently in Firefox 4+, Safari, and Chrome.\n */\nbutton,\ninput,\noptgroup,\nselect,\ntextarea {\n color: inherit;\n /* 1 */\n font: inherit;\n /* 2 */\n margin: 0;\n /* 3 */\n}\n\n/**\n * Address `overflow` set to `hidden` in IE 8/9/10/11.\n */\nbutton {\n overflow: visible;\n}\n\n/**\n * Address inconsistent `text-transform` inheritance for `button` and `select`.\n * All other form control elements do not inherit `text-transform` values.\n * Correct `button` style inheritance in Firefox, IE 8/9/10/11, and Opera.\n * Correct `select` style inheritance in Firefox.\n */\nbutton,\nselect {\n text-transform: none;\n}\n\n/**\n * 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio`\n * and `video` controls.\n * 2. Correct inability to style clickable `input` types in iOS.\n * 3. Improve usability and consistency of cursor style between image-type\n * `input` and others.\n */\nbutton,\nhtml input[type=button],\ninput[type=reset],\ninput[type=submit] {\n -webkit-appearance: button;\n /* 2 */\n cursor: pointer;\n /* 3 */\n}\n\n/**\n * Re-set default cursor for disabled elements.\n */\nbutton[disabled],\nhtml input[disabled] {\n cursor: default;\n}\n\n/**\n * Remove inner padding and border in Firefox 4+.\n */\nbutton::-moz-focus-inner,\ninput::-moz-focus-inner {\n border: 0;\n padding: 0;\n}\n\n/**\n * Address Firefox 4+ setting `line-height` on `input` using `!important` in\n * the UA stylesheet.\n */\ninput {\n line-height: normal;\n}\n\n/**\n * It's recommended that you don't attempt to style these elements.\n * Firefox's implementation doesn't respect box-sizing, padding, or width.\n *\n * 1. Address box sizing set to `content-box` in IE 8/9/10.\n * 2. Remove excess padding in IE 8/9/10.\n */\ninput[type=checkbox],\ninput[type=radio] {\n box-sizing: border-box;\n /* 1 */\n padding: 0;\n /* 2 */\n}\n\n/**\n * Fix the cursor style for Chrome's increment/decrement buttons. For certain\n * `font-size` values of the `input`, it causes the cursor style of the\n * decrement button to change from `default` to `text`.\n */\ninput[type=number]::-webkit-inner-spin-button,\ninput[type=number]::-webkit-outer-spin-button {\n height: auto;\n}\n\n/**\n * 1. Address `appearance` set to `searchfield` in Safari and Chrome.\n * 2. Address `box-sizing` set to `border-box` in Safari and Chrome.\n */\ninput[type=search] {\n -webkit-appearance: textfield;\n /* 1 */\n box-sizing: content-box;\n /* 2 */\n}\n\n/**\n * Remove inner padding and search cancel button in Safari and Chrome on OS X.\n * Safari (but not Chrome) clips the cancel button when the search input has\n * padding (and `textfield` appearance).\n */\ninput[type=search]::-webkit-search-cancel-button,\ninput[type=search]::-webkit-search-decoration {\n -webkit-appearance: none;\n}\n\n/**\n * Define consistent border, margin, and padding.\n */\nfieldset {\n border: 1px solid #c0c0c0;\n margin: 0 2px;\n padding: 0.35em 0.625em 0.75em;\n}\n\n/**\n * 1. Correct `color` not being inherited in IE 8/9/10/11.\n * 2. Remove padding so people aren't caught out if they zero out fieldsets.\n */\nlegend {\n border: 0;\n /* 1 */\n padding: 0;\n /* 2 */\n}\n\n/**\n * Remove default vertical scrollbar in IE 8/9/10/11.\n */\ntextarea {\n overflow: auto;\n}\n\n/**\n * Don't inherit the `font-weight` (applied by a rule above).\n * NOTE: the default cannot safely be changed in Chrome and Safari on OS X.\n */\noptgroup {\n font-weight: bold;\n}\n\n/* Tables\n ========================================================================== */\n/**\n * Remove most spacing between table cells.\n */\ntable {\n border-collapse: collapse;\n border-spacing: 0;\n}\n\ntd,\nth {\n padding: 0;\n}\n\n/* #Reset.css\n -------------------------------------------------------------------------- */\n/*\nhtml5doctor.com Reset Stylesheet\nv1.6.1\nLast Updated: 2010-09-17\nAuthor: Richard Clark - http://richclarkdesign.com\nTwitter: @rich_clark\n*/\nhtml, body, div, span, object, iframe,\nh1, h2, h3, h4, h5, h6, p, blockquote, pre,\nabbr, address, cite, code,\ndel, dfn, em, img, ins, kbd, q, samp,\nsmall, strong, sub, sup, var,\nb, i,\ndl, dt, dd, ol, ul, li,\nfieldset, form, label, legend,\ntable, caption, tbody, tfoot, thead, tr, th, td,\narticle, aside, canvas, details, figcaption, figure,\nfooter, header, hgroup, menu, nav, section, summary,\ntime, mark, audio, video {\n margin: 0;\n padding: 0;\n border: 0;\n outline: 0;\n font-size: 100%;\n vertical-align: baseline;\n background: transparent;\n}\n\nbody {\n line-height: 1;\n}\n\narticle, aside, details, figcaption, figure,\nfooter, header, hgroup, menu, nav, section {\n display: block;\n}\n\nnav ul {\n list-style: none;\n}\n\nblockquote, q {\n quotes: none;\n}\n\nblockquote:before, blockquote:after,\nq:before, q:after {\n content: \"\";\n content: none;\n}\n\na {\n margin: 0;\n padding: 0;\n font-size: 100%;\n vertical-align: baseline;\n background: transparent;\n}\n\n/* change colours to suit your needs */\nins {\n background-color: #ff9;\n color: #000;\n text-decoration: none;\n}\n\n/* change colours to suit your needs */\nmark {\n background-color: #ff9;\n color: #000;\n font-style: italic;\n font-weight: bold;\n}\n\ndel {\n text-decoration: line-through;\n}\n\nabbr[title], dfn[title] {\n border-bottom: 1px dotted;\n cursor: help;\n}\n\ntable {\n border-collapse: collapse;\n border-spacing: 0;\n}\n\n/* change border colour to suit your needs */\nhr {\n display: block;\n height: 1px;\n border: 0;\n border-top: 1px solid #cccccc;\n margin: 1em 0;\n padding: 0;\n}\n\ninput, select {\n vertical-align: middle;\n}\n\n/* #Base\n -------------------------------------------------------------------------- */\n/**\n * Baseレイヤーにはプロジェクトにおける、基本的なベーススタイルを定義します。\n * 要素セレクタや属性セレクタなど、詳細度はできるかぎり低く保っておきます。\n * 基本的にclass属性は使用しません。\n */\n/**\n * `padding`と`border`を`width`に含めます。\n * https://css-tricks.com/inheriting-box-sizing-probably-slightly-better-best-practice/\n */\nhtml {\n overflow-x: hidden;\n font-size: 62.5%;\n min-height: 100%;\n}\n\nbody {\n min-width: 320px;\n background: #fff;\n font-family: \"Open Sans\", \"Myriad\", Helvetica, Arial, sans-serif;\n}\n@media screen and (min-width: 1068px) {\n body {\n background: #F7FAFC;\n }\n}\n\nbody, button, code, input, optgroup, pre, select, textarea {\n color: #080808;\n font-family: -apple-system, BlinkMacSystemFont, Helvetica Neue, Segoe UI, Hiragino Kaku Gothic ProN, Hiragino Sans, ヒラギノ角ゴ ProN W3, Arial, メイリオ, Meiryo, sans-serif;\n font-size: 1.6rem;\n word-wrap: break-word;\n -moz-osx-font-smoothing: grayscale;\n -webkit-font-smoothing: antialiased;\n -moz-font-smoothing: antialiased;\n font-smoothing: antialiased;\n -webkit-font-feature-settings: \"kern\";\n font-feature-settings: \"kern\";\n -webkit-font-kerning: normal;\n font-kerning: normal;\n line-height: 1.6;\n}\n\ninput[type=number], input[type=url], input[type=tel], input[type=text], input[type=email], input[type=password], select, textarea {\n font-family: inherit;\n -webkit-appearance: none;\n}\n\nimg, legend {\n max-width: 100%;\n}\n\nprogress, sub, sup {\n vertical-align: baseline;\n}\n\nbody, svg:not(:root) {\n overflow: hidden;\n}\n\na, legend {\n color: inherit;\n}\n\na[href^=\"tel:\"] {\n cursor: text;\n pointer-events: none;\n text-decoration: none;\n}\n\n[type=submit], a, button {\n cursor: pointer;\n text-decoration: none;\n}\n\nol, ul {\n list-style: none;\n}\n\nbutton {\n padding: 0;\n}\n\nbutton:focus {\n outline: 0;\n}\n\ninput[type=checkbox], input[type=radio] {\n margin-right: 0.5em;\n margin-top: -2px;\n}\n\ninput[type=number], input[type=url], input[type=tel], input[type=text], input[type=email], input[type=password], input[type=search], select, textarea {\n border: 1px solid #D0D0D0;\n background-color: #fff;\n outline: 0 !important;\n width: 100%;\n border-radius: 10px;\n padding: 12px 18px;\n font-weight: 400;\n color: #414141;\n box-sizing: border-box;\n -webkit-appearance: none;\n}\n@media screen and (min-width: 1068px) {\n input[type=number], input[type=url], input[type=tel], input[type=text], input[type=email], input[type=password], input[type=search], select, textarea {\n padding: 15px 20px;\n border-radius: 14px;\n }\n}\n\n@media screen and (min-width: 1068px) {\n input[type=search] {\n padding-right: 52px;\n }\n}\n@media screen and (max-width: 1067px) {\n input[type=search] {\n padding-right: 40px;\n }\n}\n\nhtml:not(.sp) input[type=number]:focus, html:not(.sp) input[type=url]:focus, html:not(.sp) input[type=tel]:focus, html:not(.sp) input[type=text]:focus,\nhtml:not(.sp) input[type=email]:focus, html:not(.sp) input[type=password]:focus, html:not(.sp) select:focus, html:not(.sp) textarea:focus {\n border-color: #00c4ac;\n background-color: #fff;\n -webkit-transition: all 0.2s ease-out;\n transition: all 0.2s ease-out;\n}\n\nhtml.sp input[type=number], html.sp input[type=url], html.sp input[type=tel], html.sp input[type=text], html.sp input[type=email], html.sp input[type=password], html.sp select, html.sp textarea {\n font-size: 16px !important;\n font-size: 1.6rem !important;\n}\n\ninput[type=file] {\n display: none;\n}\n\nselect {\n -moz-appearance: none;\n background-color: #fff;\n}\n\ninput[type=number]::-webkit-input-placeholder, input[type=url]::-webkit-input-placeholder, input[type=tel]::-webkit-input-placeholder, input[type=text]::-webkit-input-placeholder, input[type=email]::-webkit-input-placeholder, input[type=password]::-webkit-input-placeholder, textarea::-webkit-input-placeholder {\n color: #999;\n font-size: 1.6rem;\n}\n\ninput[type=number]:-ms-input-placeholder, input[type=url]:-ms-input-placeholder, input[type=tel]:-ms-input-placeholder, input[type=text]:-ms-input-placeholder, input[type=email]:-ms-input-placeholder, input[type=password]:-ms-input-placeholder, textarea:-ms-input-placeholder {\n color: #999;\n font-size: 1.6rem;\n}\n\ninput[type=number]::-moz-placeholder, input[type=url]::-moz-placeholder, input[type=tel]::-moz-placeholder, input[type=text]::-moz-placeholder, input[type=email]::-moz-placeholder, input[type=password]::-moz-placeholder, textarea::-moz-placeholder {\n color: #999;\n font-size: 1.6rem;\n}\n\nh1, h2, h3, h4, h5 {\n font-weight: bold;\n}\n\n/* =============================================================================\n #Layout\n ========================================================================== */\n/**\n * Layoutレイヤーはヘッダーやフッターのような、ページを構成するコンテナブロックのスタイルを定義します。\n * 目安としてはワイヤーフレームに書かれるような大きな単位のブロックです。\n * 汎用性のあるグリッドシステムは次のObject/Componentレイヤーで定義します。\n * グローバルナビゲーションやコピーライトのようなコンポーネントは、Object/Projectレイヤーで定義します。\n * 基本的にはclass属性を使用しますが、id属性を使用することもできます。\n * プレフィックス（接頭辞）として`l-`をつけます。\n */\n/* #Header\n -------------------------------------------------------------------------- */\n/*doc\n---\ntitle: header\nname: header\ncategories: [layout]\n---\n\n`<body>`タグ直下にある`<header>`タグのスタイルです。\nロゴやグローバルナビゲーションのレイアウトを含むことはできますが、\nコンポーネント自体はobject/projectレイヤーで定義します。\n\n```block\n<body>\n <header class=\"l-header\">\n <div class=\"l-header__logo\">\n <h1 class=\"p-logo\">logo</h1>\n </div>\n <nav class=\"l-header__global-nav\">\n <ul class=\"p-global-nav\">\n <li></li>\n <li></li>\n <ul>\n </nav>\n </header>\n</body>\n```\n*/\n/* #Footer\n -------------------------------------------------------------------------- */\n/*doc\n---\ntitle: footer\nname: footer\ncategories: [layout]\n---\n\n`<body>`タグ直下にある`<footer>`タグのスタイルです。\nコピーライトやナビゲーションのレイアウトを含むことはできますが、\nコンポーネント自体はobject/projectレイヤーで定義します。\n\n```block\n<body>\n <footer class=\"l-footer\">\n <div class=\"l-footer__copyright\">\n <small class=\"p-copyright\"></small>\n </div>\n <nav class=\"l-footer__sub-nav\">\n <ul class=\"p-foot-nav\">\n <li></li>\n <li></li>\n <ul>\n </nav>\n </footer>\n</body>\n```\n*/\n/* #Main\n -------------------------------------------------------------------------- */\n/*doc\n---\ntitle: main\nname: main\ncategories: [layout]\n---\n\n`<main>`タグのスタイルです。ドキュメントのメインコンテンツを示し、ドキュメント内で1つしか記述できません。\n<article>タグや<nav>タグなどの中に入れることはできません。\n\n取り扱いの難しいタグなので、使わないという選択をするのもいいでしょう。\n\n```block\n<body>\n <main id=\"l-main\">\n </main>\n</body>\n```\n*/\n.l-centeringbox {\n width: 100%;\n height: 100%;\n}\n.l-centeringbox-wrap {\n position: absolute;\n top: 0;\n left: 50%;\n transform: translate(-50%, 0);\n width: 100%;\n border-radius: 20px;\n box-sizing: border-box;\n}\n@media screen and (min-width: 1068px) {\n .l-centeringbox-wrap {\n padding: 192px 0;\n }\n}\n\n.l-container {\n display: flex;\n flex-flow: row-reverse;\n background: #fff;\n justify-content: flex-end;\n}\n@media screen and (min-width: 1068px) {\n .l-container {\n background: #F7FAFC;\n }\n}\n\n.l-single-main {\n min-height: 100vh;\n /* Fallback */\n min-height: calc(var(--vh, 1vh) * 100);\n}\n.l-single-container {\n max-width: 540px;\n width: 100%;\n margin: 0 auto;\n border-radius: 8px;\n padding: 50px 24px 70px;\n background: #fff;\n box-sizing: border-box;\n display: block;\n}\n@media screen and (min-width: 1068px) {\n .l-single-container {\n width: 540px;\n max-width: none;\n box-shadow: 0 1px 4px #dddddd;\n padding: 60px 60px 60px;\n }\n}\n.l-single-container h1 {\n font-size: 3rem;\n text-align: center;\n margin-bottom: 35px;\n line-height: 1;\n}\n@media screen and (min-width: 1068px) {\n .l-single-container h1 {\n margin-bottom: 35px;\n font-size: 2.8rem;\n }\n}\n@media screen and (max-width: 1067px) {\n .l-single-container h1 {\n letter-spacing: 0.02em;\n }\n}\n@media screen and (max-width: 374px) {\n .l-single-container h1 {\n font-size: 2.8rem;\n }\n}\n.l-single-inner {\n width: 100%;\n margin: 0 auto;\n width: 410px;\n}\n@media screen and (max-width: 430px) {\n .l-single-inner {\n width: 100%;\n }\n}\n.l-single-inner .form-group {\n margin: 0 0 17px;\n}\n@media screen and (min-width: 1068px) {\n .l-single-inner .form-group {\n margin: 0 0 20px;\n }\n}\n\n@media screen and (min-width: 1068px) {\n .l-registration .l-single-container h1 {\n margin-bottom: 40px;\n }\n}\n\n/* #Content\n -------------------------------------------------------------------------- */\n/*doc\n---\ntitle: content\nname: content\ncategories: [layout]\n---\n\n`<article>`タグが使われるようなメインコンテンツのスタイルです。\nナビゲーションやバナーなどのレイアウトを含むことはできますが、\nコンポーネント自体はobject/projectレイヤーで定義します。\n\n```block\n<body>\n <article class=\"l-content s-blog\">\n <header class=\"l-content__lead\"></header>\n </article>\n</body>\n```\n*/\n.l-content {\n width: 100%;\n margin: 30px auto 0;\n padding: 0 20px;\n}\n@media screen and (min-width: 1068px) {\n .l-content {\n margin: 25px 0 0 240px;\n padding: 0 32px;\n }\n}\n@media screen and (max-width: 1067px) {\n .l-content {\n padding-bottom: 130px;\n max-width: 700px;\n box-sizing: border-box;\n }\n}\n@media screen and (max-width: 430px) {\n .l-content {\n padding-bottom: 110px;\n }\n}\n.l-content-wrap {\n margin: 0 auto;\n box-sizing: border-box;\n}\n@media screen and (min-width: 1068px) {\n .l-content-wrap {\n max-width: 1064px;\n -webkit-box-shadow: 0 1px 4px #ddd;\n box-shadow: 0 1px 4px #ddd;\n margin-bottom: 40px;\n border-radius: 8px;\n background: #fff;\n }\n}\n.l-content__ttl {\n display: flex;\n flex-wrap: wrap;\n align-items: center;\n justify-content: center;\n margin: 0 auto 35px;\n}\n@media screen and (min-width: 1068px) {\n .l-content__ttl {\n max-width: 1064px;\n justify-content: space-between;\n margin: 0 auto 25px;\n }\n}\n@media screen and (max-width: 430px) {\n .l-content__ttl {\n margin: 0 auto 30px;\n }\n}\n.l-content__ttl__left {\n display: flex;\n flex-wrap: wrap;\n align-items: center;\n}\n.l-content__ttl h2 {\n font-size: 2.4rem;\n font-weight: bold;\n}\n@media screen and (min-width: 1068px) {\n .l-content__ttl h2 {\n margin-right: 30px;\n font-size: 3rem;\n }\n}\n@media screen and (max-width: 1067px) {\n .l-content__ttl h2 {\n letter-spacing: 0.04em;\n }\n}\n@media screen and (max-width: 374px) {\n .l-content__ttl h2 {\n font-size: 2rem;\n }\n}\n.l-content-w560 {\n margin: 0 auto;\n width: 100%;\n}\n@media screen and (min-width: 1068px) {\n .l-content-w560 {\n max-width: 560px;\n }\n}\n\n/* #Side\n -------------------------------------------------------------------------- */\n/*doc\n---\ntitle: side\nname: side\ncategories: [layout]\n---\n\n`<aside>`タグが使われるようなサイドバーのスタイルです。\nナビゲーションやバナーなどのレイアウトを含むことはできますが、\nコンポーネント自体はobject/projectレイヤーで定義します。\n\n```block\n<body>\n <article class=\"l-content\"></article>\n <aside class=\"l-side\">\n <div class=\"l-side__item\">\n <ul class=\"p-side-nav\"></ul>\n </div>\n <div class=\"l-side__item\">\n <div class=\"p-banner\"></div>\n </div>\n </aside>\n</body>\n```\n*/\n.l-side {\n position: fixed;\n left: 0;\n overflow-x: auto;\n -ms-overflow-style: -ms-autohiding-scrollbar;\n -webkit-overflow-scrolling: touch;\n background: #000000;\n z-index: 3;\n width: calc(100% -20px);\n height: 54px;\n}\n@media screen and (min-width: 1068px) {\n .l-side {\n height: 100vh;\n width: 240px;\n }\n}\n@media screen and (max-width: 1067px) {\n .l-side {\n display: flex;\n align-items: center;\n justify-content: center;\n left: 7px;\n right: 7px;\n bottom: 7px;\n border-radius: 12px;\n width: calc(100% - 14px);\n }\n}\n.l-side-logo {\n line-height: 1;\n margin: 35px auto;\n}\n@media screen and (min-width: 1068px) {\n .l-side-logo {\n width: 38px;\n }\n}\n@media screen and (max-width: 1067px) {\n .l-side-logo {\n display: none;\n }\n}\n.l-side-logo a {\n display: block;\n line-height: 1;\n}\n\n@media screen and (max-width: 1067px) {\n .mypage-nav {\n width: 100%;\n height: 100%;\n }\n}\n@media screen and (max-width: 1067px) {\n .mypage-nav-list {\n display: flex;\n align-items: center;\n justify-content: space-between;\n height: 100%;\n padding: 0 7px;\n }\n}\n.mypage-nav-list__item {\n display: flex;\n align-items: center;\n}\n@media screen and (min-width: 1068px) {\n .mypage-nav-list__item.nav-active a {\n background: #F0DE00;\n color: #000;\n }\n .mypage-nav-list__item.nav-active a:hover {\n opacity: 1;\n }\n}\n.mypage-nav-list__item.nav-active .prof-wrap {\n border: 1px solid #F0DE00;\n}\n.mypage-nav-list__item.nav-active.-profile .prof-wrap {\n border: 1px solid #ccc;\n}\n.mypage-nav-list__item.nav-active .icon.meeting:before {\n background-image: url(../../assets/img/icon/list-yellow.svg);\n}\n@media screen and (min-width: 1068px) {\n .mypage-nav-list__item.nav-active .icon.meeting:before {\n background-image: url(../../assets/img/icon/list-black.svg);\n }\n}\n@media screen and (max-width: 1067px) {\n .mypage-nav-list__item.nav-active .icon.star:before {\n background-image: url(../../assets/img/icon/star-outline-yellow02.svg);\n }\n}\n.mypage-nav-list__item.nav-active .icon.parents:before {\n background-image: url(../../assets/img/icon/people-yellow.svg);\n}\n@media screen and (min-width: 1068px) {\n .mypage-nav-list__item.nav-active .icon.parents:before {\n background-image: url(../../assets/img/icon/people-black.svg);\n }\n}\n.mypage-nav-list__item.nav-active .icon.search:before {\n background-image: url(../../assets/img/icon/search-yellow.svg);\n}\n@media screen and (min-width: 1068px) {\n .mypage-nav-list__item.nav-active .icon.search:before {\n background-image: url(../../assets/img/icon/search-black.svg);\n }\n}\n.mypage-nav-list__item.nav-active .icon.log-out:before {\n background-image: url(../../assets/img/icon/log-out-yellow.svg);\n}\n@media screen and (min-width: 1068px) {\n .mypage-nav-list__item.nav-active .icon.log-out:before {\n background-image: url(../../assets/img/icon/log-out-black.svg);\n }\n}\n@media screen and (max-width: 1067px) {\n .mypage-nav-list__item {\n width: 20%;\n height: 100%;\n }\n}\n@media screen and (max-width: 1067px) {\n .mypage-nav-list__item.-logout {\n display: none;\n }\n}\n@media screen and (min-width: 1068px) {\n .mypage-nav-list__item.-favorite {\n display: none;\n }\n}\n.mypage-nav-list__item a {\n display: flex;\n align-items: center;\n width: 100%;\n color: #ccc;\n line-height: 1.5;\n font-weight: bold;\n word-break: break-all;\n transition: all 0.25s ease-out;\n text-decoration: none;\n}\n@media screen and (min-width: 1068px) {\n .mypage-nav-list__item a {\n padding: 13px 1.2em;\n }\n .mypage-nav-list__item a:hover {\n opacity: 0.6;\n }\n}\n@media screen and (max-width: 1067px) {\n .mypage-nav-list__item a {\n justify-content: center;\n box-sizing: border-box;\n height: 100%;\n }\n}\n@media screen and (max-width: 1067px) {\n .mypage-nav-list__item a span {\n display: none;\n }\n}\n.mypage-nav-list__item .icon {\n width: 29px;\n height: 29px;\n position: relative;\n}\n@media screen and (min-width: 1068px) {\n .mypage-nav-list__item .icon {\n margin-right: 13px;\n transition: all 0.25s ease-out;\n width: 24px;\n height: 24px;\n }\n}\n.mypage-nav-list__item .icon:before {\n content: \"\";\n position: absolute;\n width: 100%;\n height: 100%;\n display: inline-block;\n background-repeat: no-repeat;\n background-position: 50%;\n background-size: 100%;\n}\n.mypage-nav-list__item .icon.meeting:before {\n background-image: url(../../assets/img/icon/list-gray.svg);\n}\n.mypage-nav-list__item .icon.star:before {\n background-image: url(../../assets/img/icon/star-outline-gray02.svg);\n}\n.mypage-nav-list__item .icon.search:before {\n background-image: url(../../assets/img/icon/search-gray.svg);\n}\n.mypage-nav-list__item .icon.parents:before {\n background-image: url(../../assets/img/icon/people-gray.svg);\n}\n.mypage-nav-list__item .icon.log-out:before {\n background-image: url(../../assets/img/icon/log-out-gray.svg);\n}\n.mypage-nav-list__link.user-icon figure {\n display: flex;\n align-items: center;\n justify-content: center;\n}\n@media screen and (min-width: 1068px) {\n .mypage-nav-list__link.user-icon figure {\n margin-right: 13px;\n width: 24px;\n height: 24px;\n }\n}\n.mypage-nav-list__link.user-icon figure .prof-wrap {\n width: 18px;\n height: 18px;\n border: 1px solid #ccc;\n border-radius: 50%;\n overflow: hidden;\n}\n@media screen and (max-width: 1067px) {\n .mypage-nav-list__link.user-icon figure .prof-wrap {\n width: 28px;\n height: 28px;\n }\n}\n\n/* #Section\n -------------------------------------------------------------------------- */\n/*doc\n---\ntitle: section\nname: section\ncategories: [layout]\n---\n\n`<section>`タグを使うようなセクションの余白（`margin`）を管理します。\nコンポーネント単位での余白はobject/utility/_margin.scssで管理をします。\n\nサイズはデフォルトで3つ、最大で5つとします。\n\n1. tiny(optional)\n2. small\n3. medium(default)\n4. large\n5. huge(optional)\n\nModifierなしをmedium、変更する場合にはModifierを指定します。\n\n```block\n<div class=\"l-section\">\n <h2>見出し2</h2>\n</div>\n\n<div class=\"l-section l-section--small\">\n <h2>見出し2</h2>\n</div>\n\n<div class=\"l-section l-section--large\">\n <h2>見出し2</h2>\n</div>\n```\n*/\n/* =============================================================================\n #Object\n ========================================================================== */\n/**\n * Objectレイヤーはプロジェクトにおけるビジュアルパターンです。抽象度や詳細度、\n * 拡張性などによって、4つのレイヤーにわけられます。\n * それぞれのレイヤーにはプレフィックス（接頭辞）をつけます。\n * 1. Component（`c-`）\n * 2. Project（`p-`）\n * 3. Scope(`s-`)\n * 4. Utility（`u-`）\n *\n * ランディングページのようにページ特有のスタイルを多く含む場合は、\n * ページ専用のCSSファイルを作成することもできます。\n * ページ専用のスタイルは、そのページにだけ読み込ませることでスコープをつくり、\n * プレフィックス（接頭辞）をつけないことで名前の重複を防ぎます。\n */\n/* -----------------------------------------------------------------------------\n #Component\n -------------------------------------------------------------------------- */\n/**\n * Componentレイヤーは多くのプロジェクトで横断的に再利用のできるような、小さな単位のモジュール（機能）です。\n * OOCSSの構造（structure）の機能を担うため、装飾的なスタイルをできるだけ含めないようにします。\n * また、`width`や`margin`といったレイアウトに影響を与えるプロパティもできるだけ含めないようにします。\n * 例えばgridやmediaといったレイアウトパターンが該当します。\n * プレフィックス（接頭辞）として`c-`をつけます。\n */\n/* #Wrapper\n -------------------------------------------------------------------------- */\n/*doc\n---\ntitle: wrapper\nname: wrapper\ncategories: [component]\n---\n\n横幅を制限するオブジェクトです。\n\nModifierは以下のとおりです。\n\n* 左右の余白を追加 `--small`, `--medium`, `--large`\n\n```block\n```\n*/\n.c-wrapper {\n width: 100%;\n max-width: 960px;\n margin-right: auto;\n margin-left: auto;\n}\n\n/* #Layout\n -------------------------------------------------------------------------- */\n/*doc\n---\ntitle: layout\nname: layout\ncategories: [component]\n---\n\n汎用的なレイアウトオブジェクトです。`width`の変更はUtilityレイヤーで指定します。\n\nModifierは以下のとおりです。\n\n* ガターの追加 `--small`, `--medium`, `--large`\n* text-alignの変更 `--middle`, `--bottom`\n* 配置を反転 `--reverse`\n* `.c-layout__item`のカラム幅をまとめて指定 `--colx`, `--colxandx`\n\n```block\n<div class=\"c-wrapper\">\n <div class=\"c-layout c-layout--medium\" style=\"margin-bottom:1rem;\">\n <div class=\"c-layout__item u-8of12-md\"><div style=\"background-color:lightblue;\">c-layout__item u-8of12-md</div></div>\n <div class=\"c-layout__item u-4of12-md\"><div style=\"background-color:lightblue;\">c-layout__item u-4of12-md</div></div>\n </div>\n\n <div class=\"c-layout c-layout--reverse c-layout--medium\" style=\"margin-bottom:1rem;\">\n <div class=\"c-layout__item u-8of12-md\"><div style=\"background-color:lightblue;\">c-layout--rev c-layout__item u-8of12-md</div></div>\n <div class=\"c-layout__item u-4of12-md\"><div style=\"background-color:lightblue;\">c-layout--rev c-layout__item u-4of12-md</div></div>\n </div>\n\n <div class=\"c-layout c-layout--center c-layout--medium\" style=\"margin-bottom:1rem;\">\n <div class=\"c-layout__item u-8of12-md\"><div style=\"background-color:lightblue;\">c-layout--center c-layout__item u-8of12-md</div></div>\n </div>\n\n <div class=\"c-layout c-layout--medium c-layout--col2-sm c-layout--col3-md\" style=\"margin-bottom:1rem;\">\n <div class=\"c-layout__item\"><div style=\"background-color:lightblue;\">c-layout__item c-layout--col2-sm c-layout--col3-md</div></div>\n <div class=\"c-layout__item\"><div style=\"background-color:lightblue;\">c-layout__item c-layout--col2-sm c-layout--col3-md</div></div>\n <div class=\"c-layout__item\"><div style=\"background-color:lightblue;\">c-layout__item c-layout--col2-sm c-layout--col3-md</div></div>\n </div>\n\n <div class=\"c-layout c-layout--col4and8\" style=\"margin-bottom:1rem;\">\n <div class=\"c-layout__item\"><div style=\"background-color:lightblue;\">c-layout__item u-8of12-md</div></div>\n <div class=\"c-layout__item\"><div style=\"background-color:lightblue;\">c-layout__item u-4of12-md</div></div>\n </div>\n</div>\n```\n*/\n.c-layout {\n display: block;\n margin: 0;\n padding: 0;\n font-size: 0;\n list-style-type: none;\n}\n\n.c-layout__item {\n display: inline-block;\n width: 100%;\n font-size: medium;\n font-size: 1rem;\n vertical-align: top;\n}\n\n/**\n * ガターを3つのパリエーションから選択します。\n */\n.c-layout--small {\n margin-left: -0.85rem;\n}\n.c-layout--small > .c-layout__item {\n padding-left: 0.85rem;\n}\n\n.c-layout--medium {\n margin-left: -1.7rem;\n}\n.c-layout--medium > .c-layout__item {\n padding-left: 1.7rem;\n}\n\n.c-layout--large {\n margin-left: -3.4rem;\n}\n.c-layout--large > .c-layout__item {\n padding-left: 3.4rem;\n}\n\n/**\n * 垂直位置を2つのパリエーションから選択します（デフォルトは`top`）。\n */\n.c-layout--middle > .c-layout__item {\n vertical-align: middle;\n}\n\n.c-layout--bottom > .c-layout__item {\n vertical-align: bottom;\n}\n\n/**\n * 要素を中央配置にします（デフォルトは`left`）。\n */\n.c-layout--center {\n text-align: center;\n}\n.c-layout--center > .c-layout__item {\n text-align: left;\n}\n\n/**\n * 要素を右端寄せにします（デフォルトは`left`）。\n */\n.c-layout--right {\n text-align: right;\n}\n.c-layout--right > .c-layout__item {\n text-align: left;\n}\n\n/**\n * `.c-layout__item`のカラム数をまとめて指定します。\n */\n.c-layout--col2 > .c-layout__item {\n width: 50%;\n}\n\n@media screen and (min-width: 400px) {\n .c-layout--col2-sm > .c-layout__item {\n width: 50%;\n }\n}\n@media screen and (min-width: 768px) {\n .c-layout--col2-md > .c-layout__item {\n width: 50%;\n }\n}\n@media screen and (min-width: 1000px) {\n .c-layout--col2-lg > .c-layout__item {\n width: 50%;\n }\n}\n@media screen and (min-width: 1200px) {\n .c-layout--col2-xl > .c-layout__item {\n width: 50%;\n }\n}\n.c-layout--col3 > .c-layout__item {\n width: 33.3333333333%;\n}\n\n@media screen and (min-width: 400px) {\n .c-layout--col3-sm > .c-layout__item {\n width: 33.3333333333%;\n }\n}\n@media screen and (min-width: 768px) {\n .c-layout--col3-md > .c-layout__item {\n width: 33.3333333333%;\n }\n}\n@media screen and (min-width: 1000px) {\n .c-layout--col3-lg > .c-layout__item {\n width: 33.3333333333%;\n }\n}\n@media screen and (min-width: 1200px) {\n .c-layout--col3-xl > .c-layout__item {\n width: 33.3333333333%;\n }\n}\n.c-layout--col4 > .c-layout__item {\n width: 25%;\n}\n\n@media screen and (min-width: 400px) {\n .c-layout--col4-sm > .c-layout__item {\n width: 25%;\n }\n}\n@media screen and (min-width: 768px) {\n .c-layout--col4-md > .c-layout__item {\n width: 25%;\n }\n}\n@media screen and (min-width: 1000px) {\n .c-layout--col4-lg > .c-layout__item {\n width: 25%;\n }\n}\n@media screen and (min-width: 1200px) {\n .c-layout--col4-xl > .c-layout__item {\n width: 25%;\n }\n}\n.c-layout--col2and10 > .c-layout__item:nth-child(odd) {\n width: 16.6666666667%;\n}\n.c-layout--col2and10 > .c-layout__item:nth-child(even) {\n width: 83.3333333333%;\n}\n\n@media screen and (min-width: 400px) {\n .c-layout--col2and10-sm > .c-layout__item:nth-child(odd) {\n width: 16.6666666667%;\n }\n .c-layout--col2and10-sm > .c-layout__item:nth-child(even) {\n width: 83.3333333333%;\n }\n}\n@media screen and (min-width: 768px) {\n .c-layout--col2and10-md > .c-layout__item:nth-child(odd) {\n width: 16.6666666667%;\n }\n .c-layout--col2and10-md > .c-layout__item:nth-child(even) {\n width: 83.3333333333%;\n }\n}\n@media screen and (min-width: 1000px) {\n .c-layout--col2and10-lg > .c-layout__item:nth-child(odd) {\n width: 16.6666666667%;\n }\n .c-layout--col2and10-lg > .c-layout__item:nth-child(even) {\n width: 83.3333333333%;\n }\n}\n@media screen and (min-width: 1200px) {\n .c-layout--col2and10-xl > .c-layout__item:nth-child(odd) {\n width: 16.6666666667%;\n }\n .c-layout--col2and10-xl > .c-layout__item:nth-child(even) {\n width: 83.3333333333%;\n }\n}\n.c-layout--col3and9 > .c-layout__item:nth-child(odd) {\n width: 25%;\n}\n.c-layout--col3and9 > .c-layout__item:nth-child(even) {\n width: 75%;\n}\n\n@media screen and (min-width: 400px) {\n .c-layout--col3and9-sm > .c-layout__item:nth-child(odd) {\n width: 25%;\n }\n .c-layout--col3and9-sm > .c-layout__item:nth-child(even) {\n width: 75%;\n }\n}\n@media screen and (min-width: 768px) {\n .c-layout--col3and9-md > .c-layout__item:nth-child(odd) {\n width: 25%;\n }\n .c-layout--col3and9-md > .c-layout__item:nth-child(even) {\n width: 75%;\n }\n}\n@media screen and (min-width: 1000px) {\n .c-layout--col3and9-lg > .c-layout__item:nth-child(odd) {\n width: 25%;\n }\n .c-layout--col3and9-lg > .c-layout__item:nth-child(even) {\n width: 75%;\n }\n}\n@media screen and (min-width: 1200px) {\n .c-layout--col3and9-xl > .c-layout__item:nth-child(odd) {\n width: 25%;\n }\n .c-layout--col3and9-xl > .c-layout__item:nth-child(even) {\n width: 75%;\n }\n}\n.c-layout--col4and8 > .c-layout__item:nth-child(odd) {\n width: 33.3333333333%;\n}\n.c-layout--col4and8 > .c-layout__item:nth-child(even) {\n width: 66.6666666667%;\n}\n\n@media screen and (min-width: 400px) {\n .c-layout--col4and8-sm > .c-layout__item:nth-child(odd) {\n width: 33.3333333333%;\n }\n .c-layout--col4and8-sm > .c-layout__item:nth-child(even) {\n width: 66.6666666667%;\n }\n}\n@media screen and (min-width: 768px) {\n .c-layout--col4and8-md > .c-layout__item:nth-child(odd) {\n width: 33.3333333333%;\n }\n .c-layout--col4and8-md > .c-layout__item:nth-child(even) {\n width: 66.6666666667%;\n }\n}\n@media screen and (min-width: 1000px) {\n .c-layout--col4and8-lg > .c-layout__item:nth-child(odd) {\n width: 33.3333333333%;\n }\n .c-layout--col4and8-lg > .c-layout__item:nth-child(even) {\n width: 66.6666666667%;\n }\n}\n@media screen and (min-width: 1200px) {\n .c-layout--col4and8-xl > .c-layout__item:nth-child(odd) {\n width: 33.3333333333%;\n }\n .c-layout--col4and8-xl > .c-layout__item:nth-child(even) {\n width: 66.6666666667%;\n }\n}\n.c-layout--col5and7 > .c-layout__item:nth-child(odd) {\n width: 41.6666666667%;\n}\n.c-layout--col5and7 > .c-layout__item:nth-child(even) {\n width: 58.3333333333%;\n}\n\n@media screen and (min-width: 400px) {\n .c-layout--col5and7-sm > .c-layout__item:nth-child(odd) {\n width: 41.6666666667%;\n }\n .c-layout--col5and7-sm > .c-layout__item:nth-child(even) {\n width: 58.3333333333%;\n }\n}\n@media screen and (min-width: 768px) {\n .c-layout--col5and7-md > .c-layout__item:nth-child(odd) {\n width: 41.6666666667%;\n }\n .c-layout--col5and7-md > .c-layout__item:nth-child(even) {\n width: 58.3333333333%;\n }\n}\n@media screen and (min-width: 1000px) {\n .c-layout--col5and7-lg > .c-layout__item:nth-child(odd) {\n width: 41.6666666667%;\n }\n .c-layout--col5and7-lg > .c-layout__item:nth-child(even) {\n width: 58.3333333333%;\n }\n}\n@media screen and (min-width: 1200px) {\n .c-layout--col5and7-xl > .c-layout__item:nth-child(odd) {\n width: 41.6666666667%;\n }\n .c-layout--col5and7-xl > .c-layout__item:nth-child(even) {\n width: 58.3333333333%;\n }\n}\n/**\n * 要素を右から配置させます（HTMLの記述を反転させた状態でレイアウトされます）。\n */\n.c-layout--reverse {\n text-align: left;\n direction: rtl;\n}\n.c-layout--reverse > .c-layout__item {\n text-align: left;\n direction: ltr;\n}\n\n@media screen and (min-width: 400px) {\n .c-layout--reverse-sm {\n text-align: left;\n direction: rtl;\n }\n .c-layout--reverse-sm > .c-layout__item {\n text-align: left;\n direction: ltr;\n }\n}\n@media screen and (min-width: 768px) {\n .c-layout--reverse-md {\n text-align: left;\n direction: rtl;\n }\n .c-layout--reverse-md > .c-layout__item {\n text-align: left;\n direction: ltr;\n }\n}\n@media screen and (min-width: 1000px) {\n .c-layout--reverse-lg {\n text-align: left;\n direction: rtl;\n }\n .c-layout--reverse-lg > .c-layout__item {\n text-align: left;\n direction: ltr;\n }\n}\n@media screen and (min-width: 1200px) {\n .c-layout--reverse-xl {\n text-align: left;\n direction: rtl;\n }\n .c-layout--reverse-xl > .c-layout__item {\n text-align: left;\n direction: ltr;\n }\n}\n/* -----------------------------------------------------------------------------\n #Project\n -------------------------------------------------------------------------- */\n/**\n * Projectレイヤーはプロジェクト固有のパターンで、複数のページで使い回せるようなコンポーネントです。\n * 具体的なスタイルを持つUI（ユーザーフェイス）で、追加されるコンポーネントのほとんどはこのレイヤーに置かれます。\n * もし、このレイヤーで同じパターンが3箇所で使われていたら、別のコンポーネントとしてまとめられないか検討しましょう。\n * プレフィックス（接頭辞）として`p-`をつけます。\n */\n/* #Icon\n -------------------------------------------------------------------------- */\n/*doc\n---\ntitle: icon\nname: icon\ncategories: [project]\n---\n\nアイコンフォントを使ったアイコンを表示します。デフォルトでは`:before`擬似要素で表示されます。\nサンプルコードはパンくずリストのホームをアイコンで（2つ目以降はアイコンだけで）示した場合の例です。\n\n装飾的なアイコンは`<span>`と`aria-hidden=\"true\"`でマークアップをします。\n\n意味を伝えたいアイコンは`aria-label=\"\"`でマークアップします。\nテキスト全体を読み上げたときに違和感が出ないようにします。\n\nテキストを表示できない場合は`.u-sr-only`でテキストをマークアップします（非表示のままスクリーンリーダーには読み上げられます）。\n\n```block\n<div>\n <span class=\"p-icon p-icon--home\" aria-hidden=\"true\"></span>ホーム\n</div>\n\n<div>\n <span class=\"p-icon p-icon--home\" aria-label=\"ホーム\"></span>\n</div>\n\n<div>\n <span class=\"p-icon p-icon--home\" aria-hidden=\"true\"></span>\n <span class=\"u-sr-only\">ホーム</span>\n</div>\n```\n*/\n@font-face {\n font-family: \"iconfont\";\n src: url(\"../font/iconfont.eot\");\n src: url(\"../font/iconfont.eot?#iefix\") format(\"eot\"), url(\"../font/iconfont.woff\") format(\"woff\"), url(\"../font/iconfont.ttf\") format(\"truetype\"), url(\"../font/iconfont.svg#iconfont\") format(\"svg\");\n font-weight: normal;\n font-style: normal;\n}\n/* `p-icon p-icon--icon-name`のようなマルチクラスで指定します。 */\n.p-icon:before {\n font-family: \"iconfont\";\n -webkit-font-smoothing: antialiased;\n -moz-osx-font-smoothing: grayscale;\n position: relative;\n top: -0.1em;\n display: inline-block;\n vertical-align: middle;\n font-style: normal;\n font-variant: normal;\n font-weight: normal;\n line-height: 1;\n text-decoration: none;\n text-transform: none;\n speak: none;\n}\n\n.p-icon--home:before {\n content: \"\";\n}\n\n/* 使用中CSS */\n.icon:after {\n display: block;\n content: \"\";\n}\n\n.a-icon {\n position: relative;\n display: inline-block;\n width: 32px;\n height: 30px;\n line-height: 1;\n color: inherit;\n vertical-align: top;\n touch-action: manipulation;\n background-color: transparent;\n border: none;\n appearance: none;\n}\n\n.like-icon {\n position: relative;\n}\n.like-icon:after {\n background-size: 33px 30px;\n width: 33px;\n height: 32px;\n position: absolute;\n right: 0;\n top: 0;\n}\n\n.icon-star:after {\n background: url(../../assets/img/icon/star-outline-gray.svg) no-repeat;\n}\n.icon-starFill:after {\n background: url(../../assets/img/icon/star-outline-yellow.svg) no-repeat;\n}\n.icon-star-wrap {\n border: 1px solid #D0D0D0;\n border-radius: 8px;\n min-width: 52px;\n height: 52px;\n}\n.icon-star-wrap:after {\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translateX(-50%) translateY(-50%);\n}\n\n.icon-search {\n position: absolute;\n top: 0;\n right: 0;\n display: flex;\n align-items: center;\n justify-content: center;\n width: 48px;\n height: 61px;\n cursor: pointer;\n}\n@media screen and (min-width: 1068px) {\n .icon-search {\n height: 69px;\n width: 54px;\n }\n}\n.icon-search:after {\n background: url(../../assets/img/icon/search-gray.svg) no-repeat;\n background-size: cover;\n width: 20px;\n height: 20px;\n margin-top: 13px;\n}\n@media screen and (min-width: 1068px) {\n .icon-search:after {\n width: 26px;\n height: 26px;\n }\n}\n\n.icon-calendar {\n position: absolute;\n top: 0;\n right: 0;\n display: flex;\n align-items: center;\n justify-content: center;\n width: 52px;\n height: 60px;\n cursor: pointer;\n}\n@media screen and (min-width: 1068px) {\n .icon-calendar {\n height: 69px;\n width: 58px;\n }\n}\n.icon-calendar:after {\n background: url(../../assets/img/icon/calendar.svg) no-repeat;\n background-size: cover;\n width: 23px;\n height: 25px;\n margin-top: 15px;\n}\n\n/* アイコンのModifer */\n/* #Btn-icon\n -------------------------------------------------------------------------- */\n/*doc\n---\ntitle: btn-icon\nname: btn-icon\ncategories: [project]\n---\n\nボタンコンポーネントです。\n\nModifierは以下のとおりです。\n\n* 100%表示 `-full`\n* width指定 `-w`\n* height指定 `-h`\n* 真円 `-circle`\n* 楕円 `-r`\n\n```block\n```\n*/\n/* icon */\n.svg-icon {\n display: inline-block;\n width: 16px;\n height: 16px;\n color: inherit;\n vertical-align: middle;\n fill: none;\n stroke: currentColor;\n}\n.svg-fill {\n fill: currentColor;\n stroke: none;\n}\n.svg-up {\n transform: rotate(0deg);\n}\n.svg-y50 {\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n}\n\n@media screen and (min-width: 1068px) {\n .btn-meeting {\n padding: 0 5px 0 8px;\n }\n}\n.btn-meeting .icon {\n width: 22px;\n height: 22px;\n position: relative;\n}\n@media screen and (min-width: 1068px) {\n .btn-meeting .icon {\n top: -1px;\n padding-left: 11px;\n width: 14px;\n height: 14px;\n }\n}\n\n.btn {\n /* font-size */\n /* shadow */\n}\n.btn-default {\n display: flex;\n align-items: center;\n justify-content: center;\n width: 100%;\n font-size: 1.6rem;\n font-weight: bold;\n border: 1px solid transparent;\n -webkit-transition: all ease-out 0.2s;\n transition: all ease-out 0.2s;\n cursor: pointer;\n text-align: center;\n line-height: 1;\n}\n.btn-default:hover {\n opacity: 0.7;\n}\n.btn-yellow {\n background: #F0DE00;\n /* border: 1px solid #F0DE00; */\n border: none;\n}\n.btn-fz14 {\n font-size: 1.4rem;\n}\n.btn-shadow {\n box-shadow: 0 1px 4px rgba(0, 0, 0, 0.1);\n}\n\n/* \n.p-btn {\n display: inline-block;\n margin: 0;\n padding: 0.75em;\n border: none;\n border-radius: 0;\n color: inherit;\n font-family: inherit;\n font-size: inherit;\n line-height: 1;\n text-align: center;\n text-decoration: none;\n background: transparent;\n cursor: pointer;\n appearance: none;\n @include _on-event {\n text-decoration: none;\n }\n &:disabled,\n &.is-disabled {\n opacity: 0.5;\n pointer-events: none;\n }\n &--base{\n display: flex;\n justify-content: center;\n align-items: center;\n }\n &--inner{\n display: flex;\n justify-content: center;\n align-items: center;\n margin-top: 1px;\n }\n}\n*/\n.p-btn--full {\n width: 100%;\n}\n\n.p-btn--circle {\n border-radius: 50%;\n}\n\n/**\n * 角丸\n */\n.btn-r3 {\n border-radius: 3px;\n}\n\n.btn-r5 {\n border-radius: 5px;\n}\n\n.btn-r8 {\n border-radius: 8px;\n}\n\n.btn-r10 {\n border-radius: 10px;\n}\n\n.btn-r14 {\n border-radius: 10px;\n}\n@media screen and (min-width: 1068px) {\n .btn-r14 {\n border-radius: 14px;\n }\n}\n\n.btn-r15 {\n border-radius: 15px;\n}\n\n.btn-r20 {\n border-radius: 20px;\n}\n\n.btn-r24 {\n border-radius: 24px;\n}\n\n.btn-r25 {\n border-radius: 25px;\n}\n\n.btn-r30 {\n border-radius: 5px;\n}\n\n.btn-r35 {\n border-radius: 35px;\n}\n\n.btn-r40 {\n border-radius: 40px;\n}\n\n.btn-r45 {\n border-radius: 45px;\n}\n\n.btn-r50 {\n border-radius: 50px;\n}\n\n/**\n * width\n */\n.btn-w100p {\n max-width: 100%;\n}\n\n.btn-w56 {\n max-width: 56px;\n}\n\n.btn-w130 {\n max-width: 130px;\n}\n\n.btn-w150 {\n max-width: 150px;\n}\n\n.btn-w170 {\n max-width: 170px;\n}\n\n.btn-w200 {\n max-width: 200px;\n}\n\n.btn-w230 {\n max-width: 230px;\n}\n\n.btn-w250 {\n max-width: 250px;\n}\n\n.btn-w300 {\n max-width: 300px;\n}\n\n.btn-w320 {\n max-width: 320px;\n}\n\n/**\n * height\n */\n.btn-h28 {\n height: 28px;\n}\n\n.btn-h30 {\n height: 30px;\n}\n\n.btn-h42 {\n height: 42px;\n}\n\n.btn-h45 {\n height: 45px;\n}\n\n.btn-h48 {\n height: 48px;\n}\n\n.btn-h50 {\n height: 50px;\n}\n\n.btn-h52 {\n height: 52px;\n line-height: 48px;\n}\n\n.btn-h55 {\n height: 55px;\n}\n\n.btn-h60 {\n height: 60px;\n line-height: 56px;\n}\n\n.btn-h65 {\n height: 65px;\n}\n\n.btn-h70 {\n height: 66px;\n}\n@media screen and (min-width: 1068px) {\n .btn-h70 {\n height: 70px;\n }\n}\n\n.btn-h75 {\n height: 75px;\n}\n\n.btn-h80 {\n height: 80px;\n}\n\n.btn-h85 {\n height: 85px;\n}\n\n.btn-h90 {\n height: 90px;\n}\n\n/* #Breadcrumb\n -------------------------------------------------------------------------- */\n/*doc\n---\ntitle: breadcrumb\nname: breadcrumb\ncategories: [project]\n---\n\nパンくずリストのコンポーネントです。横幅を超えると、折り返さず省略されます。\n\n```block\n<ol class=\"p-breadcrumb\">\n <li class=\"p-breadcrumb__item\">\n <a href=\"#\" class=\"p-breadcrumb__link\">home</a>\n </li>\n <li class=\"p-breadcrumb__item\">\n <a href=\"#\" class=\"p-breadcrumb__link\">page1</a>\n </li>\n <li class=\"p-breadcrumb__item\">page2</li>\n</ol>\n```\n*/\n.p-breadcrumb {\n overflow: hidden;\n margin: 0;\n padding-left: 0;\n white-space: nowrap;\n text-overflow: ellipsis;\n list-style-type: none;\n}\n\n.p-breadcrumb__item {\n display: inline-block;\n}\n.p-breadcrumb__item:last-child {\n display: inline;\n}\n\n.p-breadcrumb__link {\n display: inline-block;\n}\n\n/* 2つ目以降のリストの前に`>`を表示する。 */\n.p-breadcrumb__item:not(:first-of-type):before {\n content: \">\";\n margin: 0 0.5em;\n}\n\n/* #Label\n -------------------------------------------------------------------------- */\n/*doc\n---\ntitle: label\nname: label\ncategories: [project]\n---\n\nインラインでメッセージを表示するコンポーネントです。\n\n```block\n<p><span class=\"p-label\">タグ名</span></p>\n```\n*/\n/* #Box\n -------------------------------------------------------------------------- */\n/*doc\n---\ntitle: box\nname: box\ncategories: [project]\n---\n\n画像やテキストなどを縦に並べるコンポーネントです。\n\nラベルはデフォルトで右上に配置されます。Modifierで以下のように変更できます。\n\n- 右下 `.p-box__labels--right-bottom`\n- 左上 `.p-box__labels--left-top`\n- 左下 `.p-box__labels--left-bottom`\n\n```block\n<div class=\"p-box\">\n <div class=\"p-box__image\">\n <img src=\"http://lorempixel.com/600/400/\" alt=\"\">\n <ul class=\"p-box__labels\">\n <li class=\"p-box__label p-label\">ラベル1</li>\n <li class=\"p-box__label p-label\">ラベル2</li>\n </ul>\n </div>\n <div class=\"p-box__content\">\n <h2>見出し</h2>\n <p>文章</p>\n </div>\n</div>\n```\n*/\n.p-box {\n display: block;\n}\n.p-box:after {\n content: \"\";\n display: block;\n clear: both;\n}\n\n.p-box__image {\n position: relative;\n display: block;\n}\n.p-box__image > img {\n width: 100%;\n max-width: none;\n}\n\n.p-box__labels {\n position: absolute;\n top: 0;\n right: 0;\n padding-left: 0;\n list-style-type: none;\n}\n.p-box__labels:after {\n content: \"\";\n display: block;\n clear: both;\n}\n\n.p-box__labels--right-bottom {\n top: auto;\n bottom: 0;\n}\n\n.p-box__labels--left-top {\n right: auto;\n left: 0;\n}\n\n.p-box__labels--left-bottom {\n top: auto;\n right: auto;\n bottom: 0;\n left: 0;\n}\n\n.p-box__label {\n float: left;\n}\n\n.p-box__content {\n display: block;\n padding: 0;\n}\n.p-box__content > :first-child {\n margin-top: 0;\n}\n.p-box__content > :last-child {\n margin-bottom: 0;\n}\n\n/* #Card\n -------------------------------------------------------------------------- */\n/*doc\n---\ntitle: card\nname: card\ncategories: [project]\n---\n\nカードタイプのコンポーネントです。\n\n```block\n<div class=\"c-layout c-layout--small\">\n <div class=\"c-layout__item u-6of12-md\">\n <div class=\"p-card\">\n <img src=\"http://lorempixel.com/640/340/\" class=\"p-card__image-top\">\n <div class=\"p-card__body\">\n <h2>Card Object</h2>\n <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quaerat illo autem, possimus obcaecati numquam sunt ut quas, repellat cum aspernatur voluptatem, a explicabo! Facilis sed quos, nisi rerum placeat ad?</p>\n </div>\n <ul class=\"p-card__list\">\n <li class=\"p-card__list-item\">list1</li>\n <li class=\"p-card__list-item\">list2</li>\n </ul>\n <div class=\"p-card__foot\">\n <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Impedit, est.</p>\n </div>\n </div>\n </div>\n\n <div class=\"c-layout__item u-6of12-md\">\n <div class=\"p-card\">\n <div class=\"p-card__head\">\n <h2>Card Object</h2>\n <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quaerat illo autem, possimus obcaecati numquam sunt ut quas, repellat cum aspernatur voluptatem, a explicabo! Facilis sed quos, nisi rerum placeat ad?</p>\n </div>\n <ul class=\"p-card__list\">\n <li class=\"p-card__list-item\">list1</li>\n <li class=\"p-card__list-item\">list2</li>\n </ul>\n <img src=\"http://lorempixel.com/640/340/\" class=\"p-card__image-bottom\">\n </div>\n </div>\n</div>\n```\n*/\n.p-card__image,\n.p-card__image-top,\n.p-card__image-bottom {\n max-width: none;\n width: 100%;\n}\n\n.p-card__list {\n margin: 0;\n padding: 0;\n list-style-type: none;\n}\n\n.p-card__list-link {\n display: block;\n}\n\n/* #Form\n -------------------------------------------------------------------------- */\n/*doc\n---\ntitle: form\nname: form\ncategories: [project]\n---\n\nフォーム関係のコンポーネントです。\n\n```block\n```\n*/\n.control-label {\n color: #989898;\n line-height: 1;\n padding: 0 8px;\n margin-left: 12px;\n background: #fff;\n position: relative;\n z-index: 1;\n}\n@media screen and (min-width: 1068px) {\n .control-label {\n padding: 0 11px;\n }\n}\n@media screen and (max-width: 1067px) {\n .control-label {\n font-size: 1.4rem;\n }\n}\n\n.edit-set-file-label {\n color: #93A0A7;\n background-color: #F2F5F7;\n border: 1px dashed #B8C3C9;\n width: 100%;\n height: 50px;\n display: flex;\n align-items: center;\n justify-content: center;\n font-size: 1.4rem;\n font-weight: bold;\n transition: all 0.2s ease-out;\n cursor: pointer;\n}\n@media screen and (min-width: 1068px) {\n .edit-set-file-label:hover {\n opacity: 0.7;\n }\n}\n\n.input-default {\n margin-top: -13px;\n}\n@media screen and (min-width: 1068px) {\n .input-w380 {\n max-width: 380px;\n }\n}\n@media screen and (min-width: 1068px) {\n .input-h56 {\n height: 56px;\n }\n}\n@media screen and (min-width: 1068px) {\n .input-h60 {\n height: 60px;\n }\n}\n\n.textarea-default {\n margin-top: -13px;\n line-height: 1.7;\n padding-top: 17px;\n}\n@media screen and (max-width: 1067px) {\n .textarea-default {\n height: 205px;\n }\n}\n\n@media screen and (max-width: 1067px) {\n .test {\n display: none;\n }\n}\n/* #Login\n -------------------------------------------------------------------------- */\n/*doc\n---\ntitle: login\nname: login\ncategories: [project]\n---\n\nログイン関係のコンポーネントです。\n\n```block\n```\n*/\n.login-panel .links {\n text-align: center;\n padding: 28px 0 0;\n}\n@media screen and (min-width: 1068px) {\n .login-panel .links {\n padding: 32px 0 0;\n }\n}\n.login-panel a:hover, .login-panel a:active, .login-panel a:focus {\n text-decoration: underline;\n}\n.login-submit {\n margin-top: 35px;\n}\n\n.user_remember_me + .login-submit {\n margin-top: 30px;\n}\n\n/* #User\n -------------------------------------------------------------------------- */\n/*doc\n---\ntitle: user\nname: user\ncategories: [project]\n---\n\nユーザー関係のコンポーネントです。\n\n```block\n```\n*/\n.user-advice-btn {\n width: 142px;\n}\n.user-date {\n display: flex;\n align-items: center;\n}\n.user-date span {\n color: #6f7372;\n font-size: 1.24rem;\n letter-spacing: 0.01em;\n}\n@media screen and (min-width: 1068px) {\n .user-date span {\n font-size: 1.4rem;\n }\n}\n.user-date span .date {\n letter-spacing: 0.06em;\n}\n.user-updated-time {\n margin-right: 30px;\n}\n@media screen and (min-width: 1068px) {\n .user-updated-time {\n margin-right: 50px;\n }\n}\n.user-sm {\n display: flex;\n align-items: flex-end;\n justify-content: space-between;\n}\n.user-sm a {\n display: flex;\n align-items: center;\n}\n.user-sm .user-avatar {\n width: 46px;\n height: 46px;\n border-radius: 23px;\n border: 1px solid #f0de00;\n margin-right: 12px;\n}\n@media screen and (min-width: 1068px) {\n .user-sm .user-avatar {\n width: 40px;\n height: 40px;\n border-radius: 20px;\n margin-right: 15px;\n }\n}\n\n/* #Notification\n -------------------------------------------------------------------------- */\n/*doc\n---\ntitle: notification\nname: notification\ncategories: [project]\n---\n\nお知らせアイコンのコンポーネントです。\n\n```block\n```\n*/\n.p-notification {\n padding: 6px 6px 0 0;\n display: block;\n}\n@media screen and (max-width: 1067px) {\n .p-notification {\n position: absolute;\n right: 18px;\n top: 18px;\n z-index: 5;\n }\n}\n.p-notification-icon {\n width: 44px;\n height: 44px;\n position: relative;\n cursor: pointer;\n color: #333333;\n}\n@media screen and (min-width: 1068px) {\n .p-notification-icon {\n width: 48px;\n height: 48px;\n }\n}\n@media screen and (max-width: 374px) {\n .p-notification-icon {\n width: 40px;\n height: 40px;\n }\n}\n.p-notification-icon-wrap .count {\n position: absolute;\n right: -6px;\n top: -6px;\n background-color: #D82828;\n color: white;\n display: flex;\n flex-direction: row;\n -webkit-box-pack: center;\n justify-content: center;\n -webkit-box-align: center;\n align-items: center;\n z-index: 1;\n border-radius: 200px;\n min-width: 18px;\n height: 18px;\n padding: 2px;\n font-size: 1.2rem;\n font-weight: 500;\n line-height: 1;\n}\n@media screen and (min-width: 1068px) {\n .p-notification-icon-wrap .count {\n min-width: 20px;\n height: 20px;\n }\n}\n@media screen and (max-width: 374px) {\n .p-notification-icon-wrap .count {\n min-width: 14px;\n height: 14px;\n font-size: 1rem;\n right: -5px;\n top: -5px;\n }\n}\n.p-notification-icon-wrap .icon {\n width: 21px;\n height: 18px;\n}\n@media screen and (max-width: 374px) {\n .p-notification-icon-wrap .icon {\n width: 18px;\n height: 15px;\n }\n}\n.p-notification-icon-bg {\n width: 100%;\n height: 100%;\n background-color: #F0DE00;\n border-radius: 500px;\n position: absolute;\n top: 0px;\n left: 0px;\n box-shadow: 0 1px 4px rgba(0, 0, 0, 0.1);\n}\n\n/* #Meeting\n -------------------------------------------------------------------------- */\n/*doc\n---\ntitle: meeting\nname: meeting\ncategories: [project]\n---\n\n画像やテキストなどを縦に並べるコンポーネントです。\n\nラベルはデフォルトで右上に配置されます。Modifierで以下のように変更できます。\n\n- 右下 `.p-box__labels--right-bottom`\n- 左上 `.p-box__labels--left-top`\n- 左下 `.p-box__labels--left-bottom`\n\n```block\n```\n*/\n@keyframes show {\n from {\n opacity: 0.1;\n }\n to {\n opacity: 1;\n }\n}\n.meeting-content-wrap {\n display: none;\n}\n.meeting-content-wrap.is-active {\n display: block;\n animation: show 0.15s linear 0s;\n}\n.meeting-head {\n display: flex;\n align-items: flex-end;\n margin-bottom: 7px;\n}\n@media screen and (min-width: 1068px) {\n .meeting-head {\n margin-bottom: 10px;\n }\n}\n@media screen and (max-width: 1067px) {\n .meeting-head {\n width: 100%;\n }\n}\n.meeting-form {\n margin-right: 30px;\n position: relative;\n width: 100%;\n}\n@media screen and (min-width: 1068px) {\n .meeting-form {\n width: 380px;\n }\n}\n@media screen and (max-width: 1067px) {\n .meeting-form {\n margin-bottom: 23px;\n margin-top: -13px;\n }\n}\n.meeting-item {\n border-bottom: 1px solid rgba(36, 77, 138, 0.1);\n position: relative;\n}\n.meeting-item .like-icon {\n position: absolute;\n right: 0;\n top: 55px;\n}\n.meeting-link {\n padding: 18px 60px 22px 0;\n display: block;\n}\n@media screen and (min-width: 1068px) {\n .meeting-link {\n padding: 21px 80px 21px 0;\n }\n}\n@media screen and (max-width: 430px) {\n .meeting-link {\n padding-right: 50px;\n }\n}\n.meeting-ttl {\n font-size: 1.8rem;\n font-weight: bold;\n margin-bottom: 7px;\n line-height: 1.52;\n max-height: 100%;\n}\n@media screen and (max-width: 1067px) {\n .meeting-ttl {\n -webkit-box-orient: vertical;\n -webkit-line-clamp: 1;\n overflow: hidden;\n display: -webkit-box;\n margin-bottom: 7px;\n }\n}\n.meeting-txt {\n font-size: 1.4rem;\n color: #6f7372;\n margin-bottom: 11px;\n line-height: 1.4;\n max-height: 100%;\n}\n@media screen and (max-width: 1067px) {\n .meeting-txt {\n -webkit-box-orient: vertical;\n -webkit-line-clamp: 2;\n overflow: hidden;\n display: -webkit-box;\n }\n}\n.meeting-time {\n margin-bottom: 13px;\n display: block;\n line-height: 1;\n}\n@media screen and (min-width: 1068px) {\n .meeting-time {\n margin-bottom: 16px;\n }\n}\n.meeting-date {\n font-size: 1.3rem;\n color: #6f7372;\n letter-spacing: 0.04em;\n}\n.meeting-member__read {\n margin-left: auto;\n}\n@media screen and (min-width: 1068px) {\n .meeting-member__read {\n display: none;\n }\n}\n.meeting-member__read p {\n color: #989898;\n font-size: 1.4rem;\n}\n.meeting-member-link {\n display: flex;\n align-items: center;\n cursor: pointer;\n transition: all 0.2s ease-out;\n}\n@media screen and (min-width: 1068px) {\n .meeting-member-link:hover {\n opacity: 0.7;\n }\n}\n.meeting-member-count {\n display: table;\n background: #F0DE00;\n border-radius: 6px;\n padding: 2px 11px;\n margin-right: 13px;\n}\n.meeting-member-count li {\n font-size: 1.4rem;\n font-weight: bold;\n display: table-cell;\n}\n.meeting-member-count .numerator {\n position: relative;\n}\n.meeting-member-count .numerator:after {\n display: inline-block;\n content: \"/\";\n font-size: 1.3rem;\n position: relative;\n bottom: 1px;\n padding: 0 0.1rem;\n}\n.meeting-member-list {\n display: flex;\n align-items: center;\n}\n.meeting-member__item:not(:first-child) {\n margin-left: -3px;\n}\n.meeting-member__item a {\n display: block;\n transition: all 0.2s ease-out;\n}\n@media screen and (min-width: 1068px) {\n .meeting-member__item a:hover {\n opacity: 0.8;\n }\n}\n.meeting-member__item .avatar {\n width: 46px;\n height: 46px;\n border-radius: 23px;\n border: 1px solid #F0DE00;\n}\n@media screen and (min-width: 1068px) {\n .meeting-member__item .avatar {\n width: 40px;\n height: 40px;\n border-radius: 20px;\n }\n}\n.meeting-tab {\n background: #F5F7F8;\n height: 56px;\n display: flex;\n align-items: center;\n border-radius: 16px;\n overflow: hidden;\n position: relative;\n}\n@media screen and (min-width: 1068px) {\n .meeting-tab {\n border-radius: 20px;\n }\n}\n@media screen and (max-width: 1067px) {\n .meeting-tab {\n width: 100%;\n }\n}\n@media screen and (min-width: 1068px) {\n .meeting-tab-container {\n padding: 35px 35px 50px;\n }\n}\n.meeting-tab-wrap {\n display: flex;\n flex-wrap: wrap;\n}\n.meeting-tab-wrap .tab-switch {\n display: none;\n}\n.meeting-tab-wrap .tab-label {\n font-weight: 500;\n text-transform: uppercase;\n display: flex;\n align-items: center;\n justify-content: center;\n height: 100%;\n width: 50%;\n position: relative;\n letter-spacing: 0.03em;\n background: #f0f0f0;\n cursor: pointer;\n}\n@media screen and (min-width: 1068px) {\n .meeting-tab-wrap .tab-label {\n width: 190px;\n }\n}\n.meeting-tab-wrap .tab-label.is-active span {\n color: #fff;\n font-weight: bold;\n}\n.meeting-tab-wrap .tab-label span {\n position: relative;\n z-index: 2;\n color: #6f7372;\n max-height: 100%;\n}\n.meeting-tab-wrap .tab-label:first-child:before {\n content: \"\";\n width: 100%;\n height: 100%;\n position: absolute;\n top: 0;\n left: 100%;\n z-index: 1;\n transition: 0.3s ease all;\n background: #000;\n color: #fff;\n border-radius: 16px;\n}\n@media screen and (min-width: 1068px) {\n .meeting-tab-wrap .tab-label:first-child:before {\n width: 190px;\n border-radius: 20px;\n left: 190px;\n }\n}\n.meeting-tab-wrap .tab-label:first-child.is-active:before {\n left: 0px;\n}\n\n.p-meetingAdd-btn {\n width: 64px;\n display: flex;\n}\n@media screen and (min-width: 1068px) {\n .p-meetingAdd-btn {\n width: 181px;\n }\n}\n@media screen and (max-width: 430px) {\n .p-meetingAdd-btn {\n width: 58px;\n }\n}\n@media screen and (max-width: 1067px) {\n .p-meetingAdd-btn {\n position: fixed;\n right: 20px;\n bottom: 76px;\n z-index: 5;\n }\n}\n@media screen and (max-width: 1067px) and (max-width: 430px) {\n .p-meetingAdd-btn {\n bottom: 74px;\n }\n}\n@media screen and (max-width: 1067px) {\n .p-meetingAdd-btn .btn-r8 {\n border-radius: 35px;\n }\n}\n@media screen and (max-width: 1067px) {\n .p-meetingAdd-btn .btn-h48 {\n height: 64px;\n }\n}\n@media screen and (max-width: 1067px) and (max-width: 430px) {\n .p-meetingAdd-btn .btn-h48 {\n height: 58px;\n }\n}\n@media screen and (max-width: 1067px) {\n .p-meetingAdd-btn span {\n display: none;\n }\n}\n.p-consent-btn {\n display: flex;\n width: 64px;\n}\n@media screen and (max-width: 1067px) {\n .p-consent-btn {\n width: 62px;\n position: fixed;\n right: 20px;\n bottom: 72px;\n z-index: 5;\n }\n .p-consent-btn .btn-r8 {\n border-radius: 35px;\n }\n .p-consent-btn .btn-h42 {\n height: 62px;\n }\n .p-consent-btn span {\n font-size: 1.6rem;\n }\n}\n\n.meeting-consent .meeting-item {\n padding: 17px 0 22px;\n}\n@media screen and (min-width: 1068px) {\n .meeting-consent .meeting-item {\n padding: 19px 0 21px;\n }\n}\n.meeting-consent .meeting-link {\n padding: 9px 0 14px;\n}\n@media screen and (min-width: 1068px) {\n .meeting-consent .meeting-link {\n padding: 10px 0 11px;\n }\n}\n.meeting-consent .meeting-txt {\n margin-bottom: 0;\n}\n.meeting-consent .meeting-label {\n background: #EAEFF2;\n width: 120px;\n height: 34px;\n border-radius: 17px;\n display: flex;\n align-items: center;\n justify-content: center;\n font-size: 1.4rem;\n margin-bottom: 12px;\n font-weight: bold;\n}\n.meeting-consent .meeting-search .meeting-head {\n margin-bottom: 14px;\n}\n.meeting-consent .p-article__content .meeting-time {\n margin-bottom: 18px;\n}\n@media screen and (min-width: 1068px) {\n .meeting-consent .p-article__content .meeting-time {\n margin-bottom: 13px;\n }\n}\n.meeting-consent .p-article__context {\n margin-top: 21px;\n}\n.meeting-consent .p-article-single .meeting-ttl {\n margin-bottom: 6px;\n}\n@media screen and (max-width: 1067px) {\n .meeting-consent .p-article-single .meeting-ttl {\n overflow: visible;\n display: block;\n -webkit-line-clamp: auto;\n }\n}\n.meeting-consent .search-item .user-name {\n margin-bottom: 0;\n font-weight: normal;\n}\n\n/* meeting-consent */\n/*\n.meeting-consent{\n .meeting-link{\n padding-right: 0;\n }\n .like-icon{\n display: none;\n }\n}\nいらないかも */\n/* meeting-search */\n@media screen and (max-width: 1067px) {\n .meeting-search .meeting-head {\n display: block;\n }\n}\n\n/* #Article\n -------------------------------------------------------------------------- */\n/*doc\n---\ntitle: article\nname: article\ncategories: [project]\n---\n\n記事に関するコンポーネントです。\n\n```block\n```\n*/\n@media screen and (min-width: 1068px) {\n .p-article-wrap {\n padding: 30px 35px 50px;\n }\n}\n.p-article__content .meeting-member {\n margin-bottom: 15px;\n}\n@media screen and (min-width: 1068px) {\n .p-article__content .meeting-ttl {\n margin-bottom: 3px;\n }\n}\n.p-article__content .meeting-time {\n margin-bottom: 25px;\n}\n.p-article__txt {\n margin-bottom: 15px;\n max-height: 100%;\n}\n.p-article__pdf {\n display: flex;\n justify-content: space-between;\n margin-bottom: 25px;\n}\n.p-article__pdf__btn {\n width: 100%;\n margin-right: 20px;\n}\n.p-article-btn-list {\n display: flex;\n justify-content: space-between;\n padding-bottom: 25px;\n}\n.p-article-btn__item {\n width: 23.5%;\n}\n@media screen and (max-width: 1067px) {\n .p-article-btn__item a {\n font-size: 1.5rem;\n }\n}\n@media screen and (max-width: 1067px) {\n .p-article .meeting-member-count {\n display: none;\n }\n}\n@media screen and (max-width: 1067px) {\n .p-article .meeting-member__item .avatar {\n width: 38px;\n height: 38px;\n }\n}\n@media screen and (max-width: 374px) {\n .p-article .meeting-member__item .avatar {\n width: 30px;\n height: 30px;\n }\n}\n@media screen and (max-width: 1067px) {\n .p-article .meeting-member-link {\n margin-bottom: 20px;\n }\n}\n\n.p-article__context {\n width: 100%;\n}\n\n.p-article__content {\n width: 100%;\n}\n\n.p-file-list {\n margin-bottom: 25px;\n max-width: 700px;\n}\n.p-file-for {\n padding: 50px 0;\n border: 1px solid rgba(36, 77, 138, 0.1);\n border-radius: 6px;\n margin-bottom: 15px;\n}\n@media screen and (min-width: 1068px) {\n .p-file-for {\n padding: 80px 0;\n }\n}\n.p-file-nav {\n display: flex;\n align-items: center;\n overflow-x: auto;\n width: 100%;\n max-width: 100%;\n}\n@media screen and (min-width: 1068px) {\n .p-file-nav {\n max-width: 495px;\n }\n}\n.p-file-nav figure {\n width: calc((100% - 220px) / 3);\n min-width: 54px;\n margin-right: 10px;\n border: 1px solid rgba(36, 77, 138, 0.1);\n transition: all 0.2s ease-out;\n cursor: pointer;\n overflow: hidden;\n position: relative;\n}\n@media screen and (min-width: 1068px) {\n .p-file-nav figure:hover {\n opacity: 0.8;\n }\n}\n.p-file-nav figure:before {\n content: \"\";\n display: block;\n padding-top: 100%;\n}\n.p-file-nav figure img {\n position: absolute;\n width: 100%;\n height: 100%;\n top: 0;\n right: 0;\n bottom: 0;\n left: 0;\n margin: auto;\n -o-object-fit: cover;\n object-fit: cover;\n font-family: \"object-fit: cover;\";\n}\n.p-file-image {\n display: flex;\n flex-wrap: wrap;\n margin: 8px -6px;\n align-items: center;\n justify-content: space-between;\n}\n.p-file-image figure {\n width: calc(20% - 12px);\n overflow: hidden;\n margin: 10px 5px 0;\n border: 1px solid rgba(36, 77, 138, 0.1);\n transition: all 0.2s ease-out;\n position: relative;\n}\n@media screen and (min-width: 1068px) {\n .p-file-image figure:hover {\n opacity: 0.8;\n }\n}\n.p-file-image figure:before {\n content: \"\";\n display: block;\n padding-top: 100%;\n}\n@media screen and (max-width: 1067px) {\n .p-file-image figure:last-child {\n margin-right: auto;\n }\n}\n.p-file-image figure img {\n position: absolute;\n width: 100%;\n height: 100%;\n top: 0;\n right: 0;\n bottom: 0;\n left: 0;\n margin: auto;\n object-fit: cover;\n font-family: \"object-fit: cover;\";\n}\n.p-file-image figure.image-upload {\n cursor: pointer;\n}\n.p-file-image figure.image-upload:after {\n display: block;\n content: \"\";\n width: 22px;\n height: 22px;\n border-radius: 11px;\n background-image: url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 21 21'%3E%3Ccircle cx='10.5' cy='10.5' r='10.5' style='fill:%23d82828'/%3E%3Cline x1='4' y1='10.5' x2='17' y2='10.5' style='fill:none;stroke:%23fff'/%3E%3C/svg%3E\");\n position: absolute;\n right: 2px;\n bottom: 2px;\n box-shadow: 0 0px 4px rgba(0, 0, 0, 0.3);\n}\n@media screen and (max-width: 1067px) {\n .p-file-image figure.image-upload:after {\n width: 18px;\n height: 18px;\n border-radius: 9px;\n }\n}\n\n/* #Modal\n -------------------------------------------------------------------------- */\n/*doc\n---\ntitle: modal\nname: modal\ncategories: [project]\n---\n\nモーダル関係のコンポーネントです。\n\n```block\n```\n*/\n@keyframes show {\n from {\n opacity: 0.1;\n }\n to {\n opacity: 1;\n }\n}\n.modal-area {\n position: fixed;\n z-index: 10;\n top: 0;\n left: 0;\n width: 100%;\n height: 100vh;\n}\n.modal-area.modal01 .modal-wrap {\n padding-bottom: 9px;\n}\n.modal-pd .modal-ttl {\n padding: 0;\n}\n.modal-pd .modal-wrap {\n padding: 30px 20px;\n}\n.modal-bg {\n width: 100%;\n height: 100%;\n background-color: rgba(30, 30, 30, 0.5);\n}\n.modal-wrap {\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n width: 70%;\n background-color: #fff;\n border-radius: 20px;\n max-width: 340px;\n box-sizing: border-box;\n}\n@media screen and (max-width: 1067px) {\n .modal-wrap {\n width: 82%;\n }\n}\n@media screen and (max-width: 374px) {\n .modal-wrap {\n width: 88%;\n }\n}\n.modal-up65 .modal-wrap {\n top: 0px;\n transform: translate(-50%, 65px);\n}\n@media screen and (min-width: 1068px) {\n .modal-up65 .modal-wrap {\n top: 65px;\n }\n}\n.modal-content {\n display: none;\n}\n.modal-content.is-active {\n display: block;\n animation: show 0.15s linear 0s;\n}\n.modal-content-area {\n padding: 19px 25px 27px 20px;\n}\n@media screen and (min-width: 1068px) {\n .modal-content-area {\n padding: 24px 30px 33px 25px;\n }\n}\n.modal-content-item {\n display: flex;\n align-items: center;\n justify-content: space-between;\n}\n.modal-content-item:not(:first-child) {\n margin-top: 23px;\n}\n.modal-content-item .user-wrap a {\n display: flex;\n align-items: center;\n transition: all 0.2s ease-out;\n}\n.modal-content-item .user-avatar {\n min-width: 40px;\n width: 40px;\n height: 40px;\n border-radius: 20px;\n border: 1px solid #f0de00;\n margin-right: 15px;\n}\n.modal-ttl {\n text-align: center;\n padding: 30px 20px 0px;\n}\n@media screen and (max-width: 1067px) {\n .modal-ttl {\n padding-top: 28px;\n }\n}\n.modal-answer {\n display: flex;\n align-items: center;\n justify-content: center;\n width: 84%;\n margin: 0 auto;\n}\n.modal-answer li {\n width: 50%;\n}\n.modal-answer li p, .modal-answer li a {\n font-weight: bold;\n text-align: center;\n display: block;\n padding: 23px 0 30px;\n cursor: pointer;\n transition: all 0.2s ease-out;\n}\n.modal-tab-area {\n display: flex;\n align-items: center;\n justify-content: center;\n border-bottom: 1px solid rgba(36, 77, 138, 0.1);\n}\n.modal-tab-label {\n width: 50%;\n text-align: center;\n cursor: pointer;\n padding: 20px 0 18px;\n}\n.modal-tab-label span {\n color: #6f7372;\n}\n.modal-tab-label.is-active span {\n font-weight: 700;\n color: #000;\n}\n.modal-close-btn {\n position: absolute;\n right: 16px;\n top: 16px;\n cursor: pointer;\n}\n\n.p-notification-btn {\n width: 100%;\n max-width: 62px;\n}\n\n/* #Search\n -------------------------------------------------------------------------- */\n/*doc\n---\ntitle: search\nname: search\ncategories: [project]\n---\n\n検索ページ関係のコンポーネントです。\n\n```block\n```\n*/\n@media screen and (min-width: 1068px) {\n .search-container {\n padding: 10px 32px;\n }\n}\n.search-item:not(:last-child) {\n border-bottom: 1px solid rgba(36, 77, 138, 0.1);\n}\n@media screen and (max-width: 1067px) {\n .search-item:first-child {\n border-top: 1px solid rgba(36, 77, 138, 0.1);\n }\n}\n@media screen and (max-width: 1067px) {\n .search-item:last-child {\n border-bottom: 1px solid rgba(36, 77, 138, 0.1);\n }\n}\n.search-item a {\n display: block;\n padding: 11px 0;\n position: relative;\n}\n@media screen and (min-width: 1068px) {\n .search-item a {\n padding: 15px 0;\n }\n}\n.search-item a:after {\n display: block;\n content: \"\";\n position: absolute;\n left: -32px;\n top: 0;\n width: calc(100% + 64px);\n height: 100%;\n opacity: 0;\n background: #f8f8f8;\n transition: 0.3s;\n z-index: 1;\n}\n.search-item a:hover:after {\n opacity: 1;\n}\n.search-item .user-wrap {\n display: flex;\n align-items: center;\n position: relative;\n z-index: 2;\n}\n.search-item .user-avatar {\n min-width: 60px;\n width: 60px;\n height: 60px;\n border-radius: 30px;\n border: 1px solid #f0de00;\n margin-right: 13px;\n}\n@media screen and (min-width: 1068px) {\n .search-item .user-avatar {\n margin-right: 15px;\n }\n}\n.search-item .user-name {\n font-weight: bold;\n margin-bottom: 6px;\n line-height: 1.3;\n padding-right: 15px;\n}\n.search-item .user-tel {\n font-size: 1.4rem;\n line-height: 1;\n margin-bottom: 2px;\n}\n\n/* #Profile\n -------------------------------------------------------------------------- */\n/*doc\n---\ntitle: profile\nname: profile\ncategories: [project]\n---\n\nプロフィールページ関係のコンポーネントです。\n\n```block\n```\n*/\n.profile-wrap {\n padding: 10px 0 40px;\n}\n@media screen and (min-width: 1068px) {\n .profile-wrap {\n padding: 45px 0 40px;\n }\n}\n.profile-content {\n max-width: 100%;\n margin: 0 auto;\n}\n@media screen and (min-width: 1068px) {\n .profile-content {\n max-width: 380px;\n }\n}\n.profile-thumb {\n margin: 0 auto;\n width: 220px;\n height: 220px;\n border-radius: 110px;\n position: relative;\n}\n.profile-thumb label {\n cursor: pointer;\n}\n.profile-thumb label, .profile-thumb figure {\n display: flex;\n vertical-align: middle;\n text-align: center;\n position: relative;\n overflow: hidden;\n border-radius: 50%;\n width: 220px;\n height: 220px;\n}\n.profile-thumb__image {\n width: 220px;\n height: 220px;\n object-fit: cover;\n font-family: \"object-fit: cover;\";\n}\n.profile-camera {\n width: 52px;\n height: 52px;\n position: absolute;\n bottom: 0;\n right: 0;\n}\n.profile-camera .btn-camera {\n width: 52px;\n height: 52px;\n background-color: #f0de00;\n border-radius: 26px;\n position: relative;\n}\n.profile-camera .btn-camera:hover {\n opacity: 1;\n}\n.profile-camera .btn-camera:hover .icon {\n opacity: 0.6;\n}\n.profile-camera .btn-camera .icon {\n transition: all 0.2s ease-out;\n}\n.profile-camera .btn-camera .icon:after {\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translateX(-50%) translateY(-50%);\n width: 22px;\n height: 18px;\n background-repeat: no-repeat;\n background-position: center center;\n background-size: 100% auto;\n background-image: url(../../assets/img/icon/camera.svg);\n}\n.profile-name {\n font-weight: bold;\n font-size: 2.2rem;\n text-align: center;\n padding: 13px 0 30px;\n letter-spacing: 0.06em;\n}\n@media screen and (min-width: 1068px) {\n .profile-name {\n font-size: 1.8rem;\n padding: 17px 0 25px;\n }\n}\n.profile-info {\n background: #F5F7F8;\n border-radius: 4px;\n margin-bottom: 30px;\n}\n@media screen and (min-width: 1068px) {\n .profile-info {\n margin-bottom: 35px;\n }\n}\n.profile-info__item {\n display: flex;\n align-items: center;\n padding: 15px 20px 15px 15px;\n position: relative;\n}\n@media screen and (min-width: 1068px) {\n .profile-info__item {\n padding: 15px 30px 15px 20px;\n }\n}\n.profile-info__item:not(:first-child) {\n border-top: 1px solid #EAEFF2;\n}\n.profile-info__item .txt {\n margin-left: 35px;\n max-height: 100%;\n}\n.profile-info__item.txt-long .txt {\n padding-bottom: 10px;\n}\n.profile-info__icon {\n -ms-flex-negative: 0;\n flex-shrink: 0;\n width: 22px;\n height: 22px;\n position: absolute;\n top: 50%;\n left: 15px;\n transform: translateY(-50%);\n}\n@media screen and (min-width: 1068px) {\n .profile-info__icon {\n left: 20px;\n }\n}\n\n.p-profile-btn + .p-profile-btn {\n margin-top: 17px;\n}\n.p-profile-btn + .p-profile-txtLink {\n margin-top: 43px;\n}\n@media screen and (min-width: 1068px) {\n .p-profile-btn + .p-profile-txtLink {\n margin-top: 37px;\n }\n}\n\n.p-profile-txtLink {\n text-align: center;\n}\n.p-profile-txtLink .a-icon {\n width: auto;\n}\n.p-profile-txtLink + .p-profile-txtLink {\n margin-top: 7px;\n}\n\n#profile-file-preview {\n width: 220px;\n height: 220px;\n -o-object-fit: cover;\n object-fit: cover;\n border-radius: 110px;\n overflow: hidden;\n border: 1px solid #d0d0d0;\n box-sizing: border-box;\n font-family: \"object-fit: cover;\";\n}\n\n/* #Edit\n -------------------------------------------------------------------------- */\n/*doc\n---\ntitle: edit\nname: edit\ncategories: [project]\n---\n\nエディット関係のコンポーネントです。\n\n```block\n```\n*/\n@media screen and (min-width: 1068px) {\n .edit-wrap {\n padding: 38px 40px 55px;\n }\n}\n.edit-content .btn-user-add {\n margin: 19px auto 0;\n}\n.edit-bg {\n background: #F5F7F8;\n border-radius: 4px;\n padding: 22px 26px 15px;\n margin-top: 18px;\n}\n@media screen and (max-width: 1067px) {\n .edit-bg {\n margin-top: 23px;\n padding: 25px 23px 15px;\n }\n}\n.edit-bg .checkbox {\n margin-bottom: 10px;\n}\n@media screen and (max-width: 1067px) {\n .edit-bg .checkbox {\n margin-bottom: 13px;\n }\n}\n.edit-form .btn-edit {\n margin-top: 35px;\n}\n@media screen and (max-width: 1067px) {\n .edit-form .btn-edit {\n margin-top: 25px;\n font-size: 1.8rem;\n }\n}\n.edit-set {\n position: relative;\n}\n.edit-set:not(:first-child) {\n margin-top: 14px;\n}\n@media screen and (min-width: 1068px) {\n .edit-set:not(:first-child) {\n margin-top: 19px;\n }\n}\n.edit-set-mt5 {\n margin-top: 5px !important;\n}\n@media screen and (max-width: 1067px) {\n .edit-set-mt5 {\n margin-top: 13px !important;\n }\n}\n.edit-set-mt10 {\n margin-top: 10px !important;\n}\n.edit-set-mt15 {\n margin-top: 15px !important;\n}\n.edit-set-bg {\n background: #F5F7F8;\n border-radius: 3px;\n padding: 18px 22px;\n}\n@media screen and (min-width: 1068px) {\n .edit-set-bg {\n padding: 17px 25px;\n }\n}\n.edit-set-file__txt {\n color: #93A0A7;\n font-weight: bold;\n font-size: 1.4rem;\n text-align: center;\n}\n.edit-set.user_remember_me {\n margin-top: 30px;\n margin-bottom: 30px;\n}\n.edit-set.user_remember_me .checkbox {\n text-align: center;\n}\n.edit-set.edit-set-send {\n margin-top: 25px;\n}\n@media screen and (min-width: 1068px) {\n .edit-set.edit-set-send {\n margin-top: 22px;\n }\n}\n.edit-user-wrap {\n margin-top: 38px;\n}\n@media screen and (min-width: 1068px) {\n .edit-user-wrap {\n margin-top: 43px;\n }\n}\n.edit-user-thumb {\n margin: 0 auto;\n width: 128px;\n height: 128px;\n border-radius: 110px;\n position: relative;\n}\n.edit-user-thumb figure {\n display: -webkit-box;\n display: -ms-flexbox;\n display: flex;\n vertical-align: middle;\n text-align: center;\n position: relative;\n overflow: hidden;\n border-radius: 50%;\n}\n.edit-user-thumb__image {\n width: 128px;\n height: 128px;\n object-fit: cover;\n font-family: \"object-fit: cover;\";\n}\n.edit-user-name {\n font-weight: bold;\n font-size: 1.8rem;\n text-align: center;\n padding: 11px 0 0;\n letter-spacing: 0.07em;\n}\n@media screen and (min-width: 1068px) {\n .edit-user-name {\n font-size: 1.4rem;\n padding: 13px 0 0;\n }\n}\n.edit-user-txt {\n text-align: center;\n color: #989898;\n margin-top: 15px;\n}\n@media screen and (min-width: 1068px) {\n .edit-user-txt {\n font-size: 1.4rem;\n }\n}\n.edit-txtLink {\n margin-top: 32px;\n text-align: center;\n}\n.edit-txtLink .a-icon {\n width: auto;\n}\n\n/* バリデーション関係 */\n.validation_error {\n border: 1px solid #e71e14 !important;\n}\n\n.error_area {\n background: #f2eaea;\n border-radius: 4px;\n margin-top: 12px;\n padding: 12px 20px;\n}\n@media screen and (max-width: 1067px) {\n .error_area {\n padding: 12px 18px;\n }\n}\n.error_area.area_top {\n margin-bottom: 30px;\n padding: 15px 20px;\n}\n@media screen and (max-width: 1067px) {\n .error_area.area_top {\n margin-bottom: 25px;\n }\n}\n.error_area p {\n color: #e71e14;\n font-size: 1.5rem;\n}\n@media screen and (max-width: 1067px) {\n .error_area p {\n line-height: 1.5;\n }\n}\n\n.checkbox label {\n letter-spacing: 0.06em;\n}\n.checkbox .label-lsnone {\n letter-spacing: 0;\n}\n\n/* -----------------------------------------------------------------------------\n #Scope\n -------------------------------------------------------------------------- */\n/**\n * ComponentレイヤーやProjectレイヤーのようなコンポーネント単位ではなく、\n * ページ単位や任意の範囲（スコープ）でのスタイルを定義します。1箇所でしか使わないような特異なスタイルや、\n * ページ単位でComponentやProjectレイヤーのスタイルを微調整したい場合に使用してもかまいません。\n * 例えばブログページのスタイルとして_blog.scssを作成します。\n * このレイヤーでは`.s-blog p`のような要素セレクタとの結合子も使うこともできます。\n * もし、このレイヤーで同じパターンが3箇所で使われていたら、\n * ProjectレイヤーやUtilityレイヤーでまとめられないか検討しましょう。\n * プレフィックス（接頭辞）として`s-`をつけます。\n */\n/* #Blog\n -------------------------------------------------------------------------- */\n/**\n * ブログページのスタイルです。\n */\n/* -----------------------------------------------------------------------------\n #Utility\n -------------------------------------------------------------------------- */\n/**\n * Utilityレイヤーはいわゆる汎用クラスで、ほとんどの場合は単一のスタイルをもっています。\n * コンポーネント間の間隔を調整したり、BEMのModifierが増えすぎるのを防ぎます。\n * `.mb10`のような具体的な名前より`.mb-small`のような相対的な名前にしたり、\n * pxよりもemや%で指定することを推奨します。\n * 確実にスタイルを適応させるために`!important`を使用します。\n * プレフィックス（接頭辞）として`u-`をつけます。\n */\n/* -----------------------------------------------------------------------------\n #Text\n -------------------------------------------------------------------------- */\n/*doc\n---\ntitle: text\nname: text\ncategories: [utility]\n---\n\nテキストのスタイルを指定する汎用クラスです。\n\n```block\n<p class=\"u-text-light\">font-weight 300</p>\n<p class=\"u-text-normal\">font-weight 400</p>\n<p class=\"u-text-bold\">font-weight 600</p>\n<p class=\"u-text-indent\">先頭の1文字目を1文字分字下げします。</p>\n<p class=\"u-text-note\">2行目以降の1文字目を1文字分字下げします。<br>2行目以降の1文字目を1文字分字下げします。</p>\n<p class=\"u-text-nowrap\">テキストを折り返させません。横幅を超えても、このテキストは折り返さずに表示されます。</p>\n<p class=\"u-text-breakword\">テキストを折り返させます。長文になっても、このテキストは必ず折り返して表示されます。</p>\n<p class=\"u-text-justify\">テキストを両端揃え（均等割り付け）させます。通常のテキストと文字間が違うのが分かると思います。</p>\n<p class=\"u-text-none\">記述した通りに表示します。</p>\n<p class=\"u-text-lowercase\">abcdEFGH すべての英単語を小文字で表示します。</p>\n<p class=\"u-text-uppercase\">abcdEFGH すべての英単語を大文字で表示します。</p>\n<p class=\"u-text-capitalize\">abcdEFGH 英単語の先頭を大文字で表示します。</p>\n<p class=\"u-text-smallcaps\">abcdEFGH スモールキャップ（小文字と同じ高さで作られた大文字）で表示します。</p>\n<p class=\"u-text-vertical\">abcdEFGH 縦書きで表示します。</p>\n<p class=\"u-text-vertical u-text-vertical--upright\">abcdEFGH 英文も縦書きにする場合はModifierを指定します。</p>\n<p class=\"u-text-right\">text-align right</p>\n<p class=\"u-text-center\">text-align center</p>\n<p class=\"u-text-left\">text-align left</p>\n<p class=\"u-text-top\">vertical-align top</p>\n<p class=\"u-text-middle\">vertical-align middle</p>\n<p class=\"u-text-bottom\">vertical-align bottom</p>\n<p class=\"u-text-baseline\">vertical-align baseline</p>\n```\n*/\n/* font-weightを指定します。 */\n.u-text-light {\n font-weight: 300 !important;\n}\n\n.u-text-normal {\n font-weight: 400 !important;\n}\n\n.u-text-bold {\n font-weight: 700 !important;\n}\n\n/* 先頭の1文字目を1文字分字下げします。 */\n.u-text-indent {\n text-indent: 1em !important;\n}\n\n/* 2行目以降の1文字目を1文字分字下げします。 */\n.u-text-note {\n margin-left: 1em !important;\n text-indent: -1em !important;\n}\n\n/* テキストを改行させません。 */\n.u-text-nowrap {\n white-space: nowrap !important;\n}\n\n/* テキストを改行させます。 */\n.u-text-breakword {\n word-wrap: break-word !important;\n overflow-wrap: break-word !important;\n}\n\n/* テキストを両端揃えさせます。 */\n.u-text-justify {\n text-align: justify !important;\n text-justify: inter-ideograph !important;\n}\n\n/* 記述した通りに表示します。 */\n.u-text-none {\n text-transform: none !important;\n}\n\n/* すべての英単語を小文字にします。 */\n.u-text-lowercase {\n text-transform: lowercase !important;\n}\n\n/* すべての英単語を大文字にします。 */\n.u-text-uppercase {\n text-transform: uppercase !important;\n}\n\n/* 英単語の先頭を大文字にします。 */\n.u-text-capitalize {\n text-transform: capitalize !important;\n}\n\n/* スモールキャップ（小文字と同じ高さで作られた大文字）にします。 */\n.u-text-smallcaps {\n font-variant: small-caps !important;\n}\n\n/* 縦書きにします。 */\n.u-text-vertical {\n writing-mode: vertical-rl !important;\n text-orientation: mixed !important;\n}\n\n/* 英文も縦書きにする場合はModifierを指定します。 */\n.u-text-vertical--upright {\n text-orientation: upright !important;\n}\n\n.u-text-right {\n text-align: right !important;\n}\n\n.u-text-center {\n text-align: center !important;\n}\n\n.u-text-left {\n text-align: left !important;\n}\n\n@media screen and (max-width: 1023px) {\n .u-text_r-lg-c {\n text-align: center !important;\n }\n\n .u-text_r-lg-l {\n text-align: left !important;\n }\n\n .u-text_c-lg-r {\n text-align: right !important;\n }\n\n .u-text_c-lg-l {\n text-align: left !important;\n }\n\n .u-text_l-lg-c {\n text-align: center !important;\n }\n\n .u-text_l-lg-r {\n text-align: right !important;\n }\n}\n@media print, screen and (min-width: 768px) {\n .u-text_r-sm-c {\n text-align: center !important;\n }\n\n .u-text_r-sm-l {\n text-align: left !important;\n }\n\n .u-text_c-sm-r {\n text-align: right !important;\n }\n\n .u-text_c-sm-l {\n text-align: left !important;\n }\n\n .u-text_l-sm-c {\n text-align: center !important;\n }\n\n .u-text_l-sm-r {\n text-align: right !important;\n }\n}\n.u-text-top {\n vertical-align: top !important;\n}\n\n.u-text-middle {\n vertical-align: middle !important;\n}\n\n.u-text-bottom {\n vertical-align: bottom !important;\n}\n\n.u-text-baseline {\n vertical-align: baseline !important;\n}\n\n/* #Align\n -------------------------------------------------------------------------- */\n/*doc\n---\ntitle: align\nname: align\ncategories: [utility]\n---\n\n画像などを左右や中央に配置します。\n\n```block\n<div class=\"c-wrapper\">\n <img src=\"http://lorempixel.com/150/150/\">\n <img src=\"http://lorempixel.com/150/150/\" class=\"u-align-center\">\n <img src=\"http://lorempixel.com/150/150/\" class=\"u-align-right\">\n</div>\n```\n*/\n.u-align-left {\n display: block !important;\n margin-left: 0 !important;\n margin-right: auto !important;\n}\n\n.u-align-center {\n display: block !important;\n margin-right: auto !important;\n margin-left: auto !important;\n}\n\n.u-align-right {\n display: block !important;\n margin-left: auto !important;\n margin-right: 0 !important;\n}\n\n/* #Margin\n -------------------------------------------------------------------------- */\n/*doc\n---\ntitle: margin\nname: margin\ncategories: [utility]\n---\n\nマージンで余白の管理をします。常に下方向にだけ余白をとります。\n`<section>`要素を使うようなセクションの余白はlayout/_section.scssで管理します。\n\n* `.u-mb`は常に余白をとります。\n* `.u-mb-gain`はあるブレイクポイント以上で余白を指定します。\n* `.u-mb-lose`はあるブレイクポイント以上で余白を無くします。\n\n\n```block\n```\n*/\n/* 常に余白を指定するクラス。 */\n.u-mb-auto {\n margin-bottom: auto !important;\n}\n\n.u-mb0 {\n margin-bottom: 0 !important;\n}\n\n.u-mb5 {\n margin-bottom: 5px !important;\n}\n\n.u-mb10 {\n margin-bottom: 10px !important;\n}\n\n.u-mb15 {\n margin-bottom: 15px !important;\n}\n\n.u-mb20 {\n margin-bottom: 20px !important;\n}\n\n.u-mb25 {\n margin-bottom: 25px !important;\n}\n\n.u-mb30 {\n margin-bottom: 30px !important;\n}\n\n.u-mb35 {\n margin-bottom: 35px !important;\n}\n\n.u-mb40 {\n margin-bottom: 40px !important;\n}\n\n.u-mb45 {\n margin-bottom: 45px !important;\n}\n\n.u-mb50 {\n margin-bottom: 50px !important;\n}\n\n.u-mb55 {\n margin-bottom: 55px !important;\n}\n\n.u-mb60 {\n margin-bottom: 60px !important;\n}\n\n.u-mb65 {\n margin-bottom: 65px !important;\n}\n\n.u-mb70 {\n margin-bottom: 70px !important;\n}\n\n.u-mb75 {\n margin-bottom: 75px !important;\n}\n\n.u-mb80 {\n margin-bottom: 80px !important;\n}\n\n.u-mb-small {\n margin-bottom: 0.5em !important;\n}\n@media screen and (min-width: 1068px) {\n .u-mb-small {\n margin-bottom: 1em !important;\n }\n}\n\n/* ブレイクポイント以上 */\n@media screen and (max-width: 1067px) {\n .u-mb0-gain {\n margin-bottom: 0 !important;\n }\n\n .u-mb5-gain {\n margin-bottom: 5px !important;\n }\n\n .u-mb10-gain {\n margin-bottom: 10px !important;\n }\n\n .u-mb15-gain {\n margin-bottom: 15px !important;\n }\n\n .u-mb20-gain {\n margin-bottom: 20px !important;\n }\n\n .u-mb25-gain {\n margin-bottom: 25px !important;\n }\n\n .u-mb30-gain {\n margin-bottom: 30px !important;\n }\n\n .u-mb35-gain {\n margin-bottom: 35px !important;\n }\n\n .u-mb40-gain {\n margin-bottom: 40px !important;\n }\n\n .u-mb45-gain {\n margin-bottom: 45px !important;\n }\n\n .u-mb50-gain {\n margin-bottom: 50px !important;\n }\n\n .u-mb55-gain {\n margin-bottom: 55px !important;\n }\n\n .u-mb60-gain {\n margin-bottom: 60px !important;\n }\n\n .u-mb65-gain {\n margin-bottom: 65px !important;\n }\n\n .u-mb70-gain {\n margin-bottom: 70px !important;\n }\n\n .u-mb75-gain {\n margin-bottom: 75px !important;\n }\n\n .u-mb80-gain {\n margin-bottom: 80px !important;\n }\n}\n/* ブレイクポイント以上 */\n@media screen and (min-width: 1068px) {\n .u-mb0-lose {\n margin-bottom: 0 !important;\n }\n\n .u-mb5-lose {\n margin-bottom: 5px !important;\n }\n\n .u-mb10-lose {\n margin-bottom: 10px !important;\n }\n\n .u-mb15-lose {\n margin-bottom: 15px !important;\n }\n\n .u-mb20-lose {\n margin-bottom: 20px !important;\n }\n\n .u-mb25-lose {\n margin-bottom: 25px !important;\n }\n\n .u-mb30-lose {\n margin-bottom: 30px !important;\n }\n\n .u-mb35-lose {\n margin-bottom: 35px !important;\n }\n\n .u-mb40-lose {\n margin-bottom: 40px !important;\n }\n\n .u-mb45-lose {\n margin-bottom: 45px !important;\n }\n\n .u-mb50-lose {\n margin-bottom: 50px !important;\n }\n\n .u-mb55-lose {\n margin-bottom: 55px !important;\n }\n\n .u-mb60-lose {\n margin-bottom: 60px !important;\n }\n\n .u-mb65-lose {\n margin-bottom: 65px !important;\n }\n\n .u-mb70-lose {\n margin-bottom: 70px !important;\n }\n\n .u-mb75-lose {\n margin-bottom: 75px !important;\n }\n\n .u-mb80-lose {\n margin-bottom: 80px !important;\n }\n}\n/* #Display\n -------------------------------------------------------------------------- */\n/*doc\n---\ntitle: display\nname: display\ncategories: [utility]\n---\n\n表示非表示を切り替えます。改行位置のコントロールもできます。\n\n```block\n<p class=\"u-dn-md\"><code>$-md</code>以降は非表示になります。</p>\n<p class=\"u-dn u-db-md\"><code>$-md</code>以降は表示されます。</p>\n<p>基本はなりゆきでウィンドウサイズが狭くなると、<span class=\"u-dib\">ここから改行されます。</span></p>\n<p><code>$-md</code>以降になると、<span class=\"u-db-md\">ここから改行されます。</span></p>\n```\n*/\n.u-dn {\n display: none !important;\n}\n\n@media screen and (min-width: 400px) {\n .u-dn-sm {\n display: none !important;\n }\n}\n@media screen and (min-width: 768px) {\n .u-dn-md {\n display: none !important;\n }\n}\n@media screen and (min-width: 1000px) {\n .u-dn-lg {\n display: none !important;\n }\n}\n@media screen and (min-width: 1200px) {\n .u-dn-xl {\n display: none !important;\n }\n}\n.u-db {\n display: block !important;\n}\n\n@media screen and (min-width: 400px) {\n .u-db-sm {\n display: block !important;\n }\n}\n@media screen and (min-width: 768px) {\n .u-db-md {\n display: block !important;\n }\n}\n@media screen and (min-width: 1000px) {\n .u-db-lg {\n display: block !important;\n }\n}\n@media screen and (min-width: 1200px) {\n .u-db-xl {\n display: block !important;\n }\n}\n.u-di {\n display: inline !important;\n}\n\n@media screen and (min-width: 400px) {\n .u-di-sm {\n display: inline !important;\n }\n}\n@media screen and (min-width: 768px) {\n .u-di-md {\n display: inline !important;\n }\n}\n@media screen and (min-width: 1000px) {\n .u-di-lg {\n display: inline !important;\n }\n}\n@media screen and (min-width: 1200px) {\n .u-di-xl {\n display: inline !important;\n }\n}\n.u-dib {\n display: inline-block !important;\n}\n\n@media screen and (min-width: 400px) {\n .u-dib-sm {\n display: inline-block !important;\n }\n}\n@media screen and (min-width: 768px) {\n .u-dib-md {\n display: inline-block !important;\n }\n}\n@media screen and (min-width: 1000px) {\n .u-dib-lg {\n display: inline-block !important;\n }\n}\n@media screen and (min-width: 1200px) {\n .u-dib-xl {\n display: inline-block !important;\n }\n}\n/* #Percent\n -------------------------------------------------------------------------- */\n/*doc\n---\ntitle: percent\nname: percent\ncategories: [utility]\n---\n\n`width`プロパティを5%刻みで指定する汎用クラスです。おもに`.c-table--fixed`と一緒に指定します。\n\n```block\n<div class=\"c-wrapper\">\n <table class=\"c-table c-table--medium c-table--fixed\">\n <tr>\n <th class=\"u-percent50\">th1</th>\n <th>th2</th>\n <th>th3</th>\n </tr>\n <tr>\n <td>td1</td>\n <td>td2</td>\n <td>td3</td>\n </tr>\n </table>\n</div>\n```\n*/\n.u-percent5 {\n width: 5% !important;\n}\n\n.u-percent10 {\n width: 10% !important;\n}\n\n.u-percent15 {\n width: 15% !important;\n}\n\n.u-percent20 {\n width: 20% !important;\n}\n\n.u-percent25 {\n width: 25% !important;\n}\n\n.u-percent30 {\n width: 30% !important;\n}\n\n.u-percent35 {\n width: 35% !important;\n}\n\n.u-percent40 {\n width: 40% !important;\n}\n\n.u-percent45 {\n width: 45% !important;\n}\n\n.u-percent50 {\n width: 50% !important;\n}\n\n.u-percent55 {\n width: 55% !important;\n}\n\n.u-percent60 {\n width: 60% !important;\n}\n\n.u-percent65 {\n width: 65% !important;\n}\n\n.u-percent70 {\n width: 70% !important;\n}\n\n.u-percent75 {\n width: 75% !important;\n}\n\n.u-percent80 {\n width: 80% !important;\n}\n\n.u-percent85 {\n width: 85% !important;\n}\n\n.u-percent90 {\n width: 90% !important;\n}\n\n.u-percent95 {\n width: 95% !important;\n}\n\n.u-percent100 {\n width: 100% !important;\n}\n\n/* #Sr-only\n -------------------------------------------------------------------------- */\n/*doc\n---\ntitle: sr-only\nname: sr-only\ncategories: [utility]\n---\n\n要素を非表示にさせますが、スクリーンリーダーには読み上げられます。\n\n```block\n\n```\n*/\n@media screen and (min-width: 1068px) {\n .v-sp,\n.h-pc {\n display: none;\n }\n}\n@media screen and (max-width: 1067px) {\n .v-pc,\n.h-sp {\n display: none;\n }\n}\n@media screen and (min-width: 1024px) {\n .h-md {\n display: none;\n }\n}\n@media screen and (max-width: 1023px) {\n .v-md {\n display: none;\n }\n}\n@media screen and (min-width: 568px) {\n .v-se {\n display: none;\n }\n}\n\n/*# sourceMappingURL=style.css.map */\n","// font-familyを定義しています。WindowsとMacで指定する名前が微妙に変わるので、\n// 半角スペースなどを変更しないようにしてください。\n\n// ## ゴシックとsans-serif\n// 欧文書体は\"Helvetica Neue\"か\"Verdana\"、\n// \"Helvetica Neue\"を指定する場合はWindowsのフォールバックに\"Arial\"か\"Verdana\"、\n// HelveticaはWindowsではArialとして表示される。\n// 和文書体は游ゴシックかヒラギノ角ゴ、游書体はWindowsのChromeで薄く表示される。\n// MS書体はアンチエイリアスが効かないために指定せず、メイリオを指定する。\n\n// 和欧混植、Helvetica優先、游ゴシックなし\n$_font-family-sans-serif-1: \"Helvetica Neue\", Helvetica, \"Hiragino Sans\", \"Hiragino Kaku Gothic ProN\", Meiryo, sans-serif !default;\n// 和欧混植、Helvetica優先、游ゴシック優先\n$_font-family-sans-serif-2: \"Helvetica Neue\", Helvetica, \"游ゴシック\", YuGothic, \"Hiragino Sans\", \"Hiragino Kaku Gothic ProN\", Meiryo, sans-serif !default;\n// 和欧混植、Verdana優先、游ゴシックなし\n$_font-family-sans-serif-3: Verdana, \"Hiragino Sans\", \"Hiragino Kaku Gothic ProN\", Meiryo, sans-serif !default;\n// 和欧混植、游ゴシック優先\n$_font-family-sans-serif-4: YakuHanJP, \"Yu Gothic\", \"游ゴシック\", YuGothic, \"游ゴシック体\", \"Hiragino Kaku Gothic Pro\", \"ヒラギノ角ゴシック Pro\", Meiryo, \"メイリオ\", Osaka, \"ＭＳ Ｐゴシック\", \"MS PGothic\", sans-serif !default;\n// 和文のみ、游ゴシックなし\n$_font-family-sans-serif-5: \"Hiragino Sans\", \"Hiragino Kaku Gothic ProN\", Meiryo, sans-serif !default;\n// 和文のみ、游ゴシック優先\n$_font-family-sans-serif-6: \"游ゴシック\", YuGothic, \"Hiragino Sans\", \"Hiragino Kaku Gothic ProN\", Meiryo, sans-serif !default;\n\n\n// ## 明朝とserif\n// 欧文書体は\"Times New Roman\"か\"Georgia\"。\n// 和文書体は游明朝かヒラギノ明朝、游書体はWindowsのChromeで薄く表示される。\n// 古いWindows用に\"HG明朝E\"（Officeをインストールしていれば使える）、フォールバックとしてメイリオ。\n// \"ＭＳ Ｐ明朝\"はアンチエイリアスが効かないので指定しない。\n// Androidは明朝体に非対応。\n\n// 和欧混植、Times New Roman優先、游明朝なし\n$_font-family-serif-1: \"Times New Roman\", \"Hiragino Mincho ProN\", \"HG明朝E\", Meiryo, serif !default;\n// 和欧混植、Times New Roman優先、游明朝優先\n$_font-family-serif-2: \"Times New Roman\", \"游明朝\", \"YuMincho\", \"Hiragino Mincho ProN\", \"HG明朝E\", Meiryo, serif !default;\n// 和欧混植、Georgia優先、游明朝なし\n$_font-family-serif-3: Georgia, \"Hiragino Mincho ProN\", \"HG明朝E\", Meiryo, serif !default;\n// 和欧混植、Georgia優先、游明朝優先\n$_font-family-serif-4: Georgia, \"游明朝\", \"YuMincho\", \"Hiragino Mincho ProN\", \"HG明朝E\", Meiryo, serif !default;\n// 和欧混植、游明朝優先\n$_font-family-serif-5: YuMinch, \"Yu Mincho\", \"游明朝\", \"Hiragino Mincho ProN W3\", \"ヒラギノ明朝 ProN W3\", \"Hiragino Mincho ProN\", \"HG明朝E\", \"ＭＳ Ｐ明朝\", \"ＭＳ 明朝\", serif !default;\n// 和文のみ、游明朝なし\n$_font-family-serif-6: \"Hiragino Mincho ProN\", \"HG明朝E\", Meiryo, serif !default;\n\n\n// ## 源柔ゴシック\n$_font-family-genju-p: GenJyuuGothic-P, sans-serif; \n.font-genju-p-r {\n font-family: GenJyuuGothic-P, sans-serif;\n font-weight: 400;\n -webkit-font-feature-settings: \"palt\";\n font-feature-settings: \"palt\"\n}\n.font-genju-p-b {\n font-family: GenJyuuGothic-P, sans-serif;\n font-weight: 700;\n -webkit-font-feature-settings: \"palt\";\n font-feature-settings: \"palt\"\n}\n@font-face {\n font-family: GenJyuuGothic-P;\n font-weight: 400;\n src: url(../../assets/fonts/GenJyuuGothic-P/GenJyuuGothic-P-Regular.woff2) format(\"woff2\"), url(../../assets/fonts/GenJyuuGothic-P/GenJyuuGothic-P-Regular.woff) format(\"woff\"), url(../../assets/fonts/GenJyuuGothic-P/GenJyuuGothic-P-Regular.ttf) format(\"TrueType\")\n}\n@font-face {\n font-family: GenJyuuGothic-P;\n font-weight: 700;\n src: url(../../assets/fonts/GenJyuuGothic-P/GenJyuuGothic-P-Bold.woff2) format(\"woff2\"), url(../../assets/fonts/GenJyuuGothic-P/GenJyuuGothic-P-Bold.woff) format(\"woff\"), url(../../assets/fonts/GenJyuuGothic-P/GenJyuuGothic-P-Bold.ttf) format(\"TrueType\")\n}\n\n\n// ## AdobeBlank\n@font-face {\n font-family: AdobeBlank;\n src: url(data:application/font-woff;base64,d09GRk9UVE8AAATUAAkAAAAACkAAAQAAAAAAAAAAAAAAAAAAAAAAAAAAAABDRkYgAAAA4AAAAOcAAAEhIl9jq09TLzIAAAHIAAAARQAAAGBRQK3+Y21hcAAAAhAAAAAmAAAALAAMAFNoZWFkAAACOAAAADAAAAA2BZfPvmhoZWEAAAJoAAAAGgAAACQHWf+LaG10eAAAAoQAAAAIAAAACAPoAYhtYXhwAAACjAAAAAYAAAAGAAJQAG5hbWUAAAKUAAACKwAAB2b3USAEcG9zdAAABMAAAAATAAAAIP+4ADJ42mNkYGFmYGRkFHRMyU9KdcpJzMvWLS5ITE4FCZr8kP4h080j183D+EOW8Ycc0w955h8SLN2/eX7V/GJh7eVRkmF4xS/DyCcow/CeR1WG4TuPCgMbEwMjAxsDH0M4QzpDOUM72GDPlNS8ksySSuf8gsqizPSMEgUFIwNDYx0QaaoAVqIQXFlckppbrOCZl5xfVJBflFiSmqKgkVFSUmClr19eXq6XCFKml5yfq6+ph+5cQnwGBpCzGJhBBJjNyMj1Q4FHbYoMI6tQD4/grxqRHx2iDEwsQFlGsAoGBla+Px18AK/lT1cAeNpjYGZ+wTiBgZWBgamLKYKBgcEbQjPGMRgx3GFABYzIHEcXJ38GBwYFBgXmgv8dDAzMBQwVCfqM/5GUKDAwAAArbQs0AAAAeNpjYGBgZGAGYgYGHgYWBgUgzQKEIL7C//8Q8v9DMJ8BAEreBlwAAHjaY2BkYGAA4vc75S7F89t8ZWBmfgEUYbjo4/oZQf/vYH7BXADkMjMwgUQBcKYMvHjaY2BkYGAu+N/BAAXMLxgYGVABEwBNCALqAAAD6AGIAAAAAAAAUAAAAgAAeNrtkz9r20AYxp+zpZhSCEnpBzgolKQk5/8m2FOSJckUYgi0U2VZtlzbkpAVG2+dSukYQj5Bh36A0KFzpw6dOvXLpI/k1ynNYkq3UB8n/+798zx3JwTgufoOhcXvmHPBChtcLTiHAl4K5xl/LWyRI2EbTbwVXmP8i3CB/I2s8DjT/ylMffVMmPqqKkx91RSmvjoRpr56JUx9dSVMffVR+An5JuXbWzwlf6Wash7R91L9EFbQuZ5wDuu5d8J5xq+ELfKNsI0kt+xdg84fCRfIvvAG+b3wJtbznzLeTH3zn4Xpax0J09fyhelrTYXpa10L09da9tLXfiFMX/tEmL72G2H62h8Ow2geD/p+onWlVK7upM+63u+GHU+355PEG0/0ceCGcRTGTuJ19ZafJFGzWJzNZsZJy4wbjovbJms5GDnBcHcSOa535vUvRk58P3x/fe7Fk0EY6LIp1eqt07aAHyZuGEzTldmrtMbO0AuTnhkNOhVTN41qrdRYpfxwT7ZqjUOE/MrmiDFAHz4SaI4KSiijip07rpP20WV1Bx65zZ4Jqz2M+a/57QVwmY2plj6dLNdlZitTTRhvosgxy4ZhxVLNZJ1j5rbJv10OMGJVgCF26RGRXUbPOPu4yHLxyupV+XPOmOsBqwLutswdlFDjeVs45Sn/jPisSrLdBpje5Qz2eEstnsChupfV9BgdUbXDjGGvQYP3WWN145/3/Hc39P8NP/A3/AvEJ2JBAHjaY2BmAIP/WxmMGLAAACzCAeoA) format(\"woff\")\n}\n\n\n// ## Yaku Han JP\n@font-face {\n font-family: YakuHanJP;\n font-weight: 100;\n src: url(../../assets/fonts/YakuHanJP/YakuHanJP-Thin.woff2) format(\"woff2\"), url(../../assets/fonts/YakuHanJP/YakuHanJP-Thin.woff) format(\"woff\"), url(../../assets/fonts/YakuHanJP/YakuHanJP-Thin.eot)\n}\n@font-face {\n font-family: YakuHanJP;\n font-weight: 200;\n src: url(../../assets/fonts/YakuHanJP/YakuHanJP-Light.woff2) format(\"woff2\"), url(../../assets/fonts/YakuHanJP/YakuHanJP-Light.woff) format(\"woff\"), url(../../assets/fonts/YakuHanJP/YakuHanJP-Light.eot)\n}\n@font-face {\n font-family: YakuHanJP;\n font-weight: 300;\n src: url(../../assets/fonts/YakuHanJP/YakuHanJP-DemiLight.woff2) format(\"woff2\"), url(../../assets/fonts/YakuHanJP/YakuHanJP-DemiLight.woff) format(\"woff\"), url(../../assets/fonts/YakuHanJP/YakuHanJP-DemiLight.eot)\n}\n@font-face {\n font-family: YakuHanJP;\n font-weight: 400;\n src: url(../../assets/fonts/YakuHanJP/YakuHanJP-Regular.woff2) format(\"woff2\"), url(../../assets/fonts/YakuHanJP/YakuHanJP-Regular.woff) format(\"woff\"), url(../../assets/fonts/YakuHanJP/YakuHanJP-Regular.eot)\n}\n@font-face {\n font-family: YakuHanJP;\n font-weight: 500;\n src: url(../../assets/fonts/YakuHanJP/YakuHanJP-Medium.woff2) format(\"woff2\"), url(../../assets/fonts/YakuHanJP/YakuHanJP-Medium.woff) format(\"woff\"), url(../../assets/fonts/YakuHanJP/YakuHanJP-Medium.eot)\n}\n@font-face {\n font-family: YakuHanJP;\n font-weight: 700;\n src: url(../../assets/fonts/YakuHanJP/YakuHanJP-Bold.woff2) format(\"woff2\"), url(../../assets/fonts/YakuHanJP/YakuHanJP-Bold.woff) format(\"woff\"), url(../../assets/fonts/YakuHanJP/YakuHanJP-Bold.eot)\n}\n@font-face {\n font-family: YakuHanJP;\n font-weight: 900;\n src: url(../../assets/fonts/YakuHanJP/YakuHanJP-Black.woff2) format(\"woff2\"), url(../../assets/fonts/YakuHanJP/YakuHanJP-Black.woff) format(\"woff\"), url(../../assets/fonts/YakuHanJP/YakuHanJP-Black.eot)\n}\n\n\n// ## Macで追加できるフォント\n// ヒラギノ丸ゴ→ \"ヒラギノ丸ゴ ProN\", \"Hiragino Maru Gothic ProN\"\n// EL Captainで追加されたフォント。\n// 筑紫丸Aゴシック→ \"TsukuARdGothic-Regular\"（ふところを絞ったデザインの丸ゴシック体で和風、落ち着いた印象）\n// 筑紫丸Bゴシック→ \"TsukuBRdGothic-Regular\"（筑紫丸Aゴシックよりも特徴がある）\n// クレー→ \"Klee\"（鉛筆やペンのような手書き風で本文組みに適した書体）\n// ヒラギノ角ゴシック→ \"Hiragino Sans\"（ヒラギノ角ゴに10種類のウェイトを追加）\n// 游明朝体+36ポかな→ \"YuMin_36pKn-Medium\"（毛筆表現のある游明朝体で漢字と英数字は含んでいない）\n// San Francisco→ -apple-system\n\n// 主要なフォント。\n// 游ゴシック Windows8.1以降、MacOS10.9以降\n// 游明朝 Windows8.1以降、MacOS10.9以降\n// メイリオ Windows Vista以降\n// ヒラギノ角ゴ ProN Mac OS 10.5以降、iOS\n// ヒラギノ明朝 ProN Mac OS 10.5以降、iOS6以降\n// Droid Sans Android\n// Roboto Android4以降\n\n// WindowsとMacでの共通フォント。\n// Arial\n// Arial Black\n// Comic Sans MS\n// Courier\n// Courier New\n// Georgia\n// Impact\n// Times New Roman\n// Trebuchet MS\n// Verdana\n\n// ブラウザのデフォルトフォント\n// Safari 7 / Mac 10.9 Helvetica / ヒラギノ角ゴシック ProN\n// Firefox 25 / Mac 10.9 ヒラギノ角ゴシック ProN\n// Chrome 30 / Mac 10.9 ヒラギノ角ゴシック ProN\n// IE 11 / Win 8.1 メイリオ\n// IE 8 / Win 7 Arial / ＭＳ Ｐゴシック\n// Firefox 25 / Win 8.1 ＭＳ Ｐゴシック\n// Chrome 30 / Win 8.1 ＭＳ Ｐゴシック\n\n// Androidについて\n// * 明朝体には対応していない\n// * 4.0以降ではRobotoとモトヤフォントがデフォルト、それ以前はDroid Sans（Droid Sans Japaneseも含む）\n// * HelveticaかArialを指定するとブラウザ側でDroid Sansがエイリアスとして表示される\n","/* #Normalize.css\n -------------------------------------------------------------------------- */\n\n/*! normalize.css v3.0.3 | MIT License | github.com/necolas/normalize.css */\n\n/**\n * 1. Set default font family to sans-serif.\n * 2. Prevent iOS and IE text size adjust after device orientation change,\n * without disabling user zoom.\n */\n\nhtml {\n font-family: sans-serif; /* 1 */\n -ms-text-size-adjust: 100%; /* 2 */\n -webkit-text-size-adjust: 100%; /* 2 */\n}\n\n/**\n * Remove default margin.\n */\n\nbody {\n margin: 0;\n}\n\n/* HTML5 display definitions\n ========================================================================== */\n\n/**\n * Correct `block` display not defined for any HTML5 element in IE 8/9.\n * Correct `block` display not defined for `details` or `summary` in IE 10/11\n * and Firefox.\n * Correct `block` display not defined for `main` in IE 11.\n */\n\narticle,\naside,\ndetails,\nfigcaption,\nfigure,\nfooter,\nheader,\nhgroup,\nmain,\nmenu,\nnav,\nsection,\nsummary {\n display: block;\n}\n\n/**\n * 1. Correct `inline-block` display not defined in IE 8/9.\n * 2. Normalize vertical alignment of `progress` in Chrome, Firefox, and Opera.\n */\n\naudio,\ncanvas,\nprogress,\nvideo {\n display: inline-block; /* 1 */\n vertical-align: baseline; /* 2 */\n}\n\n/**\n * Prevent modern browsers from displaying `audio` without controls.\n * Remove excess height in iOS 5 devices.\n */\n\naudio:not([controls]) {\n display: none;\n height: 0;\n}\n\n/**\n * Address `[hidden]` styling not present in IE 8/9/10.\n * Hide the `template` element in IE 8/9/10/11, Safari, and Firefox < 22.\n */\n\n[hidden],\ntemplate {\n display: none;\n}\n\n/* Links\n ========================================================================== */\n\n/**\n * Remove the gray background color from active links in IE 10.\n */\n\na {\n background-color: transparent;\n}\n\n/**\n * Improve readability of focused elements when they are also in an\n * active/hover state.\n */\n\na:active,\na:hover {\n outline: 0;\n}\n\n/* Text-level semantics\n ========================================================================== */\n\n/**\n * Address styling not present in IE 8/9/10/11, Safari, and Chrome.\n */\n\nabbr[title] {\n border-bottom: 1px dotted;\n}\n\n/**\n * Address style set to `bolder` in Firefox 4+, Safari, and Chrome.\n */\n\nb,\nstrong {\n font-weight: bold;\n}\n\n/**\n * Address styling not present in Safari and Chrome.\n */\n\ndfn {\n font-style: italic;\n}\n\n/**\n * Address variable `h1` font-size and margin within `section` and `article`\n * contexts in Firefox 4+, Safari, and Chrome.\n */\n\nh1 {\n font-size: 2em;\n margin: 0.67em 0;\n}\n\n/**\n * Address styling not present in IE 8/9.\n */\n\nmark {\n background: #ff0;\n color: #000;\n}\n\n/**\n * Address inconsistent and variable font size in all browsers.\n */\n\nsmall {\n font-size: 80%;\n}\n\n/**\n * Prevent `sub` and `sup` affecting `line-height` in all browsers.\n */\n\nsub,\nsup {\n font-size: 75%;\n line-height: 0;\n position: relative;\n vertical-align: baseline;\n}\n\nsup {\n top: -0.5em;\n}\n\nsub {\n bottom: -0.25em;\n}\n\n/* Embedded content\n ========================================================================== */\n\n/**\n * Remove border when inside `a` element in IE 8/9/10.\n */\n\nimg {\n border: 0;\n}\n\n/**\n * Correct overflow not hidden in IE 9/10/11.\n */\n\nsvg:not(:root) {\n overflow: hidden;\n}\n\n/* Grouping content\n ========================================================================== */\n\n/**\n * Address margin not present in IE 8/9 and Safari.\n */\n\nfigure {\n margin: 1em 40px;\n}\n\n/**\n * Address differences between Firefox and other browsers.\n */\n\nhr {\n box-sizing: content-box;\n height: 0;\n}\n\n/**\n * Contain overflow in all browsers.\n */\n\npre {\n overflow: auto;\n}\n\n/**\n * Address odd `em`-unit font size rendering in all browsers.\n */\n\ncode,\nkbd,\npre,\nsamp {\n font-family: monospace, monospace;\n font-size: 1em;\n}\n\n/* Forms\n ========================================================================== */\n\n/**\n * Known limitation: by default, Chrome and Safari on OS X allow very limited\n * styling of `select`, unless a `border` property is set.\n */\n\n/**\n * 1. Correct color not being inherited.\n * Known issue: affects color of disabled elements.\n * 2. Correct font properties not being inherited.\n * 3. Address margins set differently in Firefox 4+, Safari, and Chrome.\n */\n\nbutton,\ninput,\noptgroup,\nselect,\ntextarea {\n color: inherit; /* 1 */\n font: inherit; /* 2 */\n margin: 0; /* 3 */\n}\n\n/**\n * Address `overflow` set to `hidden` in IE 8/9/10/11.\n */\n\nbutton {\n overflow: visible;\n}\n\n/**\n * Address inconsistent `text-transform` inheritance for `button` and `select`.\n * All other form control elements do not inherit `text-transform` values.\n * Correct `button` style inheritance in Firefox, IE 8/9/10/11, and Opera.\n * Correct `select` style inheritance in Firefox.\n */\n\nbutton,\nselect {\n text-transform: none;\n}\n\n/**\n * 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio`\n * and `video` controls.\n * 2. Correct inability to style clickable `input` types in iOS.\n * 3. Improve usability and consistency of cursor style between image-type\n * `input` and others.\n */\n\nbutton,\nhtml input[type=\"button\"], /* 1 */\ninput[type=\"reset\"],\ninput[type=\"submit\"] {\n -webkit-appearance: button; /* 2 */\n cursor: pointer; /* 3 */\n}\n\n/**\n * Re-set default cursor for disabled elements.\n */\n\nbutton[disabled],\nhtml input[disabled] {\n cursor: default;\n}\n\n/**\n * Remove inner padding and border in Firefox 4+.\n */\n\nbutton::-moz-focus-inner,\ninput::-moz-focus-inner {\n border: 0;\n padding: 0;\n}\n\n/**\n * Address Firefox 4+ setting `line-height` on `input` using `!important` in\n * the UA stylesheet.\n */\n\ninput {\n line-height: normal;\n}\n\n/**\n * It's recommended that you don't attempt to style these elements.\n * Firefox's implementation doesn't respect box-sizing, padding, or width.\n *\n * 1. Address box sizing set to `content-box` in IE 8/9/10.\n * 2. Remove excess padding in IE 8/9/10.\n */\n\ninput[type=\"checkbox\"],\ninput[type=\"radio\"] {\n box-sizing: border-box; /* 1 */\n padding: 0; /* 2 */\n}\n\n/**\n * Fix the cursor style for Chrome's increment/decrement buttons. For certain\n * `font-size` values of the `input`, it causes the cursor style of the\n * decrement button to change from `default` to `text`.\n */\n\ninput[type=\"number\"]::-webkit-inner-spin-button,\ninput[type=\"number\"]::-webkit-outer-spin-button {\n height: auto;\n}\n\n/**\n * 1. Address `appearance` set to `searchfield` in Safari and Chrome.\n * 2. Address `box-sizing` set to `border-box` in Safari and Chrome.\n */\n\ninput[type=\"search\"] {\n -webkit-appearance: textfield; /* 1 */\n box-sizing: content-box; /* 2 */\n}\n\n/**\n * Remove inner padding and search cancel button in Safari and Chrome on OS X.\n * Safari (but not Chrome) clips the cancel button when the search input has\n * padding (and `textfield` appearance).\n */\n\ninput[type=\"search\"]::-webkit-search-cancel-button,\ninput[type=\"search\"]::-webkit-search-decoration {\n -webkit-appearance: none;\n}\n\n/**\n * Define consistent border, margin, and padding.\n */\n\nfieldset {\n border: 1px solid #c0c0c0;\n margin: 0 2px;\n padding: 0.35em 0.625em 0.75em;\n}\n\n/**\n * 1. Correct `color` not being inherited in IE 8/9/10/11.\n * 2. Remove padding so people aren't caught out if they zero out fieldsets.\n */\n\nlegend {\n border: 0; /* 1 */\n padding: 0; /* 2 */\n}\n\n/**\n * Remove default vertical scrollbar in IE 8/9/10/11.\n */\n\ntextarea {\n overflow: auto;\n}\n\n/**\n * Don't inherit the `font-weight` (applied by a rule above).\n * NOTE: the default cannot safely be changed in Chrome and Safari on OS X.\n */\n\noptgroup {\n font-weight: bold;\n}\n\n/* Tables\n ========================================================================== */\n\n/**\n * Remove most spacing between table cells.\n */\n\ntable {\n border-collapse: collapse;\n border-spacing: 0;\n}\n\ntd,\nth {\n padding: 0;\n}","/* #Reset.css\n -------------------------------------------------------------------------- */\n\n/*\nhtml5doctor.com Reset Stylesheet\nv1.6.1\nLast Updated: 2010-09-17\nAuthor: Richard Clark - http://richclarkdesign.com\nTwitter: @rich_clark\n*/\n\nhtml, body, div, span, object, iframe,\nh1, h2, h3, h4, h5, h6, p, blockquote, pre,\nabbr, address, cite, code,\ndel, dfn, em, img, ins, kbd, q, samp,\nsmall, strong, sub, sup, var,\nb, i,\ndl, dt, dd, ol, ul, li,\nfieldset, form, label, legend,\ntable, caption, tbody, tfoot, thead, tr, th, td,\narticle, aside, canvas, details, figcaption, figure,\nfooter, header, hgroup, menu, nav, section, summary,\ntime, mark, audio, video {\n margin:0;\n padding:0;\n border:0;\n outline:0;\n font-size:100%;\n vertical-align:baseline;\n background:transparent;\n}\n\nbody {\n line-height:1;\n}\n\narticle,aside,details,figcaption,figure,\nfooter,header,hgroup,menu,nav,section {\n display:block;\n}\n\nnav ul {\n list-style:none;\n}\n\nblockquote, q {\n quotes:none;\n}\n\nblockquote:before, blockquote:after,\nq:before, q:after {\n content:'';\n content:none;\n}\n\na {\n margin:0;\n padding:0;\n font-size:100%;\n vertical-align:baseline;\n background:transparent;\n}\n\n/* change colours to suit your needs */\nins {\n background-color:#ff9;\n color:#000;\n text-decoration:none;\n}\n\n/* change colours to suit your needs */\nmark {\n background-color:#ff9;\n color:#000;\n font-style:italic;\n font-weight:bold;\n}\n\ndel {\n text-decoration: line-through;\n}\n\nabbr[title], dfn[title] {\n border-bottom:1px dotted;\n cursor:help;\n}\n\ntable {\n border-collapse:collapse;\n border-spacing:0;\n}\n\n/* change border colour to suit your needs */\nhr {\n display:block;\n height:1px;\n border:0; \n border-top:1px solid #cccccc;\n margin:1em 0;\n padding:0;\n}\n\ninput, select {\n vertical-align:middle;\n}"," /* #Main\n -------------------------------------------------------------------------- */\n/*doc\n---\ntitle: main\nname: main\ncategories: [layout]\n---\n\n`<main>`タグのスタイルです。ドキュメントのメインコンテンツを示し、ドキュメント内で1つしか記述できません。\n<article>タグや<nav>タグなどの中に入れることはできません。\n\n取り扱いの難しいタグなので、使わないという選択をするのもいいでしょう。\n\n```block\n<body>\n <main id=\"l-main\">\n </main>\n</body>\n```\n*/\n\n.l-centeringbox{\n width: 100%;\n height: 100%;\n &-wrap{\n position: absolute;\n top: 0;\n left: 50%;\n transform: translate(-50%,0);\n width: 100%;\n border-radius: 20px;\n box-sizing: border-box;\n @include pc{\n padding: 192px 0;\n }\n }\n}\n.l-container{\n display: flex;\n flex-flow: row-reverse;\n background: #fff;\n justify-content: flex-end;\n @include pc{\n background: $_color-bg02;\n }\n}\n.l-single {\n &-main{\n min-height: 100vh; /* Fallback */\n min-height: calc(var(--vh, 1vh) * 100);\n }\n &-container{\n max-width: 540px;\n width: 100%;\n margin: 0 auto;\n border-radius: 8px;\n padding: 50px 24px 70px;\n background: #fff;\n box-sizing: border-box;\n display: block;\n @include pc{\n width: 540px;\n max-width: none;\n box-shadow: 0 1px 4px #dddddd;\n padding: 60px 60px 60px;\n }\n h1{\n font-size: 3rem;\n text-align: center;\n margin-bottom: 35px;\n line-height: 1;\n @include pc{\n margin-bottom: 35px;\n font-size: 2.8rem;\n }\n @include sp{\n letter-spacing: 0.02em;\n }\n @include min{\n font-size: 2.8rem;\n }\n }\n }\n &-inner{\n width: 100%;\n margin: 0 auto;\n width: 410px;\n @include sp02{\n width: 100%;\n }\n .form-group{\n margin: 0 0 17px;\n @include pc{\n margin: 0 0 20px;\n }\n }\n }\n}\n.l-registration{\n .l-single-container h1{\n @include pc{\n margin-bottom: 40px;\n }\n }\n}"," /* #Content\n -------------------------------------------------------------------------- */\n/*doc\n---\ntitle: content\nname: content\ncategories: [layout]\n---\n\n`<article>`タグが使われるようなメインコンテンツのスタイルです。\nナビゲーションやバナーなどのレイアウトを含むことはできますが、\nコンポーネント自体はobject/projectレイヤーで定義します。\n\n```block\n<body>\n <article class=\"l-content s-blog\">\n <header class=\"l-content__lead\"></header>\n </article>\n</body>\n```\n*/\n.l-content {\n width: 100%;\n margin: 30px auto 0;\n padding: 0 20px;\n @include pc{\n margin: 25px 0 0 240px;\n padding: 0 32px;\n }\n @include sp{\n padding-bottom: 130px;\n max-width: 700px;\n box-sizing: border-box;\n }\n @include sp02{\n padding-bottom: 110px;\n }\n &-wrap{\n margin: 0 auto;\n box-sizing: border-box;\n @include pc{\n max-width: 1064px;\n -webkit-box-shadow: 0 1px 4px #ddd;\n box-shadow: 0 1px 4px #ddd;\n margin-bottom: 40px;\n border-radius: 8px;\n background: #fff;\n }\n }\n &__ttl{\n display: flex;\n flex-wrap: wrap;\n align-items: center;\n justify-content: center;\n margin: 0 auto 35px;\n @include pc{\n max-width: 1064px;\n justify-content: space-between;\n margin: 0 auto 25px;\n }\n @include sp02{\n margin: 0 auto 30px\n }\n &__left{\n display: flex;\n flex-wrap: wrap;\n align-items: center;\n }\n h2{\n font-size: 2.4rem;\n font-weight: bold;\n @include pc{\n margin-right: 30px;\n font-size: 3rem;\n }\n @include sp{\n letter-spacing: 0.04em;\n }\n @include min{\n font-size: 2rem;\n }\n }\n }\n &-w560{\n margin: 0 auto;\n width: 100%;\n @include pc{\n max-width: 560px;\n }\n }\n}\n"," /* #Side\n -------------------------------------------------------------------------- */\n/*doc\n---\ntitle: side\nname: side\ncategories: [layout]\n---\n\n`<aside>`タグが使われるようなサイドバーのスタイルです。\nナビゲーションやバナーなどのレイアウトを含むことはできますが、\nコンポーネント自体はobject/projectレイヤーで定義します。\n\n```block\n<body>\n <article class=\"l-content\"></article>\n <aside class=\"l-side\">\n <div class=\"l-side__item\">\n <ul class=\"p-side-nav\"></ul>\n </div>\n <div class=\"l-side__item\">\n <div class=\"p-banner\"></div>\n </div>\n </aside>\n</body>\n```\n*/\n\n.l-side {\n position: fixed;\n left: 0;\n overflow-x: auto;\n -ms-overflow-style: -ms-autohiding-scrollbar;\n -webkit-overflow-scrolling: touch;\n background: #000000;\n z-index: 3;\n width: calc(100% -20px);\n height: 54px;\n @include pc{\n height: 100vh;\n width: 240px;\n }\n @include sp{\n display: flex;\n align-items: center;\n justify-content: center;\n left: 7px;\n right: 7px;\n bottom: 7px;\n border-radius: 12px;\n width: calc(100% - 14px);\n }\n &-logo{\n line-height: 1;\n margin: 35px auto;\n @include pc{\n width: 38px;\n }\n @include sp{\n display: none;\n }\n a{\n display: block;\n line-height: 1;\n }\n }\n}\n\n.mypage-nav{\n @include sp{\n width: 100%;\n height: 100%;\n }\n &-list{\n @include sp{\n display: flex;\n align-items: center;\n justify-content: space-between;\n height: 100%;\n padding: 0 7px;\n }\n &__item{\n display: flex;\n align-items: center;\n &.nav-active{\n @include pc{\n a{\n background: $_color-ui-yellow;\n color: #000;\n &:hover{\n opacity: 1;\n }\n }\n }\n .prof-wrap{\n border: 1px solid $_color-ui-yellow;\n }\n &.-profile{\n .prof-wrap{\n border: 1px solid #ccc;\n }\n }\n .icon{\n &.meeting{\n &:before{\n background-image: url(../../assets/img/icon/list-yellow.svg);\n @include pc{\n background-image: url(../../assets/img/icon/list-black.svg);\n }\n }\n }\n &.star{\n &:before{\n @include sp{\n background-image: url(../../assets/img/icon/star-outline-yellow02.svg);\n }\n }\n }\n &.parents{\n &:before{\n background-image: url(../../assets/img/icon/people-yellow.svg);\n @include pc{\n background-image: url(../../assets/img/icon/people-black.svg);\n }\n }\n }\n &.search{\n &:before{\n background-image: url(../../assets/img/icon/search-yellow.svg);\n @include pc{\n background-image: url(../../assets/img/icon/search-black.svg);\n }\n }\n }\n &.log-out{\n &:before{\n background-image: url(../../assets/img/icon/log-out-yellow.svg);\n @include pc{\n background-image: url(../../assets/img/icon/log-out-black.svg);\n }\n }\n }\n }\n }\n @include sp{\n width: 20%;\n height: 100%;\n }\n &.-logout{\n @include sp{\n display: none;\n }\n }\n &.-favorite{\n @include pc{\n display: none;\n }\n }\n a{\n display: flex;\n align-items: center;\n width: 100%;\n color: #ccc;\n line-height: 1.5;\n font-weight: bold;\n word-break: break-all;\n transition: all .25s ease-out;\n text-decoration: none;\n @include pc{\n padding: 13px 1.2em;\n &:hover{\n opacity: 0.6;\n }\n }\n @include sp{\n justify-content: center;\n box-sizing: border-box;\n height: 100%;\n }\n span{\n @include sp{\n display: none;\n }\n }\n }\n .icon{\n width: 29px;\n height: 29px;\n position: relative;\n @include pc{\n margin-right: 13px;\n transition: all .25s ease-out;\n width: 24px;\n height: 24px;\n }\n &:before{\n content: \"\";\n position: absolute;\n width: 100%;\n height: 100%;\n display: inline-block;\n background-repeat: no-repeat;\n background-position: 50%;\n background-size: 100%;\n }\n &.meeting{\n &:before{\n background-image: url(../../assets/img/icon/list-gray.svg) ;\n }\n }\n &.star{\n &:before{\n background-image: url(../../assets/img/icon/star-outline-gray02.svg);\n }\n }\n &.search{\n &:before{\n background-image: url(../../assets/img/icon/search-gray.svg);\n }\n }\n &.parents{\n &:before{\n background-image: url(../../assets/img/icon/people-gray.svg);\n }\n }\n &.log-out{\n &:before{\n background-image: url(../../assets/img/icon/log-out-gray.svg);\n }\n }\n }\n }\n &__link{\n &.user-icon{\n figure{\n display: flex;\n align-items: center;\n justify-content: center;\n @include pc{\n margin-right: 13px;\n width: 24px;\n height: 24px;\n }\n .prof-wrap{ \n width: 18px;\n height: 18px;\n border: 1px solid #ccc;\n border-radius: 50%;\n overflow: hidden;\n @include sp{\n width: 28px;\n height: 28px;\n }\n }\n }\n }\n }\n }\n}"," /* #Wrapper\n -------------------------------------------------------------------------- */\n/*doc\n---\ntitle: wrapper\nname: wrapper\ncategories: [component]\n---\n\n横幅を制限するオブジェクトです。\n\nModifierは以下のとおりです。\n\n* 左右の余白を追加 `--small`, `--medium`, `--large`\n\n```block\n```\n*/\n\n.c-wrapper {\n width: 100%;\n max-width: $_max-width;\n margin-right: auto;\n margin-left: auto;\n}\n\n","// default breakpoint\n$_default-breakpoint: 'md';\n\n// default wrapper width\n$_max-width: 960px !default;\n\n// default grid columns\n$_column: 12 !default;\n\n// base font-size\n$_font-size: (\n 'sm': 15px,\n 'md': 16px,\n) !default;\n\n$_font-size--large: 16px !default;\n$_font-size--small: 0.8em !default;\n\n// base font-weight\n$_font-weight-light: 300;\n$_font-weight-normal: 400;\n$_font-weight-regular: 400;\n$_font-weight-medium: 500;\n$_font-weight-semibold: 600;\n$_font-weight-bold: 700;\n$_font-weight-extrabold: 800;\n$_font-weight-heavy: 900;\n\n// base Rounded corners\n$_radius: 3px !default;\n\n// base animation speed\n$_duration: 0.3s !default;\n\n// base spacing\n$_white-space: 1.7rem !default;\n$_white-space--small: ($_white-space / 2) !default;\n$_white-space--large: ($_white-space * 2) !default;\n"," /* #Layout\n -------------------------------------------------------------------------- */\n/*doc\n---\ntitle: layout\nname: layout\ncategories: [component]\n---\n\n汎用的なレイアウトオブジェクトです。`width`の変更はUtilityレイヤーで指定します。\n\nModifierは以下のとおりです。\n\n* ガターの追加 `--small`, `--medium`, `--large`\n* text-alignの変更 `--middle`, `--bottom`\n* 配置を反転 `--reverse`\n* `.c-layout__item`のカラム幅をまとめて指定 `--colx`, `--colxandx`\n\n```block\n<div class=\"c-wrapper\">\n <div class=\"c-layout c-layout--medium\" style=\"margin-bottom:1rem;\">\n <div class=\"c-layout__item u-8of12-md\"><div style=\"background-color:lightblue;\">c-layout__item u-8of12-md</div></div>\n <div class=\"c-layout__item u-4of12-md\"><div style=\"background-color:lightblue;\">c-layout__item u-4of12-md</div></div>\n </div>\n\n <div class=\"c-layout c-layout--reverse c-layout--medium\" style=\"margin-bottom:1rem;\">\n <div class=\"c-layout__item u-8of12-md\"><div style=\"background-color:lightblue;\">c-layout--rev c-layout__item u-8of12-md</div></div>\n <div class=\"c-layout__item u-4of12-md\"><div style=\"background-color:lightblue;\">c-layout--rev c-layout__item u-4of12-md</div></div>\n </div>\n\n <div class=\"c-layout c-layout--center c-layout--medium\" style=\"margin-bottom:1rem;\">\n <div class=\"c-layout__item u-8of12-md\"><div style=\"background-color:lightblue;\">c-layout--center c-layout__item u-8of12-md</div></div>\n </div>\n\n <div class=\"c-layout c-layout--medium c-layout--col2-sm c-layout--col3-md\" style=\"margin-bottom:1rem;\">\n <div class=\"c-layout__item\"><div style=\"background-color:lightblue;\">c-layout__item c-layout--col2-sm c-layout--col3-md</div></div>\n <div class=\"c-layout__item\"><div style=\"background-color:lightblue;\">c-layout__item c-layout--col2-sm c-layout--col3-md</div></div>\n <div class=\"c-layout__item\"><div style=\"background-color:lightblue;\">c-layout__item c-layout--col2-sm c-layout--col3-md</div></div>\n </div>\n\n <div class=\"c-layout c-layout--col4and8\" style=\"margin-bottom:1rem;\">\n <div class=\"c-layout__item\"><div style=\"background-color:lightblue;\">c-layout__item u-8of12-md</div></div>\n <div class=\"c-layout__item\"><div style=\"background-color:lightblue;\">c-layout__item u-4of12-md</div></div>\n </div>\n</div>\n```\n*/\n$_layout-gutter: $_white-space !default;\n$_layout-gutter-small: ($_layout-gutter / 2) !default;\n$_layout-gutter-large: ($_layout-gutter * 2) !default;\n\n.c-layout {\n @include _c-layout();\n}\n\n.c-layout__item {\n @include _c-layout__item();\n}\n\n/**\n * ガターを3つのパリエーションから選択します。\n */\n.c-layout--small {\n margin-left: -$_layout-gutter-small;\n > .c-layout__item {\n padding-left: $_layout-gutter-small;\n }\n}\n\n.c-layout--medium {\n margin-left: -$_layout-gutter;\n > .c-layout__item {\n padding-left: $_layout-gutter;\n }\n}\n\n.c-layout--large {\n margin-left: -$_layout-gutter-large;\n > .c-layout__item {\n padding-left: $_layout-gutter-large;\n }\n}\n\n/**\n * 垂直位置を2つのパリエーションから選択します（デフォルトは`top`）。\n */\n.c-layout--middle {\n > .c-layout__item {\n vertical-align: middle;\n }\n}\n\n.c-layout--bottom {\n > .c-layout__item {\n vertical-align: bottom;\n }\n}\n\n/**\n * 要素を中央配置にします（デフォルトは`left`）。\n */\n.c-layout--center {\n text-align: center;\n > .c-layout__item {\n text-align: left;\n }\n}\n\n/**\n * 要素を右端寄せにします（デフォルトは`left`）。\n */\n.c-layout--right {\n text-align: right;\n > .c-layout__item {\n text-align: left;\n }\n}\n\n/**\n * `.c-layout__item`のカラム数をまとめて指定します。\n */\n@include _responsive('.c-layout--col2') {\n > .c-layout__item {\n width: percentage(1 / 2);\n }\n}\n\n@include _responsive('.c-layout--col3') {\n > .c-layout__item {\n width: percentage(1 / 3);\n }\n}\n\n@include _responsive('.c-layout--col4') {\n > .c-layout__item {\n width: percentage(1 / 4);\n }\n}\n\n@include _responsive('.c-layout--col2and10') {\n > .c-layout__item:nth-child(odd) {\n width: percentage(2 / 12);\n }\n > .c-layout__item:nth-child(even) {\n width: percentage(10 / 12);\n }\n}\n\n@include _responsive('.c-layout--col3and9') {\n > .c-layout__item:nth-child(odd) {\n width: percentage(3 / 12);\n }\n > .c-layout__item:nth-child(even) {\n width: percentage(9 / 12);\n }\n}\n\n@include _responsive('.c-layout--col4and8') {\n > .c-layout__item:nth-child(odd) {\n width: percentage(4 / 12);\n }\n > .c-layout__item:nth-child(even) {\n width: percentage(8 / 12);\n }\n}\n\n@include _responsive('.c-layout--col5and7') {\n > .c-layout__item:nth-child(odd) {\n width: percentage(5 / 12);\n }\n > .c-layout__item:nth-child(even) {\n width: percentage(7 / 12);\n }\n}\n\n/**\n * 要素を右から配置させます（HTMLの記述を反転させた状態でレイアウトされます）。\n */\n@include _responsive('.c-layout--reverse') {\n text-align: left;\n direction: rtl;\n > .c-layout__item {\n text-align: left;\n direction: ltr;\n }\n}\n","@mixin _c-layout() {\n display: block;\n margin: 0;\n padding: 0;\n font-size: 0;\n list-style-type: none;\n}\n\n@mixin _c-layout__item() {\n display: inline-block;\n width: 100%;\n font-size: medium;\n font-size: 1rem;\n vertical-align: top;\n}\n","// @desc - class名とルールセットを指定することで、レスポンシブに対応したスタイルを生成します。\n// @param {String} - 共通のclass名をクウォートとドットをつけて渡します（e.g. `.foo`）。\n// @param {Strind} - 使用するブレイクポイントを定義した変数を渡します。\n// @see - foundation/variable/_breakpoint.scss\n// @example scss - Usage\n// @include _responsive(\".display-none\") {\n// display: none;\n// }\n// @example css - CSS output\n// .display-none {\n// display: none;\n// }\n// @media screen and (min-width: 400px) {\n// .display-none-sm {\n// display: none;\n// }\n// }\n@mixin _responsive($class, $bp: $_breakpoint-up) {\n #{$class} {\n @content;\n }\n @each $suffix, $value in $bp {\n @media #{$value} {\n #{$class}-#{$suffix} {\n @content;\n }\n }\n }\n}\n"," /* #Icon\n -------------------------------------------------------------------------- */\n/*doc\n---\ntitle: icon\nname: icon\ncategories: [project]\n---\n\nアイコンフォントを使ったアイコンを表示します。デフォルトでは`:before`擬似要素で表示されます。\nサンプルコードはパンくずリストのホームをアイコンで（2つ目以降はアイコンだけで）示した場合の例です。\n\n装飾的なアイコンは`<span>`と`aria-hidden=\"true\"`でマークアップをします。\n\n意味を伝えたいアイコンは`aria-label=\"\"`でマークアップします。\nテキスト全体を読み上げたときに違和感が出ないようにします。\n\nテキストを表示できない場合は`.u-sr-only`でテキストをマークアップします（非表示のままスクリーンリーダーには読み上げられます）。\n\n```block\n<div>\n <span class=\"p-icon p-icon--home\" aria-hidden=\"true\"></span>ホーム\n</div>\n\n<div>\n <span class=\"p-icon p-icon--home\" aria-label=\"ホーム\"></span>\n</div>\n\n<div>\n <span class=\"p-icon p-icon--home\" aria-hidden=\"true\"></span>\n <span class=\"u-sr-only\">ホーム</span>\n</div>\n```\n*/\n// 任意のクラスの擬似要素で表示する場合は@mixinを使って、\n// ベーススタイルとアイコンの名前を取得します。\n// @example scss\n// .p-list__link {\n// &:after {\n// @include _p-icon;\n// @include _p-icon-name(chevron-right);\n// }\n// }\n@font-face {\n font-family: \"iconfont\";\n src: url('../font/iconfont.eot');\n src: url('../font/iconfont.eot?#iefix') format('eot'),\n url('../font/iconfont.woff') format('woff'),\n url('../font/iconfont.ttf') format('truetype'),\n url('../font/iconfont.svg#iconfont') format('svg');\n font-weight: normal;\n font-style: normal;\n}\n\n// アイコンフォントのベーススタイル\n@mixin _p-icon {\n font-family: \"iconfont\";\n -webkit-font-smoothing: antialiased;\n -moz-osx-font-smoothing: grayscale;\n position: relative;\n top: -0.1em;\n display: inline-block;\n vertical-align: middle;\n font-style: normal;\n font-variant: normal;\n font-weight: normal;\n line-height: 1;\n text-decoration: none;\n text-transform: none;\n speak: none;\n}\n\n/* `p-icon p-icon--icon-name`のようなマルチクラスで指定します。 */\n.p-icon:before {\n @include _p-icon;\n}\n\n@function _icon-char($filename) {\n $char: \"\";\n\n @if $filename == home { $char: \"\\E001\"; }\n\n @return $char;\n}\n\n@mixin _p-icon-name($filename) {\n & { content: _icon-char($filename); }\n}\n\n.p-icon--home:before { @include _p-icon-name(home); }\n\n\n/* 使用中CSS */\n.icon{\n &:after{\n display: block;\n content: \"\";\n }\n}\n.a-icon{\n position: relative;\n display: inline-block;\n width: 32px;\n height: 30px;\n line-height: 1;\n color: inherit;\n vertical-align: top;\n touch-action: manipulation;\n background-color: transparent;\n border: none;\n appearance: none;\n}\n.like-icon{\n position: relative;\n &:after{\n background-size: 33px 30px;\n width: 33px;\n height: 32px;\n position: absolute;\n right: 0;\n top: 0;\n }\n}\n.icon-star{\n &:after{\n background: url(../../assets/img/icon/star-outline-gray.svg) no-repeat;\n }\n &Fill{\n &:after{\n background: url(../../assets/img/icon/star-outline-yellow.svg) no-repeat;\n }\n }\n &-wrap{\n border: 1px solid #D0D0D0;\n border-radius: 8px;\n min-width: 52px;\n height: 52px;\n &:after{\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translateX(-50%) translateY(-50%);\n }\n }\n}\n.icon-search{\n position: absolute;\n top: 0;\n right: 0;\n display: flex;\n align-items: center;\n justify-content: center;\n width: 48px;\n height: 61px;\n cursor: pointer;\n @include pc{\n height: 69px;\n width: 54px;\n }\n &:after{\n background: url(../../assets/img/icon/search-gray.svg) no-repeat;\n background-size: cover;\n width: 20px;\n height: 20px;\n margin-top: 13px;\n @include pc{\n width: 26px;\n height: 26px;\n }\n }\n}\n.icon-calendar{\n position: absolute;\n top: 0;\n right: 0;\n display: flex;\n align-items: center;\n justify-content: center;\n width: 52px;\n height: 60px;\n cursor: pointer;\n @include pc{\n height: 69px;\n width: 58px;\n }\n &:after{\n background: url(../../assets/img/icon/calendar.svg) no-repeat;\n background-size: cover;\n width: 23px;\n height: 25px;\n margin-top: 15px;\n }\n}"," /* #Btn-icon\n -------------------------------------------------------------------------- */\n/*doc\n---\ntitle: btn-icon\nname: btn-icon\ncategories: [project]\n---\n\nボタンコンポーネントです。\n\nModifierは以下のとおりです。\n\n* 100%表示 `-full`\n* width指定 `-w`\n* height指定 `-h`\n* 真円 `-circle`\n* 楕円 `-r`\n\n```block\n```\n*/\n\n/* icon */\n.icon{\n\n}\n.svg{\n &-icon{\n display: inline-block;\n width: 16px;\n height: 16px;\n color: inherit;\n vertical-align: middle;\n fill: none;\n stroke: currentColor;\n }\n &-fill{\n fill: currentColor;\n stroke: none;\n }\n &-up{\n transform: rotate(0deg);\n }\n &-y50{\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n }\n}\n\n.btn{\n &-meeting{\n @include pc{\n padding: 0 5px 0 8px;\n }\n .icon{\n width: 22px;\n height: 22px;\n position: relative;\n @include pc{\n top: -1px;\n padding-left: 11px;\n width: 14px;\n height: 14px;\n }\n }\n }\n}\n\n.btn {\n &-default{\n display: flex;\n align-items: center;\n justify-content: center;\n width: 100%;\n font-size: 1.6rem;\n font-weight: bold;\n border: 1px solid transparent;\n -webkit-transition: all ease-out .2s;\n transition: all ease-out .2s;\n cursor: pointer;\n text-align: center;\n line-height: 1;\n &:hover{\n opacity: 0.7;\n }\n }\n &-yellow{\n background: #F0DE00;\n /* border: 1px solid #F0DE00; */\n border: none;\n }\n /* font-size */\n &-fz14{\n font-size: 1.4rem;\n }\n /* shadow */\n &-shadow{\n box-shadow: 0 1px 4px rgba(0,0,0,0.1);\n }\n}\n/* \n.p-btn {\n display: inline-block;\n margin: 0;\n padding: 0.75em;\n border: none;\n border-radius: 0;\n color: inherit;\n font-family: inherit;\n font-size: inherit;\n line-height: 1;\n text-align: center;\n text-decoration: none;\n background: transparent;\n cursor: pointer;\n appearance: none;\n @include _on-event {\n text-decoration: none;\n }\n &:disabled,\n &.is-disabled {\n opacity: 0.5;\n pointer-events: none;\n }\n &--base{\n display: flex;\n justify-content: center;\n align-items: center;\n }\n &--inner{\n display: flex;\n justify-content: center;\n align-items: center;\n margin-top: 1px;\n }\n}\n*/\n\n.p-btn--full {\n width: 100%;\n}\n\n.p-btn--circle {\n border-radius: 50%;\n}\n\n\n/**\n * 角丸\n */\n.btn-r3 {\n border-radius: 3px;\n} \n.btn-r5 {\n border-radius: 5px;\n}\n.btn-r8 {\n border-radius: 8px;\n}\n.btn-r10 {\n border-radius: 10px;\n}\n.btn-r14{\n border-radius: 10px;\n @include pc{\n border-radius: 14px;\n }\n}\n.btn-r15 {\n border-radius: 15px;\n}\n.btn-r20 {\n border-radius: 20px;\n}\n.btn-r24 {\n border-radius: 24px;\n}\n.btn-r25 {\n border-radius: 25px;\n}\n.btn-r30 {\n border-radius: 5px;\n}\n.btn-r35 {\n border-radius: 35px;\n}\n.btn-r40 {\n border-radius: 40px;\n}\n.btn-r45 {\n border-radius: 45px;\n}\n.btn-r50 {\n border-radius: 50px;\n}\n\n/**\n * width\n */\n\n.btn-w100p{\n max-width: 100%;\n}\n.btn-w56 {\n max-width: 56px;\n}\n.btn-w130 {\n max-width: 130px;\n}\n.btn-w150 {\n max-width: 150px;\n}\n.btn-w170 {\n max-width: 170px;\n}\n.btn-w200 {\n max-width: 200px;\n}\n.btn-w230 {\n max-width: 230px;\n}\n.btn-w250 {\n max-width: 250px;\n}\n.btn-w300 {\n max-width: 300px;\n}\n.btn-w320 {\n max-width: 320px;\n}\n\n\n/**\n * height\n */\n.btn-h28 {\n height: 28px;\n}\n.btn-h30 {\n height: 30px;\n}\n.btn-h42 {\n height: 42px;\n}\n.btn-h45 {\n height: 45px;\n}\n.btn-h48 {\n height: 48px;\n}\n.btn-h50 {\n height: 50px;\n}\n.btn-h52 {\n height: 52px;\n line-height: 48px;\n}\n.btn-h55 {\n height: 55px;\n}\n.btn-h60 { \n height: 60px;\n line-height: 56px;\n}\n.btn-h65 {\n height: 65px;\n}\n.btn-h70 {\n height: 66px;\n @include pc{\n height: 70px;\n } \n}\n.btn-h75 {\n height: 75px;\n}\n.btn-h80 {\n height: 80px;\n}\n.btn-h85 {\n height: 85px;\n}\n.btn-h90 {\n height: 90px;\n}"," /* #Breadcrumb\n -------------------------------------------------------------------------- */\n/*doc\n---\ntitle: breadcrumb\nname: breadcrumb\ncategories: [project]\n---\n\nパンくずリストのコンポーネントです。横幅を超えると、折り返さず省略されます。\n\n```block\n<ol class=\"p-breadcrumb\">\n <li class=\"p-breadcrumb__item\">\n <a href=\"#\" class=\"p-breadcrumb__link\">home</a>\n </li>\n <li class=\"p-breadcrumb__item\">\n <a href=\"#\" class=\"p-breadcrumb__link\">page1</a>\n </li>\n <li class=\"p-breadcrumb__item\">page2</li>\n</ol>\n```\n*/\n.p-breadcrumb {\n overflow: hidden;\n margin: 0;\n padding-left: 0;\n white-space: nowrap;\n text-overflow: ellipsis;\n list-style-type: none;\n}\n\n.p-breadcrumb__item {\n display: inline-block;\n &:last-child {\n display: inline;\n }\n}\n\n.p-breadcrumb__link {\n display: inline-block;\n}\n\n/* 2つ目以降のリストの前に`>`を表示する。 */\n.p-breadcrumb__item:not(:first-of-type):before {\n content: \"\\003E\";\n margin: 0 0.5em;\n}\n","// @desc - クリアーフィックスのスタイルを挿入します。\n// @param {Bool, String} - 引数$importantに\"important\"を渡すと`!important`の指定ができます。\n// @example scss - Usage\n//\n// .foo { @include _clearfix; }\n// .bar { @include _clearfix(important); }\n//\n// @example css - CSS output\n// .foo:after {\n// content: \"\";\n// display: block;\n// clear: both;\n// }\n// .bar:after {\n// content: \"\" !important;\n// display: block !important;\n// clear: both !important;\n// }\n@mixin _clearfix($important: false) {\n @if ($important == \"important\") {\n $important: unquote(\"!important\");\n } @else {\n $important: null;\n }\n &:after {\n content: \"\" $important;\n display: block $important;\n clear: both $important;\n }\n}\n","@mixin _p-box() {\n display: block;\n @include _clearfix;\n}\n\n@mixin _p-box__image($margin-bottom: null) {\n position: relative;\n display: block;\n margin-bottom: $margin-bottom;\n > img {\n width: 100%;\n max-width: none;\n }\n}\n\n@mixin _p-box__labels() {\n position: absolute;\n top: 0;\n right: 0;\n padding-left: 0;\n list-style-type: none;\n @include _clearfix;\n}\n\n@mixin _p-box__label() {\n float: left;\n}\n\n@mixin _p-box__content($padding: 0) {\n display: block;\n padding: $padding;\n > :first-child {\n margin-top: 0;\n }\n > :last-child {\n margin-bottom: 0;\n }\n}\n"," /* #Box\n -------------------------------------------------------------------------- */\n/*doc\n---\ntitle: box\nname: box\ncategories: [project]\n---\n\n画像やテキストなどを縦に並べるコンポーネントです。\n\nラベルはデフォルトで右上に配置されます。Modifierで以下のように変更できます。\n\n- 右下 `.p-box__labels--right-bottom`\n- 左上 `.p-box__labels--left-top`\n- 左下 `.p-box__labels--left-bottom`\n\n```block\n<div class=\"p-box\">\n <div class=\"p-box__image\">\n <img src=\"http://lorempixel.com/600/400/\" alt=\"\">\n <ul class=\"p-box__labels\">\n <li class=\"p-box__label p-label\">ラベル1</li>\n <li class=\"p-box__label p-label\">ラベル2</li>\n </ul>\n </div>\n <div class=\"p-box__content\">\n <h2>見出し</h2>\n <p>文章</p>\n </div>\n</div>\n```\n*/\n.p-box {\n @include _p-box();\n}\n\n.p-box__image {\n @include _p-box__image();\n}\n\n.p-box__labels {\n @include _p-box__labels();\n}\n\n.p-box__labels--right-bottom {\n top: auto;\n bottom: 0;\n}\n\n.p-box__labels--left-top {\n right: auto;\n left: 0;\n}\n\n.p-box__labels--left-bottom {\n top: auto;\n right: auto;\n bottom: 0;\n left: 0;\n}\n\n.p-box__label {\n @include _p-box__label();\n}\n\n.p-box__content {\n @include _p-box__content();\n}\n"," /* #Card\n -------------------------------------------------------------------------- */\n/*doc\n---\ntitle: card\nname: card\ncategories: [project]\n---\n\nカードタイプのコンポーネントです。\n\n```block\n<div class=\"c-layout c-layout--small\">\n <div class=\"c-layout__item u-6of12-md\">\n <div class=\"p-card\">\n <img src=\"http://lorempixel.com/640/340/\" class=\"p-card__image-top\">\n <div class=\"p-card__body\">\n <h2>Card Object</h2>\n <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quaerat illo autem, possimus obcaecati numquam sunt ut quas, repellat cum aspernatur voluptatem, a explicabo! Facilis sed quos, nisi rerum placeat ad?</p>\n </div>\n <ul class=\"p-card__list\">\n <li class=\"p-card__list-item\">list1</li>\n <li class=\"p-card__list-item\">list2</li>\n </ul>\n <div class=\"p-card__foot\">\n <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Impedit, est.</p>\n </div>\n </div>\n </div>\n\n <div class=\"c-layout__item u-6of12-md\">\n <div class=\"p-card\">\n <div class=\"p-card__head\">\n <h2>Card Object</h2>\n <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quaerat illo autem, possimus obcaecati numquam sunt ut quas, repellat cum aspernatur voluptatem, a explicabo! Facilis sed quos, nisi rerum placeat ad?</p>\n </div>\n <ul class=\"p-card__list\">\n <li class=\"p-card__list-item\">list1</li>\n <li class=\"p-card__list-item\">list2</li>\n </ul>\n <img src=\"http://lorempixel.com/640/340/\" class=\"p-card__image-bottom\">\n </div>\n </div>\n</div>\n```\n*/\n\n.p-card {\n}\n\n.p-card__head {\n > :last-child {\n }\n}\n\n.p-card__body {\n > :last-child {\n }\n}\n\n.p-card__foot {\n > :last-child {\n }\n}\n\n.p-card__image,\n.p-card__image-top,\n.p-card__image-bottom {\n max-width: none;\n width: 100%;\n}\n\n.p-card__head,\n.p-card__image-top {\n}\n\n.p-card__foot,\n.p-card__image-bottom {\n}\n\n.p-card__list {\n margin: 0;\n padding: 0;\n list-style-type: none;\n}\n\n.p-card__list-item {\n}\n\n.p-card__list-link {\n display: block;\n}\n"," /* #Form\n -------------------------------------------------------------------------- */\n/*doc\n---\ntitle: form\nname: form\ncategories: [project]\n---\n\nフォーム関係のコンポーネントです。\n\n```block\n```\n*/\n\n.control-label{\n color: $_color-text--gray03;\n line-height: 1;\n padding: 0 8px;\n margin-left: 12px;\n background: #fff;\n position: relative;\n z-index: 1;\n @include pc{\n padding: 0 11px;\n }\n @include sp{\n font-size: 1.4rem;\n }\n}\n.edit-set-file-label{\n color: #93A0A7; \n background-color: #F2F5F7;\n border: 1px dashed #B8C3C9;\n width: 100%;\n height: 50px;\n display: flex;\n align-items: center;\n justify-content: center;\n font-size: 1.4rem;\n font-weight: bold;\n transition: all .2s ease-out;\n cursor: pointer;\n @include pc{\n &:hover{\n opacity: 0.7;\n }\n }\n}\n.input{\n &-default{\n margin-top: -13px;\n }\n &-w380{\n @include pc{\n max-width: 380px;\n }\n }\n &-h56{\n @include pc{\n height: 56px;\n }\n }\n &-h60{\n @include pc{\n height: 60px;\n }\n }\n}\n.textarea{\n &-default{\n margin-top: -13px;\n line-height: 1.7;\n padding-top: 17px;\n @include sp{\n height: 205px;\n }\n }\n}\n@include sp{\n .test{\n display: none;\n }\n}","// base color\n$_color-text: #000 !default;\n$_color-text--gray: #ccc !default;\n$_color-text--gray02: #6f7372 !default;\n$_color-text--gray03: #989898 !default;\n$_color-bg: #fff !default;\n$_color-bg02: #F7FAFC !default;\n\n// link color\n$_color-link--visited: null !default;\n\n// component color\n$_color-ui-gray: #F5F7F8 !default;\n$_color-ui-bg: #fff !default;\n$_color-ui-yellow: #F0DE00 !default;"," /* #Login\n -------------------------------------------------------------------------- */\n/*doc\n---\ntitle: login\nname: login\ncategories: [project]\n---\n\nログイン関係のコンポーネントです。\n\n```block\n```\n*/\n\n.login{\n &-panel{\n .links{\n text-align: center;\n padding: 28px 0 0;\n @include pc{\n padding: 32px 0 0;\n }\n }\n a{\n @include _on-event {\n text-decoration: underline;\n }\n }\n }\n &-submit{\n margin-top: 35px;\n }\n}\n\n.user_remember_me + .login-submit{\n margin-top: 30px;\n}\n","// @desc - マウスオーバーなどのイベントをまとめて指定します。\n// @author - Harry Roberts\n// @param {Bool} $self [false] - Whether or not to include current selector\n// @link https://twitter.com/csswizardry/status/478938530342006784 Original tweet from Harry Roberts\n// @example scss - Usage\n// .foo {\n// @include _on-event{\n// background-color: red;\n// }\n// }\n// @example css - CSS output\n// .foo:hover, .foo:active, .foo:focus {\n// background-color: red;\n// }\n@mixin _on-event($self: false) {\n @if $self {\n &,\n &:hover,\n &:active,\n &:focus {\n @content;\n }\n } @else {\n &:hover,\n &:active,\n &:focus {\n @content;\n }\n }\n}\n"," /* #User\n -------------------------------------------------------------------------- */\n/*doc\n---\ntitle: user\nname: user\ncategories: [project]\n---\n\nユーザー関係のコンポーネントです。\n\n```block\n```\n*/\n\n.user{\n &-advice{\n &-btn{\n width: 142px;\n }\n }\n &-date{\n display: flex;\n align-items: center;\n span{\n color:$_color-text--gray02;\n font-size: 1.24rem;\n letter-spacing: 0.01em;\n @include pc{\n font-size: 1.4rem;\n }\n .date{\n letter-spacing: 0.06em;\n }\n }\n }\n &-updated-time{\n margin-right: 30px;\n @include pc{\n margin-right: 50px;\n }\n }\n &-sm{\n display: flex;\n align-items: flex-end;\n justify-content: space-between;\n a{\n display: flex;\n align-items: center;\n }\n .user{\n &-avatar{\n width: 46px;\n height: 46px;\n border-radius: 23px;\n border: 1px solid #f0de00;\n margin-right: 12px;\n @include pc{\n width: 40px;\n height: 40px;\n border-radius: 20px;\n margin-right: 15px;\n }\n }\n \n }\n }\n}"," /* #Notification\n -------------------------------------------------------------------------- */\n/*doc\n---\ntitle: notification\nname: notification\ncategories: [project]\n---\n\nお知らせアイコンのコンポーネントです。\n\n```block\n```\n*/\n\n.p{\n &-notification{\n padding: 6px 6px 0 0;\n display: block;\n @include sp{\n position: absolute;\n right: 18px;\n top: 18px;\n z-index: 5;\n }\n &-icon{\n width: 44px;\n height: 44px;\n position: relative;\n cursor: pointer;\n color: rgb(51, 51, 51);\n @include pc{\n width: 48px;\n height: 48px;\n }\n @include min{\n width: 40px;\n height: 40px;\n }\n &-wrap{\n .count{\n position: absolute;\n right: -6px;\n top: -6px;\n background-color: #D82828;\n color: rgb(255, 255, 255);\n display: flex;\n flex-direction: row;\n -webkit-box-pack: center;\n justify-content: center;\n -webkit-box-align: center;\n align-items: center;\n z-index: 1;\n border-radius: 200px;\n min-width: 18px;\n height: 18px;\n padding: 2px;\n font-size: 1.2rem;\n font-weight: 500;\n line-height: 1;\n @include pc{\n min-width: 20px;\n height: 20px;\n }\n @include min{\n min-width: 14px;\n height: 14px;\n font-size: 1rem;\n right: -5px;\n top: -5px;\n }\n }\n .icon{\n width: 21px;\n height: 18px;\n @include min{\n width: 18px;\n height: 15px;\n }\n }\n }\n &-bg{\n width: 100%;\n height: 100%;\n background-color: $_color-ui-yellow;\n border-radius: 500px;\n position: absolute;\n top: 0px;\n left: 0px;\n box-shadow: 0 1px 4px rgba(0,0,0,.1);\n }\n }\n \n }\n}"," /* #Meeting\n -------------------------------------------------------------------------- */\n/*doc\n---\ntitle: meeting\nname: meeting\ncategories: [project]\n---\n\n画像やテキストなどを縦に並べるコンポーネントです。\n\nラベルはデフォルトで右上に配置されます。Modifierで以下のように変更できます。\n\n- 右下 `.p-box__labels--right-bottom`\n- 左上 `.p-box__labels--left-top`\n- 左下 `.p-box__labels--left-bottom`\n\n```block\n```\n*/\n@keyframes show{\n from{\n opacity: 0.1;\n }\n to{\n opacity: 1;\n }\n}\n.meeting{\n &-content{\n &-wrap{\n display: none;\n &.is-active{\n display: block;\n animation: show 0.15s linear 0s;\n }\n }\n }\n &-head{\n display: flex;\n align-items:flex-end;\n margin-bottom: 7px;\n @include pc{\n margin-bottom: 10px;\n }\n @include sp{\n width: 100%;\n }\n }\n &-form{\n margin-right: 30px;\n position: relative;\n width: 100%;\n @include pc{\n width: 380px;\n }\n @include sp{\n margin-bottom: 23px;\n margin-top: -13px;\n }\n }\n &-item{\n border-bottom: 1px solid rgba(36,77,138,0.1);\n position: relative;\n .like-icon{\n position: absolute;\n right: 0;\n top: 55px;\n }\n }\n &-link{\n padding: 18px 60px 22px 0;\n display: block;\n @include pc{\n padding: 21px 80px 21px 0;\n }\n @include sp02{\n padding-right: 50px;\n }\n }\n &-ttl{\n font-size: 1.8rem;\n font-weight: bold;\n margin-bottom: 7px;\n line-height: 1.52;\n max-height: 100%;\n @include sp{\n -webkit-box-orient: vertical;\n -webkit-line-clamp: 1;\n overflow: hidden;\n display: -webkit-box;\n margin-bottom: 7px;\n }\n }\n &-txt{\n font-size: 1.4rem;\n color: $_color-text--gray02;\n margin-bottom: 11px;\n line-height: 1.4;\n max-height: 100%;\n @include sp{\n -webkit-box-orient: vertical;\n -webkit-line-clamp: 2;\n overflow: hidden;\n display: -webkit-box;\n }\n }\n &-time{\n margin-bottom: 13px;\n display: block;\n line-height: 1;\n @include pc{\n margin-bottom: 16px;\n }\n }\n &-date{\n font-size: 1.3rem;\n color: $_color-text--gray02;\n letter-spacing: 0.04em;\n }\n &-member{\n &__read{\n margin-left: auto;\n @include pc{\n display: none;\n }\n p{\n color: $_color-text--gray03;\n font-size: 1.4rem;\n }\n }\n &-link{\n display: flex;\n align-items: center;\n cursor: pointer;\n transition: all .2s ease-out;\n @include pc{\n &:hover{\n opacity: 0.7;\n }\n }\n }\n &-count{\n display: table;\n background: $_color-ui-yellow;\n border-radius: 6px;\n padding: 2px 11px;\n margin-right: 13px;\n li{\n font-size: 1.4rem;\n font-weight: bold;\n display: table-cell;\n }\n .numerator{\n position: relative;\n &:after{\n display: inline-block;\n content: '/';\n font-size: 1.3rem;\n position: relative;\n bottom: 1px;\n padding: 0 0.1rem;\n }\n }\n }\n &-list{\n display: flex;\n align-items: center;\n }\n &__item{\n &:not(:first-child){\n margin-left: -3px;\n }\n a{\n display: block;\n transition: all .2s ease-out;\n @include pc{\n &:hover{\n opacity: 0.8;\n }\n }\n }\n .avatar{\n width: 46px;\n height: 46px;\n border-radius: 23px;\n border: 1px solid $_color-ui-yellow;\n @include pc{\n width: 40px;\n height: 40px;\n border-radius: 20px;\n }\n }\n }\n }\n &-tab{\n background: $_color-ui-gray;\n height: 56px;\n display: flex;\n align-items: center;\n border-radius: 16px;\n overflow: hidden;\n position: relative;\n @include pc{\n border-radius: 20px;\n }\n @include sp{\n width: 100%;\n }\n &-container{\n @include pc{\n padding: 35px 35px 50px;\n }\n }\n &-wrap{\n display: flex;\n flex-wrap: wrap;\n .tab-switch{\n display: none;\n }\n .tab-label{\n font-weight: 500;\n text-transform: uppercase;\n display: flex;\n align-items: center;\n justify-content: center;\n height: 100%;\n width: 50%;\n position: relative;\n letter-spacing: 0.03em;\n background: #f0f0f0;\n cursor: pointer;\n @include pc{\n width: 190px;\n }\n &.is-active{\n span{\n color: #fff;\n font-weight: bold;\n }\n }\n span{\n position: relative;\n z-index: 2;\n color: #6f7372;\n max-height: 100%;\n }\n &:first-child{\n &:before{\n content: \"\";\n width: 100%;\n height: 100%;\n position: absolute;\n top: 0;\n left: 100%;\n z-index: 1;\n transition: 0.3s ease all;\n background: #000;\n color: #fff;\n border-radius: 16px;\n @include pc{\n width: 190px;\n border-radius: 20px;\n left: 190px;\n }\n }\n &.is-active{\n &:before{\n left: 0px;\n }\n }\n }\n }\n }\n }\n}\n\n.p{\n &-meetingAdd{\n &-btn{\n width: 64px;\n display: flex;\n @include pc{\n width: 181px;\n }\n @include sp02{\n width: 58px;\n }\n @include sp{\n position: fixed;\n right: 20px;\n bottom: 76px;\n z-index: 5;\n @include sp02{\n bottom: 74px;\n }\n .btn-r8{\n border-radius: 35px;\n }\n .btn-h48{\n height: 64px;\n @include sp02{\n height: 58px;\n }\n }\n \n span{\n display: none;\n }\n }\n }\n }\n &-consent{\n &-btn{\n display: flex;\n width: 64px;\n @include sp{\n width: 62px;\n position: fixed;\n right: 20px;\n bottom: 72px;\n z-index: 5;\n .btn-r8{\n border-radius: 35px;\n }\n .btn-h42{\n height: 62px;\n }\n \n span{\n font-size: 1.6rem;\n }\n }\n }\n }\n}\n\n\n.meeting-consent{\n .meeting{\n &-item{\n padding: 17px 0 22px;\n @include pc{\n padding: 19px 0 21px;\n }\n }\n &-link{\n padding: 9px 0 14px;\n @include pc{\n padding: 10px 0 11px;\n }\n }\n &-txt{\n margin-bottom: 0;\n }\n &-label{\n background: #EAEFF2;\n width: 120px;\n height: 34px;\n border-radius: 17px;\n display: flex;\n align-items: center;\n justify-content: center;\n font-size: 1.4rem;\n margin-bottom: 12px;\n font-weight: bold;\n }\n &-search{\n .meeting-head{\n margin-bottom: 14px;\n }\n }\n }\n .p-article{\n &__content{\n .meeting{\n &-time{\n margin-bottom: 18px;\n @include pc{\n margin-bottom: 13px;\n }\n }\n }\n }\n &__context{\n margin-top: 21px;\n }\n &-single{\n .meeting-ttl{\n margin-bottom: 6px;\n @include sp{\n overflow: visible;\n display: block;\n -webkit-line-clamp: auto;\n }\n }\n }\n }\n .search-item{\n .user-name{\n margin-bottom: 0;\n font-weight: normal;\n }\n }\n \n}\n/* meeting-consent */\n/*\n.meeting-consent{\n .meeting-link{\n padding-right: 0;\n }\n .like-icon{\n display: none;\n }\n}\nいらないかも */\n\n/* meeting-search */\n.meeting-search{\n .meeting-head{\n @include sp{\n display: block;\n }\n }\n}"," /* #Article\n -------------------------------------------------------------------------- */\n/*doc\n---\ntitle: article\nname: article\ncategories: [project]\n---\n\n記事に関するコンポーネントです。\n\n```block\n```\n*/\n\n.p-article{\n &-wrap{\n @include pc{\n padding: 30px 35px 50px;\n }\n }\n\n &__content{\n .meeting-member{\n margin-bottom: 15px;\n }\n .meeting-ttl{\n @include pc{\n margin-bottom: 3px;\n }\n }\n .meeting-time{\n margin-bottom: 25px;\n }\n }\n &__txt{\n margin-bottom: 15px;\n max-height: 100%;\n }\n &__pdf{\n display: flex;\n justify-content: space-between;\n margin-bottom: 25px;\n &__btn{\n width: 100%;\n margin-right: 20px;\n }\n }\n &-btn{\n &-list{\n display: flex;\n justify-content: space-between;\n padding-bottom: 25px;\n }\n &__item{\n width: 23.5%;\n a{\n @include sp{\n font-size: 1.5rem;\n }\n }\n }\n }\n .meeting-member-count{\n @include sp{\n display: none;\n }\n }\n .meeting-member__item{\n .avatar{\n @include sp{\n width: 38px;\n height: 38px;\n }\n @include min{\n width: 30px;\n height: 30px;\n }\n }\n }\n .meeting-member-link{\n @include sp{\n margin-bottom: 20px;\n }\n }\n}\n.p-article__context{\n width: 100%;\n}\n.p-article__content{\n width: 100%;\n}\n.p-file{\n &-list{\n margin-bottom: 25px;\n max-width: 700px;\n }\n &-for{\n padding: 50px 0;\n border: 1px solid rgba(36,77,138,.1);\n border-radius: 6px;\n margin-bottom: 15px;\n @include pc{\n padding: 80px 0;\n }\n }\n &-nav{\n display: flex;\n align-items: center;\n overflow-x: auto;\n width: 100%;\n max-width: 100%;\n @include pc{\n max-width: 495px;\n }\n figure{\n width: calc((100% - 220px) / 3);\n min-width: 54px;\n margin-right: 10px;\n border: 1px solid rgba(36,77,138,.1);\n transition: all .2s ease-out;\n cursor: pointer;\n overflow: hidden;\n position: relative;\n @include pc{\n &:hover{\n opacity: 0.8;\n }\n }\n &:before{\n content: \"\";\n display: block;\n padding-top: 100%;\n }\n img{\n position: absolute;\n width: 100%;\n height: 100%;\n top: 0;\n right: 0;\n bottom: 0;\n left: 0;\n margin: auto;\n -o-object-fit: cover;\n object-fit: cover;\n font-family: \"object-fit: cover;\";\n }\n }\n }\n &-image{\n display: flex;\n flex-wrap: wrap;\n margin: 8px -6px;\n align-items: center;\n justify-content: space-between;\n figure{\n width: calc(20% - 12px);\n overflow: hidden;\n margin: 10px 5px 0;\n border: 1px solid rgba(36,77,138,.1);\n transition: all .2s ease-out;\n position: relative;\n @include pc{\n &:hover{\n opacity: 0.8;\n }\n }\n &:before{\n content: \"\";\n display: block;\n padding-top: 100%;\n }\n &:last-child{\n @include sp{\n margin-right: auto;\n }\n }\n img{\n position: absolute;\n width: 100%;\n height: 100%;\n top: 0;\n right: 0;\n bottom: 0;\n left: 0;\n margin: auto;\n object-fit: cover;\n font-family: 'object-fit: cover;';\n }\n &.image-upload{\n cursor: pointer;\n &:after{\n display: block;\n content: \"\";\n width: 22px;\n height: 22px;\n border-radius: 11px;\n background-image: url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 21 21'%3E%3Ccircle cx='10.5' cy='10.5' r='10.5' style='fill:%23d82828'/%3E%3Cline x1='4' y1='10.5' x2='17' y2='10.5' style='fill:none;stroke:%23fff'/%3E%3C/svg%3E\");\n position: absolute;\n right: 2px;\n bottom: 2px;\n box-shadow: 0 0px 4px rgb(0 0 0 / 30%);\n @include sp{\n width: 18px;\n height: 18px;\n border-radius: 9px;\n }\n }\n \n }\n \n }\n }\n}"," /* #Modal\n -------------------------------------------------------------------------- */\n/*doc\n---\ntitle: modal\nname: modal\ncategories: [project]\n---\n\nモーダル関係のコンポーネントです。\n\n```block\n```\n*/\n\n@keyframes show{\n from{\n opacity: 0.1;\n }\n to{\n opacity: 1;\n }\n}\n.modal{\n &-area{\n position: fixed;\n z-index: 10;\n top: 0;\n left: 0;\n width: 100%;\n height: 100vh;\n &.modal01{\n .modal-wrap{\n padding-bottom: 9px;\n }\n }\n }\n &-pd{\n .modal-ttl{\n padding: 0;\n }\n .modal-wrap{\n padding: 30px 20px;\n }\n }\n &-bg{\n width: 100%;\n height: 100%;\n background-color: rgba(30,30,30,0.5);\n }\n &-wrap{\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%,-50%);\n width: 70%;\n background-color: #fff;\n border-radius: 20px;\n max-width: 340px;\n box-sizing: border-box;\n @include sp{\n width: 82%;\n }\n @include min{\n width: 88%;\n }\n }\n &-box{\n\n }\n &-up65{\n .modal-wrap{\n top: 0px;\n transform: translate(-50%,65px);\n @include pc{\n top: 65px;\n }\n }\n }\n &-content{\n display: none;\n &.is-active{\n display: block;\n animation: show 0.15s linear 0s;\n }\n &-area{\n padding: 19px 25px 27px 20px;\n @include pc{\n padding: 24px 30px 33px 25px;\n }\n }\n &-item{\n display: flex;\n align-items: center;\n justify-content: space-between;\n &:not(:first-child){\n margin-top: 23px;\n }\n .user{\n &-wrap{\n a{\n display: flex;\n align-items: center;\n transition: all .2s ease-out;\n }\n }\n &-avatar{\n min-width: 40px;\n width: 40px;\n height: 40px;\n border-radius: 20px;\n border: 1px solid #f0de00;\n margin-right: 15px;\n }\n }\n }\n }\n &-ttl{\n text-align: center;\n padding: 30px 20px 0px;\n @include sp{\n padding-top: 28px;\n }\n }\n &-answer{\n display: flex;\n align-items: center;\n justify-content: center;\n width: 84%;\n margin: 0 auto;\n li{\n width: 50%;\n p,a{\n font-weight: bold;\n text-align: center;\n display: block;\n padding: 23px 0 30px;\n cursor: pointer;\n transition: all .2s ease-out;\n }\n }\n }\n &-tab{\n &-area{\n display: flex;\n align-items: center;\n justify-content: center;\n border-bottom: 1px solid rgba(36,77,138,.1);\n \n }\n &-label{\n width: 50%;\n text-align: center;\n cursor: pointer;\n padding: 20px 0 18px;\n span{\n color: #6f7372;\n }\n &.is-active{\n span{\n font-weight: 700;\n color: #000;\n }\n }\n }\n }\n &-close-btn{\n position: absolute;\n right: 16px;\n top: 16px;\n cursor: pointer;\n }\n}\n\n.p-notification{\n &-btn{\n width: 100%;\n max-width: 62px;\n }\n}"," /* #Search\n -------------------------------------------------------------------------- */\n/*doc\n---\ntitle: search\nname: search\ncategories: [project]\n---\n\n検索ページ関係のコンポーネントです。\n\n```block\n```\n*/\n\n.search{\n &-container{\n @include pc{\n padding: 10px 32px;\n }\n }\n &-wrap{\n\n }\n &-content{\n\n }\n &-item{\n &:not(:last-child){\n border-bottom: 1px solid rgba(36,77,138,.1);\n }\n &:first-child{\n @include sp{\n border-top: 1px solid rgba(36,77,138,.1);\n }\n }\n &:last-child{\n @include sp{\n border-bottom: 1px solid rgba(36,77,138,.1);\n }\n }\n a{\n display: block;\n padding: 11px 0;\n position: relative;\n @include pc{\n padding: 15px 0;\n }\n &:after{\n display: block;\n content: \"\";\n position: absolute;\n left: -32px;\n top: 0;\n width: calc(100% + 64px);\n height: 100%;\n opacity: 0;\n background: #f8f8f8;\n transition: .3s;\n z-index: 1;\n }\n &:hover{\n &:after{\n opacity: 1;\n }\n }\n }\n .user{\n &-wrap{\n display: flex;\n align-items: center;\n position: relative;\n z-index: 2;\n }\n &-avatar{\n min-width: 60px;\n width: 60px;\n height: 60px;\n border-radius: 30px;\n border: 1px solid #f0de00;\n margin-right: 13px;\n @include pc{\n margin-right: 15px;\n }\n }\n &-info{\n\n }\n &-name{\n font-weight: bold;\n margin-bottom: 6px;\n line-height: 1.3;\n padding-right: 15px;\n }\n &-tel{\n font-size: 1.4rem;\n line-height: 1;\n margin-bottom: 2px;\n }\n }\n }\n}"," /* #Profile\n -------------------------------------------------------------------------- */\n/*doc\n---\ntitle: profile\nname: profile\ncategories: [project]\n---\n\nプロフィールページ関係のコンポーネントです。\n\n```block\n```\n*/\n\n.profile{\n &-container{\n\n }\n &-wrap{\n padding: 10px 0 40px;\n @include pc{\n padding: 45px 0 40px;\n }\n }\n &-content{\n max-width: 100%;\n margin: 0 auto;\n @include pc{\n max-width: 380px; \n }\n }\n &-thumb{\n margin: 0 auto;\n width: 220px;\n height: 220px;\n border-radius: 110px;\n position: relative;\n label{\n cursor: pointer;\n }\n label,figure{\n display: flex;\n vertical-align: middle;\n text-align: center;\n position: relative;\n overflow: hidden;\n border-radius: 50%;\n width: 220px;\n height: 220px;\n }\n &__image{\n width: 220px;\n height: 220px;\n object-fit: cover;\n font-family: 'object-fit: cover;';\n }\n\n }\n &-camera{\n width: 52px;\n height: 52px;\n position: absolute;\n bottom: 0;\n right: 0;\n .btn-camera{\n width: 52px;\n height: 52px;\n background-color: #f0de00;\n border-radius: 26px;\n position: relative;\n &:hover{\n opacity: 1;\n .icon{\n opacity: 0.6;\n }\n }\n .icon{\n transition: all .2s ease-out;\n &:after{\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translateX(-50%) translateY(-50%);\n width: 22px;\n height: 18px;\n background-repeat: no-repeat;\n background-position: center center;\n background-size: 100% auto;\n background-image: url(../../assets/img/icon/camera.svg);\n }\n }\n }\n }\n &-name{\n font-weight: bold;\n font-size: 2.2rem;\n text-align: center;\n padding: 13px 0 30px;\n letter-spacing: 0.06em;\n @include pc{\n font-size: 1.8rem;\n padding: 17px 0 25px;\n }\n }\n &-info{\n background: $_color-ui-gray;\n border-radius: 4px;\n margin-bottom: 30px;\n @include pc{\n margin-bottom: 35px;\n }\n &__item{\n display: flex;\n align-items: center;\n padding: 15px 20px 15px 15px;\n position: relative;\n @include pc{\n padding: 15px 30px 15px 20px;\n }\n &:not(:first-child){\n border-top: 1px solid #EAEFF2;\n }\n .txt{\n margin-left: 35px;\n max-height: 100%;\n }\n &.txt-long{\n .txt{\n padding-bottom: 10px;\n }\n }\n }\n &__icon{\n -ms-flex-negative: 0;\n flex-shrink: 0;\n width: 22px;\n height: 22px;\n position: absolute;\n top: 50%;\n left: 15px;\n transform: translateY(-50%);\n @include pc{\n left: 20px;\n }\n }\n }\n}\n\n.p-profile-btn{\n + .p-profile-btn{\n margin-top: 17px;\n }\n + .p-profile-txtLink{\n margin-top: 43px;\n @include pc{\n margin-top: 37px;\n }\n }\n}\n\n.p-profile-txtLink{\n text-align: center;\n .a-icon{\n width: auto;\n }\n + .p-profile-txtLink{\n margin-top: 7px;\n }\n}\n\n#profile{\n &-file{\n &-preview{\n width: 220px;\n height: 220px;\n -o-object-fit: cover;\n object-fit: cover;\n border-radius: 110px;\n overflow: hidden;\n border: 1px solid #d0d0d0;\n box-sizing: border-box;\n font-family: \"object-fit: cover;\";\n }\n }\n}"," /* #Edit\n -------------------------------------------------------------------------- */\n/*doc\n---\ntitle: edit\nname: edit\ncategories: [project]\n---\n\nエディット関係のコンポーネントです。\n\n```block\n```\n*/\n\n.edit{\n &-container{\n\n }\n &-wrap{\n @include pc{\n padding: 38px 40px 55px;\n }\n }\n &-content{\n .btn-user-add{\n margin: 19px auto 0;\n }\n }\n &-bg{\n background: $_color-ui-gray;\n border-radius: 4px;\n padding: 22px 26px 15px;\n margin-top: 18px;\n @include sp{\n margin-top: 23px;\n padding: 25px 23px 15px;\n }\n .checkbox{\n margin-bottom: 10px;\n @include sp{\n margin-bottom: 13px;\n }\n }\n }\n &-form{\n .btn-edit{\n margin-top: 35px;\n @include sp{\n margin-top: 25px;\n font-size: 1.8rem;\n }\n }\n }\n &-set{\n position: relative;\n &:not(:first-child){\n margin-top: 14px;\n @include pc{\n margin-top: 19px;\n }\n }\n &-mt5{\n margin-top: 5px !important;\n @include sp{\n margin-top: 13px !important;\n }\n }\n &-mt10{\n margin-top: 10px !important;\n }\n &-mt15{\n margin-top: 15px !important;\n }\n &-bg{\n background: $_color-ui-gray;\n border-radius: 3px;\n padding: 18px 22px;\n @include pc{\n padding: 17px 25px;\n }\n }\n &-file{\n &__txt{\n color: #93A0A7;\n font-weight: bold;\n font-size: 1.4rem;\n text-align: center;\n }\n }\n &.user_remember_me{\n margin-top: 30px;\n margin-bottom: 30px;\n .checkbox{\n text-align: center;\n }\n }\n &.edit-set-send{\n margin-top: 25px;\n @include pc{\n margin-top: 22px;\n }\n }\n }\n &-user{\n &-wrap{\n margin-top: 38px;\n @include pc{\n margin-top: 43px;\n }\n }\n &-thumb{\n margin: 0 auto;\n width: 128px;\n height: 128px;\n border-radius: 110px;\n position: relative;\n figure{\n display: -webkit-box;\n display: -ms-flexbox;\n display: flex;\n vertical-align: middle;\n text-align: center;\n position: relative;\n overflow: hidden;\n border-radius: 50%;\n }\n &__image{\n width: 128px;\n height: 128px;\n object-fit: cover;\n font-family: 'object-fit: cover;';\n }\n }\n &-name{\n font-weight: bold;\n font-size: 1.8rem;\n text-align: center;\n padding: 11px 0 0;\n letter-spacing: 0.07em;\n @include pc{\n font-size: 1.4rem;\n padding: 13px 0 0;\n }\n }\n &-txt{\n text-align: center;\n color: $_color-text--gray03;\n margin-top: 15px;\n @include pc{\n font-size: 1.4rem;\n }\n }\n }\n &-txtLink{\n margin-top: 32px;\n text-align: center;\n .a-icon{\n width: auto;\n }\n }\n}\n\n/* バリデーション関係 */\n.validation{\n &_error{\n border: 1px solid #e71e14 !important;\n }\n}\n.error{\n &_area{\n background: #f2eaea;\n border-radius: 4px;\n margin-top: 12px;\n padding: 12px 20px;\n @include sp{\n padding: 12px 18px;\n }\n &.area_top{\n margin-bottom: 30px;\n padding: 15px 20px;\n @include sp{\n margin-bottom: 25px;\n }\n }\n p{\n color: #e71e14;\n font-size: 1.5rem;\n @include sp{\n line-height: 1.5;\n }\n }\n }\n}\n\n\n\n.checkbox{\n label{\n letter-spacing: 0.06em;\n }\n .label-lsnone{\n letter-spacing: 0;\n }\n}\n","/* -----------------------------------------------------------------------------\n #Text\n -------------------------------------------------------------------------- */\n/*doc\n---\ntitle: text\nname: text\ncategories: [utility]\n---\n\nテキストのスタイルを指定する汎用クラスです。\n\n```block\n<p class=\"u-text-light\">font-weight 300</p>\n<p class=\"u-text-normal\">font-weight 400</p>\n<p class=\"u-text-bold\">font-weight 600</p>\n<p class=\"u-text-indent\">先頭の1文字目を1文字分字下げします。</p>\n<p class=\"u-text-note\">2行目以降の1文字目を1文字分字下げします。<br>2行目以降の1文字目を1文字分字下げします。</p>\n<p class=\"u-text-nowrap\">テキストを折り返させません。横幅を超えても、このテキストは折り返さずに表示されます。</p>\n<p class=\"u-text-breakword\">テキストを折り返させます。長文になっても、このテキストは必ず折り返して表示されます。</p>\n<p class=\"u-text-justify\">テキストを両端揃え（均等割り付け）させます。通常のテキストと文字間が違うのが分かると思います。</p>\n<p class=\"u-text-none\">記述した通りに表示します。</p>\n<p class=\"u-text-lowercase\">abcdEFGH すべての英単語を小文字で表示します。</p>\n<p class=\"u-text-uppercase\">abcdEFGH すべての英単語を大文字で表示します。</p>\n<p class=\"u-text-capitalize\">abcdEFGH 英単語の先頭を大文字で表示します。</p>\n<p class=\"u-text-smallcaps\">abcdEFGH スモールキャップ（小文字と同じ高さで作られた大文字）で表示します。</p>\n<p class=\"u-text-vertical\">abcdEFGH 縦書きで表示します。</p>\n<p class=\"u-text-vertical u-text-vertical--upright\">abcdEFGH 英文も縦書きにする場合はModifierを指定します。</p>\n<p class=\"u-text-right\">text-align right</p>\n<p class=\"u-text-center\">text-align center</p>\n<p class=\"u-text-left\">text-align left</p>\n<p class=\"u-text-top\">vertical-align top</p>\n<p class=\"u-text-middle\">vertical-align middle</p>\n<p class=\"u-text-bottom\">vertical-align bottom</p>\n<p class=\"u-text-baseline\">vertical-align baseline</p>\n```\n*/\n\n/* font-weightを指定します。 */\n.u-text-light {\n font-weight: $_font-weight-light !important;\n}\n\n.u-text-normal {\n font-weight: $_font-weight-normal !important;\n}\n\n.u-text-bold {\n font-weight: $_font-weight-bold !important;\n}\n\n/* 先頭の1文字目を1文字分字下げします。 */\n.u-text-indent {\n text-indent: 1em !important;\n}\n\n/* 2行目以降の1文字目を1文字分字下げします。 */\n.u-text-note {\n margin-left: 1em !important;\n text-indent: -1em !important;\n}\n\n/* テキストを改行させません。 */\n.u-text-nowrap {\n white-space: nowrap !important;\n}\n\n/* テキストを改行させます。 */\n.u-text-breakword {\n word-wrap: break-word !important;\n overflow-wrap: break-word !important;\n}\n\n/* テキストを両端揃えさせます。 */\n.u-text-justify {\n text-align: justify !important;\n text-justify: inter-ideograph !important;\n}\n\n/* 記述した通りに表示します。 */\n.u-text-none {\n text-transform: none !important;\n}\n\n/* すべての英単語を小文字にします。 */\n.u-text-lowercase {\n text-transform: lowercase !important;\n}\n\n/* すべての英単語を大文字にします。 */\n.u-text-uppercase {\n text-transform: uppercase !important;\n}\n\n/* 英単語の先頭を大文字にします。 */\n.u-text-capitalize {\n text-transform: capitalize !important;\n}\n\n/* スモールキャップ（小文字と同じ高さで作られた大文字）にします。 */\n.u-text-smallcaps {\n font-variant: small-caps !important;\n}\n\n/* 縦書きにします。 */\n.u-text-vertical {\n writing-mode: vertical-rl !important;\n text-orientation: mixed !important;\n}\n\n/* 英文も縦書きにする場合はModifierを指定します。 */\n.u-text-vertical--upright {\n text-orientation: upright !important;\n}\n\n.u-text-right {\n text-align: right !important;\n}\n.u-text-center {\n text-align: center !important;\n}\n.u-text-left {\n text-align: left !important;\n}\n@media screen and (max-width: 1023px){\n .u-text_r-lg-c {\n text-align: center !important;\n }\n .u-text_r-lg-l {\n text-align: left !important;\n }\n .u-text_c-lg-r {\n text-align: right !important;\n }\n .u-text_c-lg-l {\n text-align: left !important;\n }\n .u-text_l-lg-c {\n text-align: center !important;\n }\n .u-text_l-lg-r {\n text-align: right !important;\n }\n}\n@media print, screen and (min-width:768px) {\n .u-text_r-sm-c {\n text-align: center !important;\n }\n .u-text_r-sm-l {\n text-align: left !important;\n }\n .u-text_c-sm-r {\n text-align: right !important;\n }\n .u-text_c-sm-l {\n text-align: left !important;\n }\n .u-text_l-sm-c {\n text-align: center !important;\n }\n .u-text_l-sm-r {\n text-align: right !important;\n }\n}\n\n.u-text-top {\n vertical-align: top !important;\n}\n.u-text-middle {\n vertical-align: middle !important;\n}\n.u-text-bottom {\n vertical-align: bottom !important;\n}\n.u-text-baseline {\n vertical-align: baseline !important;\n}"," /* #Align\n -------------------------------------------------------------------------- */\n/*doc\n---\ntitle: align\nname: align\ncategories: [utility]\n---\n\n画像などを左右や中央に配置します。\n\n```block\n<div class=\"c-wrapper\">\n <img src=\"http://lorempixel.com/150/150/\">\n <img src=\"http://lorempixel.com/150/150/\" class=\"u-align-center\">\n <img src=\"http://lorempixel.com/150/150/\" class=\"u-align-right\">\n</div>\n```\n*/\n.u-align-left {\n display: block !important;\n margin-left: 0 !important;\n margin-right: auto !important;\n}\n\n.u-align-center {\n display: block !important;\n margin-right: auto !important;\n margin-left: auto !important;\n}\n\n.u-align-right {\n display: block !important;\n margin-left: auto !important;\n margin-right: 0 !important;\n}"," /* #Margin\n -------------------------------------------------------------------------- */\n/*doc\n---\ntitle: margin\nname: margin\ncategories: [utility]\n---\n\nマージンで余白の管理をします。常に下方向にだけ余白をとります。\n`<section>`要素を使うようなセクションの余白はlayout/_section.scssで管理します。\n\n* `.u-mb`は常に余白をとります。\n* `.u-mb-gain`はあるブレイクポイント以上で余白を指定します。\n* `.u-mb-lose`はあるブレイクポイント以上で余白を無くします。\n\n\n```block\n```\n*/\n/* 常に余白を指定するクラス。 */\n.u-mb-auto {\n margin-bottom: auto !important;\n}\n.u-mb0 {\n margin-bottom: 0 !important;\n}\n.u-mb5 {\n margin-bottom: 5px !important;\n}\n.u-mb10 {\n margin-bottom: 10px !important;\n}\n.u-mb15 {\n margin-bottom: 15px !important;\n}\n.u-mb20 {\n margin-bottom: 20px !important;\n}\n.u-mb25 {\n margin-bottom: 25px !important;\n}\n.u-mb30 {\n margin-bottom: 30px !important;\n}\n.u-mb35 {\n margin-bottom: 35px !important;\n}\n.u-mb40 {\n margin-bottom: 40px !important;\n}\n.u-mb45 {\n margin-bottom: 45px !important;\n}\n.u-mb50 {\n margin-bottom: 50px !important;\n}\n.u-mb55 {\n margin-bottom: 55px !important;\n}\n.u-mb60 {\n margin-bottom: 60px !important;\n}\n.u-mb65 {\n margin-bottom: 65px !important;\n}\n.u-mb70 {\n margin-bottom: 70px !important;\n}\n.u-mb75 {\n margin-bottom: 75px !important;\n}\n.u-mb80 {\n margin-bottom: 80px !important;\n}\n.u-mb-small {\n margin-bottom: 0.5em !important;\n @include pc {\n margin-bottom: 1em !important;\n }\n}\n\n\n/* ブレイクポイント以上 */\n@include sp {\n .u-mb0-gain {\n margin-bottom: 0 !important;\n }\n .u-mb5-gain {\n margin-bottom: 5px !important;\n }\n .u-mb10-gain {\n margin-bottom: 10px !important;\n }\n .u-mb15-gain {\n margin-bottom: 15px !important;\n }\n .u-mb20-gain {\n margin-bottom: 20px !important;\n }\n .u-mb25-gain {\n margin-bottom: 25px !important;\n }\n .u-mb30-gain {\n margin-bottom: 30px !important;\n }\n .u-mb35-gain {\n margin-bottom: 35px !important;\n }\n .u-mb40-gain {\n margin-bottom: 40px !important;\n }\n .u-mb45-gain {\n margin-bottom: 45px !important;\n }\n .u-mb50-gain {\n margin-bottom: 50px !important;\n }\n .u-mb55-gain {\n margin-bottom: 55px !important;\n }\n .u-mb60-gain {\n margin-bottom: 60px !important;\n }\n .u-mb65-gain {\n margin-bottom: 65px !important;\n }\n .u-mb70-gain {\n margin-bottom: 70px !important;\n }\n .u-mb75-gain {\n margin-bottom: 75px !important;\n }\n .u-mb80-gain {\n margin-bottom: 80px !important;\n }\n}\n\n\n\n/* ブレイクポイント以上 */\n@include pc {\n .u-mb0-lose {\n margin-bottom: 0 !important;\n }\n .u-mb5-lose {\n margin-bottom: 5px !important;\n }\n .u-mb10-lose {\n margin-bottom: 10px !important;\n }\n .u-mb15-lose {\n margin-bottom: 15px !important;\n }\n .u-mb20-lose {\n margin-bottom: 20px !important;\n }\n .u-mb25-lose {\n margin-bottom: 25px !important;\n }\n .u-mb30-lose {\n margin-bottom: 30px !important;\n }\n .u-mb35-lose {\n margin-bottom: 35px !important;\n }\n .u-mb40-lose {\n margin-bottom: 40px !important;\n }\n .u-mb45-lose {\n margin-bottom: 45px !important;\n }\n .u-mb50-lose {\n margin-bottom: 50px !important;\n }\n .u-mb55-lose {\n margin-bottom: 55px !important;\n }\n .u-mb60-lose {\n margin-bottom: 60px !important;\n }\n .u-mb65-lose {\n margin-bottom: 65px !important;\n }\n .u-mb70-lose {\n margin-bottom: 70px !important;\n }\n .u-mb75-lose {\n margin-bottom: 75px !important;\n }\n .u-mb80-lose {\n margin-bottom: 80px !important;\n }\n}\n\n"," /* #Display\n -------------------------------------------------------------------------- */\n/*doc\n---\ntitle: display\nname: display\ncategories: [utility]\n---\n\n表示非表示を切り替えます。改行位置のコントロールもできます。\n\n```block\n<p class=\"u-dn-md\"><code>$-md</code>以降は非表示になります。</p>\n<p class=\"u-dn u-db-md\"><code>$-md</code>以降は表示されます。</p>\n<p>基本はなりゆきでウィンドウサイズが狭くなると、<span class=\"u-dib\">ここから改行されます。</span></p>\n<p><code>$-md</code>以降になると、<span class=\"u-db-md\">ここから改行されます。</span></p>\n```\n*/\n@include _responsive(\".u-dn\") {\n display: none !important;\n}\n\n@include _responsive(\".u-db\") {\n display: block !important;\n}\n\n@include _responsive(\".u-di\") {\n display: inline !important;\n}\n\n@include _responsive(\".u-dib\") {\n display: inline-block !important;\n}\n"," /* #Percent\n -------------------------------------------------------------------------- */\n/*doc\n---\ntitle: percent\nname: percent\ncategories: [utility]\n---\n\n`width`プロパティを5%刻みで指定する汎用クラスです。おもに`.c-table--fixed`と一緒に指定します。\n\n```block\n<div class=\"c-wrapper\">\n <table class=\"c-table c-table--medium c-table--fixed\">\n <tr>\n <th class=\"u-percent50\">th1</th>\n <th>th2</th>\n <th>th3</th>\n </tr>\n <tr>\n <td>td1</td>\n <td>td2</td>\n <td>td3</td>\n </tr>\n </table>\n</div>\n```\n*/\n.u-percent5 { width: percentage(5 / 100) !important; }\n.u-percent10 { width: percentage(10 / 100) !important; }\n.u-percent15 { width: percentage(15 / 100) !important; }\n.u-percent20 { width: percentage(20 / 100) !important; }\n.u-percent25 { width: percentage(25 / 100) !important; }\n.u-percent30 { width: percentage(30 / 100) !important; }\n.u-percent35 { width: percentage(35 / 100) !important; }\n.u-percent40 { width: percentage(40 / 100) !important; }\n.u-percent45 { width: percentage(45 / 100) !important; }\n.u-percent50 { width: percentage(50 / 100) !important; }\n.u-percent55 { width: percentage(55 / 100) !important; }\n.u-percent60 { width: percentage(60 / 100) !important; }\n.u-percent65 { width: percentage(65 / 100) !important; }\n.u-percent70 { width: percentage(70 / 100) !important; }\n.u-percent75 { width: percentage(75 / 100) !important; }\n.u-percent80 { width: percentage(80 / 100) !important; }\n.u-percent85 { width: percentage(85 / 100) !important; }\n.u-percent90 { width: percentage(90 / 100) !important; }\n.u-percent95 { width: percentage(95 / 100) !important; }\n.u-percent100 { width: percentage(100 / 100) !important; }\n","// @desc - メディアクエリを`min-width`で挿入します。\n// @param {String} $breakpoint [$_default-breakpoint] - 引数に変数のキーワードを渡します。\n// @see - $_breakpoint-up\n// @example scss - Usage\n// .foo {\n// color: red;\n// @include _mq-up {\n// color: blue;\n// }\n// }\n// @example css - CSS output\n// .foo {\n// color: red;\n// }\n// @media screen and (min-width: 768px) {\n// .foo {\n// color: blue;\n// }\n// }\n@mixin pc($breakpoint: $_default-breakpoint) {\n @if map-has-key($_breakpoint-up, $breakpoint) {\n @media screen and (min-width: 1068px) {\n @content;\n }\n } @else {\n @warn \"Unfortunately, no value could be retrieved from `#{$breakpoint}`. \"\n + \"Please make sure it is defined in `$_breakpoint-up` map.\";\n }\n}\n"," /* #Sr-only\n -------------------------------------------------------------------------- */\n/*doc\n---\ntitle: sr-only\nname: sr-only\ncategories: [utility]\n---\n\n要素を非表示にさせますが、スクリーンリーダーには読み上げられます。\n\n```block\n\n```\n*/\n\n@include pc {\n .v-sp,\n .h-pc {\n display: none ;\n }\n}\n@include sp {\n .v-pc,\n .h-sp {\n display: none ;\n }\n}\n@media screen and (min-width: 1024px) {\n .h-md{\n display: none ;\n }\n}\n@media screen and (max-width: 1023px) {\n .v-md{\n display: none ;\n }\n}\n@media screen and (min-width: 568px) {\n .v-se {\n display: none ;\n }\n}","// @desc - メディアクエリを`max-width`で挿入します。\n// @param {String} $breakpoint [$_default-breakpoint] - 引数に変数のキーワードを渡します。\n// @see - $_breakpoint-down\n// @example scss - Usage\n// .foo {\n// color: red;\n// @include sp {\n// color: blue;\n// }\n// }\n// @example css - CSS output\n// .foo {\n// color: red;\n// }\n// @media screen and (max-width: 767px) {\n// .foo {\n// color: blue;\n// }\n// }\n@mixin sp($breakpoint: $_default-breakpoint) {\n @if map-has-key($_breakpoint-down, $breakpoint) {\n @media screen and (max-width: 1067px) {\n @content;\n }\n } @else {\n @warn \"Unfortunately, no value could be retrieved from `#{$breakpoint}`. \"\n + \"Please make sure it is defined in `$_breakpoint-down` map.\";\n }\n}\n\n@mixin sp02($breakpoint: $_default-breakpoint) {\n @if map-has-key($_breakpoint-down, $breakpoint) {\n @media screen and (max-width: 430px) {\n @content;\n }\n } @else {\n @warn \"Unfortunately, no value could be retrieved from `#{$breakpoint}`. \"\n + \"Please make sure it is defined in `$_breakpoint-down` map.\";\n }\n}\n\n\n@mixin min($breakpoint: $_default-breakpoint) {\n @if map-has-key($_breakpoint-down, $breakpoint) {\n @media screen and (max-width: 374px) {\n @content;\n }\n } @else {\n @warn \"Unfortunately, no value could be retrieved from `#{$breakpoint}`. \"\n + \"Please make sure it is defined in `$_breakpoint-down` map.\";\n }\n}\n"]} |